@charset "UTF-8";

*,*::before,*::after {
  box-sizing: border-box;
}
html {
  font-family: sans-serif;
  line-height: 1.15;
  min-width: 1100px;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -ms-overflow-style: scrollbar;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
@-ms-viewport {
  width: device-width;
}
article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
  display: block;
}
body {
  margin: 0;
  font-family: "ゴシックMB101 B", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Helvetica, Arial, "メイリオ", Osaka, "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  text-align: left;
  background-color: #fff;
}
[tabindex="-1"]:focus {
  outline: 0 !important;
}
hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}
abbr[title],
abbr[data-original-title] {
  text-decoration: underline;
  text-decoration: underline dotted;
  cursor: help;
  border-bottom: 0;
}
address {
  margin-bottom: 0;
  font-style: normal;
  line-height: inherit;
}
ol,ul,dl {
  margin-top: 0;
  margin-bottom: 0;
  list-style: none;
  padding: 0;
}

ol ol,ul ul,ol ul,ul ol {
  margin-bottom: 0;
}

/* # Base */


/* # Header */
/* header
------------------------------------------------------------------ */
header{
background:#fafafa;
padding:15px 20px 50px ;
display:flex;
justify-content: space-between;
align-items: center ;
font-size:12px;
}
/*header > left*/
header p{max-width:40%;}
  header p span{display:block;font-size:20px;font-weight:bold;}
  header p span span{display:inline;color:#e83a37;font-weight: bold;}
  header p img{height:1.4em;margin-left:.5em}
/*header > right*/
header nav{max-width:60%;}
  header nav ul{list-style:none;display:flex;}
  header nav li{border-right:1px solid #003252;}
  header nav li:last-child{border-right:none;}
  header nav a{margin :0 .5em;color:#003252;text-decoration:underline;font-size:16px;font-weight:bold;}
  header nav li:first-child a,header nav a:hover{text-decoration:none;}
  header nav li:last-child a{margin-right:0;}


/* # Workin（ワーキン）で御社の求人を掲載してみませんか？ */
/* hero
------------------------------------------------------------------ */
.hero_body section:first-child div,
.hero_body section:last-child{
  max-width:1100px;
  margin:0 auto;
}
.hero_body section:first-child{
  background:linear-gradient(0deg, #fff, rgba(250, 250, 250, 0) 100px), url("/static_common/images/inquire/hero_bg.png"),#fafafa;
  background-position:left top,calc(50% + 400px) 0px;
  background-repeat:repeat,no-repeat;
  background-size: auto,contain;
}
.hero_body section:first-child div{
  max-width:1100px;
  margin:0 auto;
  padding:0 0 100px 40px;
}
  /*hero > read*/
  .hero_body h1{font-size:30px;margin-bottom:30px;}
  .hero_body h1 img{height:2.75em;margin-right:.5em;}
  .hero_body p{margin-bottom:30px;}
  /*hero > contact*/
  .hero_body .hero_contact li dt{font-size:18px;color:#282f33;font-weight:bold;margin-bottom:15px;}
  .hero_body .hero_contact li dt:before{content:"▼";margin-right:.5em;}
    /*form*/
    .hero_body .hero_contact li:first-child{margin-bottom:25px;}
    .hero_body .hero_contact li:first-child dd{
      background:#ffaa00;
      box-shadow: 0px 9px 4px -4px #cc8800;
      border-radius:10px;
      width:15em;
      font-size:30px;
    }
    .hero_body .hero_contact li:first-child dd a{
      color:#fff;
      text-decoration: none;
      font-weight: bold;
      display:flex;
      justify-content: space-between;
      align-items: center ;
      padding:40px 23px 30px;
    }
    .hero_body .hero_contact li:first-child dd a:after{
      margin-left:1em;
      font-family: "Font Awesome 5 Free";
      font-weight:900;
      content:"\f0ab";
    }
      .hero_body .hero_contact li:first-child dd a span span{font-size:16px;display:block;}
    /*tel*/
    .hero_body .hero_contact li:last-child dd{
      width:30em;
      text-align:right;
      margin-bottom:40px;
    }
    .hero_body .hero_contact li:last-child dd a{
      background:url("/static_common/images/inquire/hero_phone-icon.png") left center no-repeat;
      background-size:contain;
      text-align:left;
      color:#ffaa00;
      font-weight: bold;
      padding-left:2.5em;
      font-size:40px;
      display: block;
    }
  /*hero > praise*/
  .hero_body .hero_praise{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width:30em;
  }
  .hero_body .hero_praise li{
    margin-right:40px;
  }
  /*hero > voice*/
  .hero_body section:last-child{
    padding:60px 0 50px;
  }
  /*title*/
  .hero_body section:last-child h3{
    background:url("/static_common/images/inquire/base_h3_bg.png") center bottom no-repeat;
    padding:0 0 40px;
    font-size:40px;
    color:#006aad;
    text-align: center;
  }
  .hero_body section:last-child h3 img{height:1.25em;margin:0 0.25em;}
  .hero_body section:last-child h3 span{font-size:30px;}
  /*list*/
  .hero_body .hero_voice{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }
  .hero_body .hero_voice li{
    box-shadow: 0 0 2px rgba(0,0,0,.2);
    width:calc(20% - 10px);
    margin:10px 10px 10px 0;
    text-align: center;
    font-size: 17px;
    padding:20px 0;
    font-family: "ゴシックMB101 M";
    font-feature-settings: "palt";
  }
  .hero_body .hero_voice li:nth-child(5),
  .hero_body .hero_voice li:nth-child(10){margin-right:0;}
    .hero_body .hero_voice dl{padding:25px 0 0;}
      .hero_body .hero_voice dt span{font-size:11px;}
    .hero_body .hero_voice dd{line-height: 1.75;font-size:16px;}
    .hero_body .hero_voice dd span{font-size:32px;font-weight:bold;}

/* ## だけど結局、Workinって何がいいの？選ばれる理由 */
/* reason
------------------------------------------------------------------ */
.reason_body{
  background:url("/static_common/images/inquire/reason_bg.png") center top no-repeat #006aad;
  padding:65px 0 50px;
  color:#fff;
}
.reason_body section{
  max-width:1100px;
  margin:0 auto;
  display:flex;
}
  /*title*/
  .reason_body h2{
    background:url("/static_common/images/inquire/base_h3_bg.png") center bottom no-repeat;
    padding:0 0 40px;
    text-align: center;
    font-size: 20px;
  }
  .reason_body h2 span{
    display:block;
    font-size: 40px;
  }
  /*box*/
  .reason_body #reason_box-1{flex-flow: row;padding-bottom:45px;}
  .reason_body #reason_box-1 div{padding-right:30px;}
  .reason_body #reason_box-2{flex-flow: row-reverse;padding-bottom:45px;}
    .reason_body #reason_box-2 div{padding-left:30px;}
  .reason_body #reason_box-3{flex-flow: row;}
    .reason_body #reason_box-3 div{padding-right:10px;}
    .reason_body #reason_box-3 div p{margin:0 0 20px;line-height:1.6;}
    .reason_body #reason_box-3 div p:last-child{border:1px solid #fff;padding:15px 20px;}

  /*subtitle*/
  .reason_body h3{
    display: grid;
    grid-template-columns: 3em 1fr;
    font-size:26px;
    font-weight: bold;
    margin:0 0 20px;
  }
    .reason_body h3::before{
      content:"Reason";
      text-align: center;
      font-size:20px;
      grid-row: 1;
      font-family: "ゴシックMB101 L";
    }
    .reason_body  h3::after{
      text-align: center;
      font-size:50px;
      font-family: "ゴシックMB101 L";
    }
    .reason_body  h3 p{
      font-family: "ゴシックMB101 L";
      display: none;
    }
    .reason_body  h3 span{grid-row: 1 / 4;padding-left:10px;}
    .reason_body h3 span span{margin-bottom:10px;}
    .reason_body h3 span span:first-of-type{font-size:18px;display:block;}
    .reason_body h3 span span:last-of-type{font-size:40px;}
    .reason_body #reason_box-1 h3::after{content:"01";}
    .reason_body #reason_box-2 h3::after{content:"02";}
    .reason_body #reason_box-3 h3::after{content:"03";}
    .reason_body #reason_box-3 h3 span{padding-top:10px;}
    .reason_body  p{font-family: "ゴシックMB101 M";}


/* ## お問い合わせ・ご相談・ご質問もお気軽に！ */
/* cta_body
------------------------------------------------------------------ */
.cta_body{
  background:
  linear-gradient(0deg, #edf3f6, rgba(237, 243, 246, 0) 18px),
  #e2ebf0;
  padding:0 0 10px;
}
.cta_body section{
  width:1090px;
  margin:0 auto;
  background:
  url("/static_common/images/inquire/cta_bg-1.png") left bottom no-repeat,
  url("/static_common/images/inquire/cta_bg-2.png") right bottom no-repeat;
  padding:60px 10px;
}
  /*title*/
  .cta_body h3{
    text-align: center;
    font-size: 40px;
    margin:0 0 40px;
  }
  .cta_body ul{
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width:840px;
    margin:0 auto;
  }
  .cta_body li dt{font-size:18px;color:#282f33;font-weight:bold;margin-bottom:5px;}
  .cta_body li dt:before{content:"▼";margin-right:.5em;}
  /*tel*/
  .cta_body li:first-child{}
  .cta_body li:first-child dd{
    text-align:right;
    margin-right:auto;
    display: inline-block;
    font-size:18px;
  }
  .cta_body li:first-child dd a{
    color:#ffaa00;
    font-weight: bold;
    font-size:40px;
    font-feature-settings: "palt";
    display: block;
  }
  /*form*/
  .cta_body li:last-child dd{
    background:#ffaa00;
    box-shadow: 0px 9px 4px -4px #cc8800;
    border-radius:10px;
    width:14.4em;
    font-size:30px;
  }
  .cta_body li:last-child dd a{
    color:#fff;
    text-decoration: none;
    font-weight: bold;
    display:flex;
    justify-content: space-between;
    align-items: center ;
    padding:32px 20px 28px;
  }
  .cta_body li:last-child dd a:after{
    margin-left:1em;
    font-family: "Font Awesome 5 Free";
    font-weight:900;
    content:"\f0ab";
  }
    .cta_body li:last-child dd a span span{font-size:16px;display:block;}



/* ## サービスの特徴 */
/* feature
------------------------------------------------------------------ */
.feature_body{
  padding:60px 0;
}
.feature_body div{
  width:1060px;
  margin:0 auto;
}
/*title*/
.feature_body h2,
.feature_body h3{
  background:url("/static_common/images/inquire/base_h3_bg.png") center bottom no-repeat;
  padding:0 0 40px;
  font-size:40px;
  font-weight:bold;
  text-align: center;
  margin-bottom:15px
}
  .feature_body h2 span{font-size: 30px;}
/*tab*/
.feature_body input{display: none;}
.feature_body nav{height: 159px;}
.feature_body ul{display:flex;list-style:none;}
.feature_body li{cursor: pointer;}
.feature_body #feature_tab-base{
  overflow: hidden;
  margin-bottom:100px;
}
.feature_body li{background:top left no-repeat;}
.feature_body li:nth-child(1){background-image:url("/static_common/images/inquire/feature_tab-1-ov.png");}
  .feature_body li.active:nth-child(1) img{visibility: hidden;}
.feature_body li:nth-child(2){background-image:url("/static_common/images/inquire/feature_tab-2-ov.png");}
  .feature_body li.active:nth-child(2) img{visibility: hidden;}
.feature_body li:nth-child(3){background-image:url("/static_common/images/inquire/feature_tab-3-ov.png");}
  .feature_body li.active:nth-child(3) img{visibility: hidden;}
/*tab body*/
.feature_body #feature_tab-base section{
  background:#e2ebf0;
  padding:20px 40px 50px;
  border-radius: 0 0 10px 10px;
}
.feature_body #feature_tab-base section.active{display:block;}
/*tab inside*/
.feature_body #feature_tab-base section dt{
  margin:0 0 15px;
  text-align:center;
  font-size:20px;
  font-weight: bold;
}
.feature_body #feature_tab-base section dd{
  line-height: 2;
  font-family: "ゴシックMB101 M";
}
.feature_body #feature_tab-base section dd:first-of-type{padding-bottom:40px;}
/*area*/
.feature_body p{text-align: center;}
.feature_body p span{
  padding:20px 0 0;
  display: block;
  font-size: 16px;
  color:#003252;
}


/* ## 料金プラン */
/* price
------------------------------------------------------------------ */
.price_body{
  padding:60px 0;
  background:#ffaa00;
  color:#fff;
}
.price_body div{
  width:1060px;
  margin:0 auto;
  display: flex;
}
/*title*/
.price_body h2{
  background:url("/static_common/images/inquire/base_h3_bg.png") center bottom no-repeat;
  padding:0 0 40px;
  font-size:40px;
  font-weight:bold;
  text-align: center;
  margin-bottom:15px
}
/*box*/
.price_body section{
  background:#fff;
  border-radius: 7px;
  padding:20px 10px 10px;
  width:calc(100% - 60px);
  margin-right: 20px;
  font-size:16px;
  font-feature-settings: "palt";
  color:#003252;
}
.price_body section:last-child{
  margin-right: 0;
}
/*box inside*/
.price_body h3{
  text-align: center;
  margin-bottom:10px;
}
.price_body p{
  margin-bottom:20px;
}
.price_body section ul{
  display: flex;
  align-items:stretch;
  justify-content: space-between;
}
.price_body li {text-align:center;}
.price_body li dl{padding:0 4px;}
  .price_body li span.note{
    font-family: "ゴシックMB101 M";
    font-weight: normal;
    font-size:10px;
    font-feature-settings: "palt";
  }
.price_body section li:first-child dl{border-right:1px solid #ffaa00;}
.price_body section li:last-child{}
.price_body section:last-of-type li dl{border:none;padding:0;}
.price_body dt{
  margin-bottom: 10px;
  font-weight:bold;
  font-size:18px;
  color:#007ec1;
}
.price_body dd:first-of-type{
  min-height: 4.5em;
  font-family: "ゴシックMB101 M";
}
.price_body span{
  display:block;
  font-size:12px;
}
.price_body i{
  color:#ffaa00;
}
/*note*/
.price_body .price_note{
  text-align: center;
  padding:20px 0 0;
  font-family: "ゴシックMB101 M";
}
.price_body .price_note li::before{
  content: "※";
}


/* ## 掲載までは3ステップ！ */
/* step
------------------------------------------------------------------ */
.step_body{
  padding:60px 0;
}
.step_body section{
  width:960px;
  margin:0 auto;
}
/*title*/
.step_body h2{
  background:url("/static_common/images/inquire/base_h3_bg.png") center bottom no-repeat;
  padding:0 0 40px;
  font-size:40px;
  font-weight:bold;
  text-align: center;
  color:#003252;
}
  .step_body h2 span{
    padding:0 .1em;
    font-size:60px;
    color:#006aad;
  }
/*step*/
.step_body section{
  border-bottom:2px dashed #003252;
  background:url("/static_common/images/inquire/step_icon-002.jpg") left 15px no-repeat;
  padding:15px 0 40px 160px;
  min-height:260px;
  color:#003252;
  position: relative;
}
.step_body section:first-of-type{
  background-image: url("/static_common/images/inquire/step_icon-001.jpg");
}
.step_body section:last-of-type{
  border-bottom:none;
  background-image: url("/static_common/images/inquire/step_icon-003.jpg");
}
  .step_body section::after{
    content: "";
    border-top: 50px solid #006aad;
    border-right: 50px solid transparent;
    border-bottom: 50px solid transparent;
    border-left: 50px solid transparent;
    position: absolute;
    bottom:-130px;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit-transform: translateY(-50%) translateX(-50%);
    margin:0 auto;
  }
  .step_body section:last-of-type::after{
    display: none;
  }
/*step inside*/
.step_body section h3{
  font-size:40px;
  padding:25px 0 0;
  margin:0 0 20px;
}
.step_body section p{
  font-size:20px;
  font-family: "ゴシックMB101 M";
}


/* ## お問い合わせ */
/* form
------------------------------------------------------------------ */
.form_body{
  padding:60px 0;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Helvetica, Arial, "メイリオ", Osaka, "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;
}
.form_body section{
  width:900px;
  margin:0 auto;
}

/*220422 add*/
.hbspt-form{
  width: 90%;
  margin: 0 auto;
}
/*220422 end*/


/*title*/
.form_body h2{
  background:url("/static_common/images/inquire/base_h3_bg.png") center bottom no-repeat;
  padding:0 0 40px;
  font-size:40px;
  font-weight:bold;
  text-align: center;
  color:#003252;
}
/*satori rewrite*/
/*container*/
#form #satori__creative_container{
  width:880px;
  margin:0 auto;
}
#form .satori__input_group,
#form .satori__horiz_group{
  display:flex;
  align-items: stretch;
  padding:10px 10px 0;
}
#form .satori__input_group#satori__privacy_policy_input{
  display: block;
  text-align: center;
}
  /*label*/
  #form .satori__input_group label:first-child,
  #form .satori__horiz_group label:first-child{
    background:#006aad;
    padding: 0.5em 1em;
    display: flex;
    align-items: end;
    width:260px;
    font-feature-settings: "palt";
    font-size: 18px;
    font-weight: bold;
    color:#fff;
  }
  .satori__addonflex{
    display: flex;
    align-items: center;
  }
    /*require*/
    #form .satori__require{
      background:#ff4c4c;
      border-radius: 2px;
      color:#fff;
      font-size: 12px;
      margin:.6em 0 0 auto;
    }
    #form .satori__not_require{display: none;}
  /*input*/
  #form .satori__apend_inputbox{
    width: calc(100% - 276px);
    margin-left: 1em;
    padding:5px 0;
  }
  #form .satori__input_group input[type=email],#form .satori__horiz_group input[type=email],
  #form .satori__input_group input[type=number],#form .satori__horiz_group input[type=number],
  #form .satori__input_group input[type=password],#form .satori__horiz_group input[type=password],
  #form .satori__input_group input[type=tel],#form .satori__horiz_group input[type=tel],
  #form .satori__input_group input[type=text],#form .satori__horiz_group input[type=text],
  #form .satori__input_group input[type=url],#form .satori__horiz_group input[type=url],
  #form .satori__input_group select,#form .satori__horiz_group select,
  #form .satori__input_group textarea,#form .satori__horiz_group textarea{
    background: #e5f0f7;
    padding:7px 13px;
    box-shadow: none;
    border-radius: 4px;
    border:none;
  }
    #form .satori__input_group input::placeholder,#form .satori__horiz_group input::placeholder,
    #form .satori__input_group input:-ms-input-placeholder,#form .satori__horiz_group input:-ms-input-placeholder,
    #form .satori__input_group input::-ms-input-placeholder,#form .satori__horiz_group input::-ms-input-placeholder{
      font-weight:bold;
      color:#9ca5aa;
    }
  /*address set*/
  #form .satori__input_group #satori__addonid_addressbox label.satori__addonid_address-flat {
    background: none;
    width: auto;
    padding: 0;
    display: inline-block;
    font-size:18px;
    font-weight: bold;
    color:#282f33;
  }
  #form .satori__input_group #satori__addonid_addressbox label.satori__addonid_address-flat .satori__require{display: none;}
  #form .satori__input_group #satori__addonid_addressbox .satori__addonid_address-flat:nth-child(1){/*〒*/
    margin:0 1em 10px 0;
    padding:0;
    width: 1em;
    background:none;
  }
  #form .satori__input_group #satori__addonid_addressbox .satori__addonid_address-flat:nth-child(2) {/*input postcode*/
    margin:0 1em 10px 0;
    width: 10em;
  }
  #form .satori__input_group #satori__addonid_addressbox .satori__addonid_address-flat:nth-child(3) {/*都道府県*/
    display:none;
  }
  #form .satori__input_group #satori__addonid_addressbox .satori__addonid_address-flat:nth-child(4) {/*prefectures*/
    margin:2px 1em 10px 0;
    font-size:17.5px;
    padding:0 13px;
    width: 10em;
  }
  #form .satori__input_group #satori__addonid_addressbox .satori__addonid_address-flat:nth-child(5) {/*city*/
    margin:0 0 10px;
    width: calc(100% - 25.399em);
  }
  #form .satori__input_group #satori__addonid_addressbox .satori__addonid_address-flat:nth-child(6) {/*address*/
    margin:0 1em 10px 0;
    width: calc(50% - .5em);
  }
  #form .satori__input_group #satori__addonid_addressbox .satori__addonid_address-flat:nth-child(7) {/*building*/
    margin:0 0 10px;
    width: calc(50% - .5em);
  }
  /*name set*/
  #form .satori__apend_inputbox.flex{display:flex;align-items: center;}
    #form .satori__apend_inputbox.flex input{width:calc(50% - 4em);}
    #form .satori__apend_inputbox.flex input:first-child{margin:0 1em 0 .5em;}
    #form .satori__apend_inputbox.flex input{margin:0  0 0 .5em;}
  /*textarea*/
  #form .satori__apend_inputbox textarea{
    min-height:7em;
  }

