@charset "utf-8";
/* 
Theme Name: portfolio01
Author: Atsunori Hitaka
Version: 1.0
Desctiption: portfolio01のテーマです。
*/

/* ====全体の設定==== */
*,
*::before,
*::after{
  margin: 0;
  padding: 0;
  box-sizeing: border-box;
}
html{
  overflow-x: hidden;
}
body{
  width: 100%;
  min-height: 100vh;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Verdana, Osaka, "ＭＳ Ｐゴシック","Noto Sans JP", sans-serif;
  font-size: 16px;
  line-height: 1.5;
  color: #333;
}
h1, h2, h3, h4, h5, h6{
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Verdana, Osaka, "ＭＳ Ｐゴシック", sans-serif;
}
a{
  text-decoration: none;
  transition: all .25s;
}
img{
  width: 100%;
  max-width: 100%;
  height: auto;
  border: none;
  vertical-align: bottom;
}
address{
  font-style: normal;
}
time{font-size: 14px;}
nav ul li,
ul.sidebar-widgets li.widget_nav_menu{
  list-style: none;
}

header, footer, main, section, article{
  width: 100%;
  height: auto;
  margin: 0 auto;
}
.headline{
  width: 100%;
  padding: 4px;
  font-size: 14px;
  background-color: #eee;
}
.copyright{
  padding: 8px 0;
  font-size: 16px;
  text-align: center;
  background-color: #eee;
}
.entry-btn{
  display: block;
  width: 100px;
  height: 30px;
  margin: 0 auto;
  padding: 16px;
  border-radius: 5px;
  background-color: #ff9731;
  color: #fff;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
}
.entry-btn:hover{
  background-color: #ff561f;
}
.sns-wrapper{
  position: fixed;
  top: 50%;
  right: 20px;
  z-index: 5;
  width: 50px;
}
.sns a:hover{opacity: 0.8}

/* ====headerの設定==== */
.header-logo-area{
  justify-content: space-between;
}
.header-logo{
  width: 100%;
  max-width: 500px;
  margin: 20px auto;
}
.header-logo img{
  max-height: 100px;
}

/* ====footerの設定==== */
/* footer-banner */
.footer-banner{
  width: 100%;
  max-width: 786px;
  margin: 80px auto;
}
/* footer */
.footer{
  width: 100%;
  height: auto;
  background-image: url("img/footer-bg.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  padding-top: 80px;
}
.footer-area{
  width: 95%;
  height: auto;
  margin: 0 auto;
  text-align: center;
  padding-bottom: 80px;
}
.footer-cta-title{
  position:relative;
  margin: 40px auto;
  z-index: 2;
  font-size: 24px;
  color: #fff;
}
.footer-cta-title::after{
  content: "";
  position: absolute;
  left: 50%;
  bottom: -10px;
  transform: translateX(-50%);
  display: block;
  margin: 0 auto;
  width: 50%;
  min-width: 300px;
  height: 10px;
  background-color: #fd913b;
  z-index:1;
}
.footer-cta-text{
  max-width: 786px;
  margin: 0 auto 80px;
  font-size: 18px;
  color: #fff;
}
/* ===記事コンテンツの設定=== */
.content{
  max-width: 1440px;
  margin: 0 auto;
  padding: 20px
}

/* ====Company/会社ページ==== */
.rinenn{
  max-width: 1000px;
  margin: 0 auto;
}
.company-table{
  max-width: 1080px;
  margin: 0 auto;
}
.company-table th{
  width: 120px;
  color: #fff;
  background-color: #ff6e00;
  border: 2px solid #fff;
}
.company-table td{
  background-color: #ffc096;
  border: 2px solid #fff;
  font-size: 18px;
}

/* ====person/人ページ==== */
.staff .wp-block-image{
  text-align: center;
}
.staff img{
  max-width: 350px;
}
.staff p{
  font-weight: bold;
  text-align: center;
}

/* ====環境/environmentページ==== */
.environment-point img{
  max-width: 500px;
}
.environment-point p{
  font-weight: bold;
}


/* ====education/教育ページ==== */
/* --施術メニュー-- */
.sejutsu-menu{
  max-width: 1080px;
  margin: 0 auto;
}
.sejutsu-menu th{
  width: 120px;
  color: #fff;
  background-color: #ff6e00;
  border: 2px solid #fff;
}
.sejutsu-menu td{
  background-color: #ffc096;
  border: 2px solid #fff;
  font-size: 18px;
}

/* ====guideline/募集要項==== */
/* --求人のテーブル-- */
.recruit-table {
  max-width: 1080px;
  margin: 0 auto;
}
.recruit-table th{
  width: 120px;
  color: #fff;
  background-color: #ff6e00;
  border: 2px solid #fff;
}
.recruit-table td{
  background-color: #ffc096;
  border: 2px solid #fff;
  font-size: 18px;
}

/* ====エントリーフォーム==== */
#snow-monkey-form-6 .entry-form {
  width: 95%;
  max-width: 786px !important;
  margin: 0 auto;
}
#snow-monkey-form-6 .entry-form input,
#snow-monkey-form-6 .entry-form textarea{
  max-width: 786px !important;
  padding: 8px;
  font-size: 18px;
}

