@charset "utf-8";

body{font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif; font-size: 16px;}
img{max-width: 100%;}
a{text-decoration: none;}
span{display: block;}
.mincho{font-family: 'Shippori Mincho', serif;}
main{margin-top: 0;}

/*--- mv ---*/
img{width: 100%;}

/*--- header ---*/
header{position: fixed; width: 100%; top: 0; left: 0; background-color: #f6f3ef; z-index: 10;}
header .head_inner{padding: 5px 20px; display: flex; align-items: center; justify-content: space-between;}
.head_logo{display: block; max-width: 90px; transition: .3s;}
.head_logo:hover{opacity: .7;}
.head_nav{display: flex; align-items: center; margin-bottom: 0;}
.head_nav li{margin: 0 15px;}
.head_nav li a{font-weight: bold; color: #222; transition: .3s;}
.head_nav li a:hover{opacity: .7;}

/*--- public ---*/
.pink_bg{background-color: #EFEAF0;}
.pink_bg2{background-color: rgba(243, 183, 183, 0.4);}
.sec_inner{padding: 50px 0;}
.sec_tit{text-align: center; margin-bottom: 40px; font-family: 'Shippori Mincho', serif;}
.sec_tit .sub{color: #EFA43F; font-weight: 600; margin-bottom: 5px;}
.sec_tit .main{color: #C27276; font-weight: 600; font-size: 32px;}
#recruit_lp h1{font-size: 33px; margin-bottom: 30px; text-align: center; font-weight: 600;}
section{background-color: transparent;}
.line_btn{display: inline-block; background-color: transparent;}
.line_btn::after{display: none;}


/*--- btn ---*/
.pub_btn{background-color: #EFA43F; color: #fff; border-radius: 30px; padding: 10px 50px; display: inline-block; margin: 0 auto; font-family: 'Shippori Mincho', serif; transition: .3s;}
.pub_btn:hover{opacity: .7; color: #fff;}
#recruit_lp .pub_btn::before,#recruit_lp .pub_btn::after{display: none;}
.r_fix{position: fixed; top: 50%; right: 0; width: 60px;}
.r_fix a{display: block; background-color: #C27276; color: #fff; text-align: center; padding: 17px 10px 10px 10px;}
.r_fix a .sub{display: none;}
.r_fix a .main{font-weight: bold; font-size: 16px; writing-mode: vertical-lr;}
.r_fix a span{display: inline;}
.r_fix a i{margin-top: 10px;}


/*-- cta ---*/
.cta{position: relative;}
.cta_ab{position: absolute; top: 0; bottom: 0; right: 0; left: 0; margin: auto; width: 650px; height: 240px; background-color: rgba(255, 255, 255, 0.5); text-align: center; padding: 20px 15px; line-height: 1.7;}
.cta_ab .main{font-size: 24px; font-weight: 600; margin-bottom: 20px;}

/*--- staff ---*/
.item_staff .item_img{text-align: center;}
.item_staff .item_img img{max-width: 250px;}
.item_staff .content{padding: 150px 20px 20px; margin-top: -130px; background-color: #fff;}
.item_staff .content .main{color: #C27276; margin-bottom: 15px; text-align: center; font-size: 24px; font-weight: 600;}
.item_staff .content .sub{line-height: 1.7; min-height: 136px;}

/*--- message ---*/
.wrp_message{position: relative; padding-top: 60px;}
.wrp_message .item_img{position: absolute; top: 0; left: 0;}
.wrp_message .item_img::after{content: ''; border: 4px solid #FCE2E3; width: 360px; height: 390px; position: absolute; top: 30px; left: 30px; z-index: -1;}
.wrp_message .item_img img{max-width: 360px; display: block;}
.wrp_message .content{max-width: 950px; padding: 40px 40px 40px 100px; margin-left: auto; border: 4px solid #FCE2E3;}
.wrp_message .content .text{margin-bottom: 40px;}
.wrp_message .content .sub{margin-bottom: 5px; font-weight: 600; font-family: 'Shippori Mincho', serif; text-align: right;}
.wrp_message .content .main{font-size: 20px; font-weight: 600; font-family: 'Shippori Mincho', serif; text-align: right;}

/*--- working ---*/
.over_sec{background-image: url(../images/recruit/over_bg.png); background-size: cover;}
.working .main{font-size: 32px; color: #fff; font-weight: 600; font-family: 'Shippori Mincho', serif; text-align: center; margin-bottom: 30px;}
.working .sub{font-size: 20px; color: #fff; font-weight: 600; font-family: 'Shippori Mincho', serif; text-align: center;}
.working .text{color: #fff; line-height: 2;}
.working .cat_box{display: flex; flex-wrap: wrap; padding: 40px 40px 20px; border: 1px solid #fff;}
.working .cat_box li{margin-right: 30px; color: #fff; font-family: 'Shippori Mincho', serif; font-size: 18px; margin-bottom: 20px; display: flex; align-items: center;}
.working .cat_box li i{width: 22px; height: 22px; background-color: #EFA43F; border: 2px solid #fff; font-size: 14px; padding: 2px 3px; border-radius: 3px; margin-right: 10px;}
.working .cat_box li span{line-height: 2;}

/*--- flow_box ---*/
.flow_box{grid-gap: 40px;}
.flow_box .name{line-height: 1; padding: 10px; background-color: #C27276; color: #fff; text-align: center; position: relative; margin-bottom: 30px;}
.flow_box .name::after{position: absolute; content: ''; display: block; width: 0; height: 0; border-top: 18px solid transparent; border-bottom: 18px solid transparent; border-left: 15px solid #C27276; top: 0; left: 100%;}
.flow_box img{width: 100%; margin-bottom: 20px;}
.flow_box .main{font-weight: bold; margin-bottom: 10px;}
.flow_box .text{font-size: 14px;}

/*--- circle_box ---*/
.circle_box .item{border-radius: 50%; background-color: #F6F3F7; text-align: center; font-family: 'Shippori Mincho', serif; width: 350px; height: 350px; margin: 0 auto 30px;}
.circle_box .item .tit{color: #C27276; margin-bottom: 20px; padding-bottom: 20px; position: relative; font-size: 27px; font-weight: 600; padding-top: 60px;}
.circle_box .item .tit::after{content: ''; position: absolute; width: 40px; height: 1px; border-bottom: 1px solid #C27276; bottom: 0; left: 0; right: 0; margin: auto;}
.circle_box .item .main{font-weight: 600; font-size: 20px; line-height: 2;}

/*--- feeling ---*/
.feeling{background-image: url(../images/recruit/f_bg.png); background-size: cover; padding: 50px 0;}
.feeling .sec_inner{position: relative; padding: 0;}
.feeling .sec_inner::before{content: ''; width: 55%; height: 100%; background-color: rgba(255, 255, 255, 0.7); position: absolute; top: 0; left: 0;}
.feeling .content{max-width: 50%; position: relative; z-index: 2; padding: 40px 0;}
.feeling .content .tit{font-size: 32px; color: #C27276; margin-bottom: 10px; font-weight: 600;}
.feeling .content .main{font-size: 20px; color: #C27276; margin-bottom: 25px; font-weight: 600;}
.feeling .content .text{line-height: 1.7;}

/*--- faq ---*/
.faq_box .item_q{display: flex; align-items: center; background-color: #F6F3F7; border-left: 8px solid #C27276; font-weight: 600; padding: 20px 20px;}
.faq_box .item_q span:first-of-type{font-size: 30px; padding-right: 15px; width: 5%; font-family: 'Shippori Mincho', serif; line-height: 1;}
.faq_box .item_q span:nth-of-type(2){width: 95%;}
.faq_box .item_a{display: flex; border-left: 8px solid #EACECF; padding: 20px 20px;}
.faq_box .item_a span:first-of-type{font-size: 30px; padding-right: 15px; width: 5%; font-family: 'Shippori Mincho', serif; line-height: 1; font-weight: 600;}
.faq_box .item_a span:nth-of-type(2){width: 95%; line-height: 2;}

/*--- job ---*/
.job_box .item{display: flex; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #DDDDDD;}
.job_box .item .name{font-weight: 600; width: 20%;}
.job_box .item .content{width: 80%;}

/*--- apply ---*/
.apply_box{display: flex; flex-wrap: wrap; justify-content: center;}
.apply_box .item{background-color: #fff; padding: 30px 20px; text-align: center; width: 55%; margin: 0 2%;}
.apply_box .item .tit{color: #C27276; font-family: 'Shippori Mincho', serif; margin-bottom: 15px;  font-size: 20px; font-weight: 600;}
.apply_box .item .text{margin-bottom: 15px; line-height: 2; text-align: left;}
.tel_btn{color: #EFA43F; font-size: 28px; letter-spacing: 2px; transition: .3s;}
.tel_btn:hover{color: #EFA43F; opacity: .7;}
.line_btn{transition: .3s;}
.line_btn img{max-width: 130px;}
.line_btn:hover{opacity: .7;}

/*--- form ---*/
.wrp_form{max-width: 900px; margin: 0 auto;}
.wrp_form .item{margin-bottom: 50px;}
.wrp_form .item .name{font-weight: bold; margin-bottom: 15px;}
.wrp_form .item .name.hissu{position: relative; display: inline-block;}
.wrp_form .item .name.hissu::after{position: absolute; content: '*'; color: #F76B87; top: -5px; right: -15px; font-size: 18px;}
.wrp_input input{width: 100%; border: 1px solid #333333; padding: 15px 15px; letter-spacing: 1.5px;}
.wrp_input input::placeholder{color: #afafaf;}
.wrp_input textarea{width: 100%; border: 1px solid #333333; padding: 15px 15px;}
.pub_btn.send{width: 250px; margin: 0 auto; display: block; text-align: center; border: 0px;}
.wpcf7 .ajax-loader{display: block; margin: 3px auto;}

/*--- footer ---*/
footer{margin-top: 100px;}
.copy{background-color: #C27276; font-size: 10px; line-height: 1; padding: 14px 0 10px; text-align: center; color: #fff;}

@media only screen and (min-width: 576px) {
  .container{max-width: 540px;}
}
@media only screen and (min-width: 768px) {
  .container{max-width: 720px;}
}
@media only screen and (min-width: 992px) {
  .container{max-width: 960px;}
}
@media only screen and (min-width: 1200px) {
  .container{max-width: 1140px;}
}
@media only screen and (min-width: 1400px) {
  .container{max-width: 1320px;}
}

/*------PC2------*/
@media only screen and (max-width: 1400px) {

  .wrp_message .content{max-width: 750px;}
  .feeling .content .main{font-size: 18px;}

}

/*------PC3------*/
@media only screen and (max-width: 1200px) {

  .wrp_message .content{max-width: 700px;}
  .wrp_message .item_img img{max-width: 300px;}
  .wrp_message .item_img::after{width: 300px; height: 323px; top: 20px; left: 20px;}
  .circle_box .item{width: 300px; height: 300px;}
  .circle_box .item .tit{font-size: 24px;}
  .circle_box .item .main{font-size: 18px; line-height: 1.7;}

}


/*---PAD pro---*/
@media only screen and (max-width: 1050px) {

  body{font-size: 14px;}

}

/*---PAD---*/
@media only screen and (max-width: 880px) {

  .cta_ab{width: 600px; height: 185px;}
  .cta_ab .main{font-size: 18px; margin-bottom: 10px;}
  .box_staff.grid-3{grid-template-columns: 1fr 1fr;}
  .wrp_message .content{max-width: 520px; padding-right: 20px;}
  .wrp_message .item_img img{max-width: 230px;}
  .wrp_message .item_img::after{width: 230px; height: 248px;}
  .circle_box .item{width: 220px; height: 220px; margin-bottom: 0px;}
  .circle_box .item .tit{font-size: 18px; margin-bottom: 15px; padding-bottom: 15px; padding-top: 40px;}
  .circle_box .item .main{font-size: 15px;}
  .feeling .content{max-width: 100%;}
  .feeling .sec_inner::before{width: 100%;}

}

/*---Sm---*/
@media only screen and (max-width: 767px) {

  /* オフキャンバス */
  .m-toggle{border: none; display: block; position: relative; background: none; z-index: 9999; outline: none !important;}
  .offcanvas-toggle .icon-bar{background: #534944;}
  .icon-bar{display:block; width:30px; height:3px; border-radius:1px; margin: auto;}
  .icon-bar + .icon-bar{margin-top:5px}
  .offcanvas-toggle.is-open .icon-bar{background: #534944;}
  .offcanvas-toggle.is-open .icon-bar:nth-child(3){margin-top: 14px;}
  .offcanvas-toggle.is-open .icon-bar:nth-child(4){transform: rotate(-135deg) translate(8px, 8px); margin-top: 2px;}
  .off-base.navbar-offcanvas{top: 0; overflow: auto; z-index: 999; padding: 60px 0 0;}

  /*offcanvas-size*/
  .navbar-offcanvas{max-width: 100%; position: fixed; width: 100%; height: 100%; background-color: #C27276;}
  .navbar-offcanvas.navbar-offcanvas-right {right: -100%;}
  .navbar-offcanvas.navbar-offcanvas-right.offcanvas-transform.in {-webkit-transform: translateX(-100%); transform: translateX(-100%);}

  .sm-nav-box ul{margin-top: 0px; padding: 0 20px;}
  .sm-nav-box li{border-bottom: solid 1px #ccc; position: relative;}
  .sm-nav-box li a{display: flex; justify-content: space-between; padding: 15px; font-weight: bold; font-size: 13px; color: white;}
  .sm-nav-box li a span:nth-of-type(2){font-weight: 300;}
  .sm-nav-box .poz{position: absolute; top: 40%; right: 5%; color: #9f9f9f;}
  .top-bor-nav{border-top: solid 1px #ccc;}
  .sh_logo{text-align: center;}
  .sh_logo a{display: inline-block; max-width: 80px;}

  .o_cta{text-align: center; max-width: 90%; margin: 0 auto;}
  .o_cta .btn_box{margin-bottom: 10px;}
  .oc_btn{background-color: #EFA43F; color: #fff; position: relative; padding: 12px 80px; display: inline-block; border-radius: 30px;}
  .oc_btn i{margin-left: 10px;}

  /*--- header ---*/
  header .head_inner{position: relative; padding: 5px 10px;}
  .head_nav{display: none;}

  .grid-3,.box_staff.grid-3{grid-template-columns: 1fr;}
  .grid-3.circle_box{grid-template-columns: 1fr 1fr; grid-gap: 5px;}
  .cta_ab{width: 320px; height: 280px; padding: 20px 10px; line-height: 2;}

  #recruit_lp h1{font-size: 24px;}

  .sec_inner{padding: 40px 0;}
  .sec_tit .main{font-size: 27px;}

  .wrp_message{padding-top: 10px;}
  .wrp_message .item_img{position: static; margin-bottom: 20px;}
  .wrp_message .item_img img{max-width: 80%;}
  .wrp_message .item_img::after{width: 281px; height: 303px; top: -20px; left: 30px;}
  .wrp_message .content{padding: 20px 15px;}
  .wrp_message .content .text{margin-bottom: 20px;}

  .working .main{font-size: 27px;}
  .working .sub{font-size: 18px;}
  .working .cat_box{padding: 20px 20px 10px;}
  .working .cat_box li{font-size: 16px; margin-bottom: 10px;}

  .flow_box .name::after{display: none;}

  .circle_box .item{width: 175px; height: 175px; margin-bottom: 10px;}
  .circle_box .item .tit{padding-top: 23px; margin-bottom: 10px; padding-bottom: 10px; font-size: 16px;}
  .circle_box .wrp_item:nth-of-type(2) .tit,.circle_box .wrp_item:nth-of-type(3) .tit{padding-top: 35px;}
  .circle_box .item .tit::after{width: 30px;}
  .circle_box .item .main{font-size: 13px; line-height: 1.5;}

  .feeling .content .tit{font-size: 27px;}

  .faq_box .item_q{padding: 15px 10px;}
  .faq_box .item_q span:first-of-type{width: 12%; padding-right: 10px; font-size: 24px;}
  .faq_box .item_q span:nth-of-type(2){width: 88%;}
  .faq_box .item_a{padding: 15px 10px;}
  .faq_box .item_a span:first-of-type{width: 12%; padding-right: 10px; font-size: 24px;}
  .faq_box .item_a span:nth-of-type(2){width: 88%;}

  .job_box .item{flex-wrap: wrap;}
  .job_box .item .name{width: 100%; margin-bottom: 10px;}
  .job_box .item .content{width: 100%;}

  .r_fix{bottom: 0; left: 0; top: auto; right: auto; width: 100%;}
  .r_fix a{padding: 10px; border: solid 3px #fff;}
  .r_fix a .sub{display: inline; background:linear-gradient(transparent 80%, #e7bb5e 0%); font-size: 15px;}
  .r_fix a .main{writing-mode: initial; letter-spacing: 2px; display: inline-block; padding-top: 3px; font-size: 17px;}
  .r_fix a .main i{margin-left: 10px; margin-top: 0;}

  .apply_box .item{width: 100%; margin-bottom: 10px;}

  #staff,#message,#envi,#day,#value,#feel,#faq,#entry_form{padding-top: 100px; margin-top: -100px;}

}

/*---Sm small---*/
@media only screen and (max-width: 370px) {
    body{font-size: 13px;}

    .wrp_message .item_img::after{width: 272px; height: 250px;}
    .cta_ab{width: 250px; height: 240px;}
    .cta_ab .main{font-size: 14px;}
    .pub_btn{padding: 6px 50px;}
    .item_staff .content .main{font-size: 18px;}
    .circle_box .item{width: 140px; height: 140px;}
    .circle_box .item .tit{font-size: 13px;}
    .circle_box .item .main{font-size: 11px;}
    .circle_box .item .tit{padding-top: 20px;}
    .circle_box .wrp_item:nth-of-type(2) .tit, .circle_box .wrp_item:nth-of-type(3) .tit{padding-top: 20px;}

}