/*privacypolicy*/
#form #satori__privacy_policy_agreement_wrapper{
  height:260px;
  overflow:auto;
  background:#f0f0f0;
  margin:0 0 40px;
}
#form .satori__input_group#satori__privacy_policy_input p,
#form .satori__input_group#satori__privacy_policy_input label{
  font-size:15px;
  font-weight: normal;
  color:#282f33;
}
#form .satori__input_group#satori__privacy_policy_input label{font-weight: bold;}

/*submit*/
#form p.satori__submit_group{
  font-size:40px;
  background:#ffaa00;
  box-shadow: 0px 9px 4px -4px #cc8800;
  border-radius:10px;
  width:8em;
  margin:0 auto;
  cursor:pointer;
}
#form p.satori__submit_group::after{
  font-family: "Font Awesome 5 Free";
  font-weight:900;
  content:"\f0e0";
  color:#fff;
}
  #form p.satori__submit_group:hover::after{
    content:"\f1d8";
  }
#form .satori__btn{
  background:none;
  padding:10px 0;
  color:#fff;
  letter-spacing: .2em;
  font-weight: bold;
}


/* # Footer */
/* footer
------------------------------------------------------------------ */
footer {
  padding:60px 0 75px;
  width:900px;
  margin:0 auto;
  font-size: 14px;
  font-family: "ゴシックMB101 M";
}
footer ul{
  display: flex;
  align-items: center;
  margin-bottom:65px;
}
footer li{
  border-left:1px solid #282f33;
  padding:2px 20px;
}
footer li:first-child,
footer li:last-child{border-left:none;}
  footer li a{color:#006aad;}
footer address{text-align: center;}
  footer address img{height:30px;}


/*今月の特集*/
dl.schedule{
	margin:2em 0;
}
@media screen and (max-width:768px){
  display: none;
}
dl.schedule_tr {
    display: flex;
    width: 100%;
    justify-content: flex-start;
    background: #dddddd;;
}

dl.schedule_tr:first-child {
    text-align: center;
}

dl.schedule_tr:nth-child(even){
	background: #f9f9f9;
}

dl.schedule_th{
    background: #e2ebf0;
}

dl.schedule_tr dt {
    width:10em;
    text-align: center;
    padding:0.5em;
}

dl.schedule_tr dd {
    padding:0.5em;
    border-left: 2px solid #fff;
}
dl.schedule_tr dd a{
    color: #232323;
    display: inline-block;
}
dl.schedule_tr dd a:hover{
    text-decoration: none;
}
dl.schedule_tr dd.special {
    width: calc(40% - 5em - 2px);
}
dl.schedule_tr dd.event {
    width: calc(60% - 5em - 2px);
}


/*popup*/
.popup {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  opacity: 0;
  visibility: hidden;
  transition: .6s;
  display: none;
}
.popup.is-show {
  opacity: 1;
  visibility: visible;
  display: block;
}
.popup-inner {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  width: 80%;
  max-width: 1200px;
  background-color: #fff;
  z-index: 2;
  height: calc(100% - 90px);
}
.popup-inner img {
  width: 100%;
}
.close-btn {
  position: absolute;
  right: 0;
  top: 0;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  cursor: pointer;
  transform: translateY(-2.5em);
}
.close-btn i {
  font-size: 40px;
  color: #fff;
}
.black-background {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.8);
  z-index: 1;
  cursor: pointer;
}
.js-popup-iframe{
  width: 100%;
  height: 100%;
}