/* ====ハンバーガーメニュー==== */
input[type="checkbox"]#menu{
  position: absolute;
  top: -120%;
}
.mobile_btn{
  position: fixed;
  top: 10px;
  right: 10px;
  z-index: 9999;
  display: flex;
  align-items: center;
  width: 50px;
  height: 50px;
  background-color: #121212;
}
.mobile_btn span{
  position: relative;
  top: 24px;
  display: block;
  width: 40px;
  height: 3px;
  margin: 0 auto;
  background-color: #fff;
}
.mobile_btn span::before,
.mobile_btn span::after{
  content: "";
  position: absolute;
  display: block;
  width: 40px;
  height: 3px;
  margin: 0 auto;
  background-color:#fff;
  transition: all .2s ease-in-out;
}
.mobile_btn span::before{
  top: -10px;
}
.mobile_btn span::after{
  top: 10px;
}
input[type="checkbox"]#menu:checked ~ .mobile_btn span{
  background-color: transparent;
}
input[type="checkbox"]#menu:checked ~ .mobile_btn span::before{
  transform: translateY(10px) rotate(45deg);
}
input[type="checkbox"]#menu:checked ~ .mobile_btn span::after{
  transform: translateY(-10px) rotate(-45deg);
}
/* mobileナビエリアの設定 */
.mobile_nav{
  position: fixed;
  top: -120%;
  z-index: 999;
  width: 100%;
  background-color: #fff;
  transition: .2s;
  opacity: .9;
  box-shadow: 0 1px 10px #121212;
}
input[type="checkbox"]#menu:checked ~ .mobile_nav{
  position: fixed;
  top: 0;
}
.mobile_nav li{
  border-bottom: 1px solid #ccc;
}
.mobile_nav a{
  display: block;
  width: 100%;
  padding: 6px;
  color: #121212;
  font-size: 16px;
}
/* ====表示に関する設定==== */
.pc{display: none;}
.mb{display: block;}
.flex{display: flex;}
.align-left{text-align: left;}

/* ====PC用の設定==== */
@media screen and (min-width: 1025px){
.mb{display: none;}
.pc{display: block;}
.pc-flex{display: flex;}

/* ====headerの設定==== */
.header-logo{
  margin: 8px 0 16px 20px;
}
.header-cta{
  margin: 8px 20px 16px 0;
}
.header-cta-txt{
  font-size: 18px;
  font-weight: bold;
  color: #ff561f;
  backgrond-color: #ffc096;
}
.header-cta-tel a{
  color: #8c55a1;
  font-size: 28px;
  font-weight: bold;
}

.header_nav{width: 100%;}
.header_nav_list{
  justify-content: center;
}
.header_nav_list li{
  width: 100%;
}
.header_nav a{
  display: block;
  padding: 10px;
  background-color: #8c55a1;
  color: #eee;
  font-size: 12px;
  white-space: nowrap;
  text-align: center;
  border: 1px solid #fff;
}
.header_nav a::first-line {
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.5px;
  color: #fff;
}
.header_nav a:hover{
  background-color: #ff561f;
}
/* ====footerの設定==== */
.footer{
  width: 100%;
  min-height: auto;
  background-image: url("img/footer-bg.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.footer-cta-title{
  font-size: 36px;
  margin-top: 100px;
  margin-bottom: 18px;
}
.entry-btn{
  width: 400px;
  height: 40px;
}
}