/*ヘッダー固定とスクロールで表示・非表示切替（.headerhideをjs連動）*/
header {
    width: 100%;
    min-width: 1100px;
    padding: 15px 20px;
    transition: .5s;
    position: fixed;
    top: 0;
}
.headerhide {
    transform: translateY(-100%);
}
body {
    padding-top: 83px;
}/*
article#hero::before {
    display: block;
    content:"";
    height:35px;
    width: 100%;
    background: #fafafa;
}
*/

/*ヘッダー問い合わせボタン 装飾＆アニメーション*/
header nav ul li:last-child a {
  background: #fa0;
  color: #fff;
  box-shadow: 0px 4px 3px -2px #d19419;
  padding: 0.5em 1.5em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  border-radius: 0.3em;
  position: relative;
  overflow: hidden;
  font-size: 17px;
  transform-origin:40% 50% 0;
  transform: translateY(-0.5em) rotate(0);
  animation: sheen 2s ease-in-out;
}
@keyframes sheen {
  0% {
    transform: translateY(-0.5em) rotate(0);
  }
  85% {
    transform: translateY(-0.5em) rotate(0);
  }
  90% {
    transform: translateY(-0.5em) rotate(10deg);
  }
  95% {
    transform: translateY(-0.5em) rotate(-10deg);
  }
  100% {
    transform: translateY(-0.5em) rotate(0);
  }
}
header nav ul li:last-child {
    height: 1em;
}