/*
Theme:CMSpro BlockTheme Beta
Author:CMSpro.
Description:CMSpro BlockTheme Beta
Requires at least: 6.8.1
Tested up to: 6.8.1
Requires PHP: 8.0.30
Version: 0.0.1
*/
/* 注 意 -------------------------------------------
このCSSには投稿・固定ページで入力した内容を整形するものは含めない

● style.css
投稿・固定で使用するもの以外のCSSを記述します

● style-editor.css
エディター側で使用するCSSを記述しています。
フロントには出力しないため、追記した際は必ずstyle-frontend.cssにも追記すること
追記する際の注意点は、style-editor.cssを参照すること

● style-frontend.css
投稿・固定ページで入力した内容をフロントエンドで整形するCSSです。
style-editor.cssで追記したものは必ずこちらにも追記してください
追記する際の注意点は、style-frontend.cssを参照すること

--------------------------------------------------*/
/*策定検討中*/
:root {
  /* 基本設定 */
  --wp--style--root--padding-top: 0px !important;
  --wp--style--root--padding-right: 0px !important;
  --wp--style--root--padding-bottom: 0px !important;
  --wp--style--root--padding-left: 0px !important;
  /*色*/
  --cmspro--BlockTheme--basic-bgcolor-type01:#000;
  --cmspro--BlockTheme--basic-color-primary:#e5555d;
  --cmspro--BlockTheme--basic-color-secondary:#000;
  /*文字サイズ*/
  --cmspro--BlockTheme--basic-fontsize-root:16px;
  --cmspro--BlockTheme--basic-fontsize-h1:16px;
  --cmspro--BlockTheme--basic-fontsize-h2:16px;
  --cmspro--BlockTheme--basic-fontsize-h3:16px;
  --cmspro--BlockTheme--basic-fontsize-h4:16px;
  --cmspro--BlockTheme--basic-fontsize-h5:16px;
  --cmspro--BlockTheme--basic-fontsize-h6:16px;
  --cmspro--BlockTheme--basic-fontsize-p:16px;
  /*行間*/
  --cmspro--BlockTheme--basic-lineheight-p:16px;
  color-scheme: light;
}
body{ padding: 0px !important; background-color: #fff;}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}:where([hidden]:not([hidden='until-found'])){display:none!important}:where(html){-webkit-text-size-adjust:none;color-scheme:dark light;tab-size:2;scrollbar-gutter:stable;interpolate-size:allow-keywords;line-height:1.5}:where(html:has(dialog:modal[open])){overflow:clip}@media (prefers-reduced-motion:no-preference){:where(html:focus-within){scroll-behavior:smooth}}:where(body){line-height:inherit;font-family:system-ui,sans-serif;-webkit-font-smoothing:antialiased}:where(button){all:unset}:where(input,button,textarea,select){font:inherit;color:inherit;letter-spacing:inherit;word-spacing:inherit;font-feature-settings:inherit;font-variation-settings:inherit}:where(textarea){resize:vertical;resize:block}:where(button,label,select,summary,[role='button'],[role='option']){cursor:pointer}:where(:disabled,label:has(>:disabled,+disabled)){cursor:not-allowed}:where(a){color:inherit;text-underline-offset:.2ex}:where(ul,ol){list-style:none}:where(img,svg,video,canvas,audio,iframe,embed,object){display:block}:where(img,picture,svg,video){max-inline-size:100%;block-size:auto}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(h1,h2,h3){line-height:calc(1em + 0.5rem);}:where(hr){border:none;border-block-start:1px solid;color:inherit;block-size:0;overflow:visible}:where(dialog,[popover]){border:none;background:none;color:inherit;inset:unset;max-width:unset;max-height:unset;overflow:unset}:where(dialog:not([open],[popover]),[popover]:not(:popover-open)){display:none!important}:where(:focus-visible){outline:3px solid CanvasText;box-shadow:0 0 0 5px Canvas;outline-offset:1px}:where(:focus-visible,:target){scroll-margin-block:8vh}:where(.visually-hidden:not(:focus-within,:active)){clip-path:inset(50%)!important;height:1px!important;width:1px!important;overflow:hidden!important;position:absolute!important;white-space:nowrap!important;border:0!important;user-select:none!important}
/*全体の枠組み*/
a{
  opacity: 1;
  transition: .5s;
}
a:hover{
  opacity: .5;
  transition: .5s;
}


.header-wrap{
  max-width: 1200px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  margin: auto;
  padding: 15px 2%;
  box-sizing: content-box;
}

.site-title{
  display: block;
  width: 295px;
  height: auto;
  aspect-ratio: 295 / 60;
}
.site-title a{
  margin: 0;
  padding: 0;
  display: block;
  text-indent: -9999px;
  background-image: url('/wp-content/themes/cmspro-blocktheme_beta/images/logo.png');
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  height: auto;
  aspect-ratio: 295 / 60;
}
@media (max-width: 1000px) {
  .site-title{
    display: block;
    width: 155px;
    height: 31px;
    aspect-ratio: 295 / 60;
  }
  .site-title a{
    width: 155px;
    height: 31px;
  }/*
  .global-nav .menu a{
    font-size: 13px;
  }
  .global-nav .menu{
    gap: 15px;
  }*/
  header{
    position: sticky;
    top:0px;
    left: 0px;
    width: 100%;
    background-color: #fff;
    z-index: 99999;
  }
}

/*ナビゲーションボタン*/
@media (max-width: 1000px) {
  header button{
    position: relative;
    display: inline-block;
    text-decoration: none;
    appearance: none;
    border: none;
    background-color: transparent;
    cursor: pointer;
    width: 40px;
    height: 40px;
    z-index: 12;
  }
  .u-visuallyHidden {
    position: absolute;
    white-space: nowrap;
    width: 1px;
    height: 1px;
    overflow: hidden;
    border: 0;
    padding: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
  }
  header button::before{
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background-color:#333;
    position: absolute;
    top: 8px;
    left: 0px;
    transition: .5s;
  }
  header button > span{
    display: block;
    width: 100%;
    height: 2px;
    background-color: #333;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
    transition: .5s;
  }
  header button::after{
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background-color:#333;
    position: absolute;
    bottom: 8px;
    left: 0px;
    transition: .5s;
  }
  header button.js-active::before{
    width: 100%;
    height: 2px;
    background-color: #333;
    top: 19px;
    left: 0px;
    transform:rotate(45deg);
  }
  header button.js-active > span{
    background-color: #333;
    left: -30px;
    opacity: 0;
  }
  header button.js-active::after{
    width: 100%;
    height: 2px;
    background-color: #333;
    bottom:19px;
    left: 0px;
    transform:rotate(-45deg);
  }
}
/*ナビゲーションボタン*/
@media not (max-width: 1000px) {
  header button{
    display: none;
  }
}

/*ナビゲーション*/
@media (max-width:1000px) {
  nav#gnav{
    position: fixed;
    width: 100%;
    height: 0px;
    overflow: hidden;
    top:0;
    left:0;
    background-color:#fff;
    transition: .5s;
    z-index: 11;
  }
  nav#gnav.js-active{
    height: 100vh;
  }
  nav#gnav ul.menu{
    padding: 60px 60px 0px 20px;
  }
  nav#gnav ul.menu li {
    margin-bottom: 20px;

  }
  nav#gnav ul.menu li a{
    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: 700;
    text-align:left;
    text-decoration: none;
  }
}
@media not (max-width: 1000px) {
  nav#gnav ul.menu{
    display: flex;
    gap: 50px;
  }
  nav#gnav ul.menu a{
    text-decoration: none;
    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: 700;
  }
  nav#gnav ul.menu .header-button a{
    padding:15px 35px;
    background-color: var(--cmspro--BlockTheme--basic-color-primary);
    color: #fff;
    border-radius: 9999px;
    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: 700;
  }
}


/*フッター*/
#footer-nav{
  margin-top: 5em;
  background-color: #FFEFEF;
}
#footer-nav .footer-menu{
  max-width: 1000px;
  display: flex;
  flex-wrap: wrap;
  margin: auto;
  padding: 3em 2%;
  box-sizing: content-box;
  gap: 20px;
  font-size: 12px;
}
#footer-nav .footer-menu a{
  text-decoration: none;
}
/*外部リンクアイコン*/
.link-blank a{
  display: flex;
  align-items: center;
  gap:5px;
}
.link-blank a::after{
  content: '';
  display: block;
  background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2015%2015%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3Anone%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpath%20d%3D%22M11.07%2C14.28H2.1c-.76%2C0-1.38-.62-1.38-1.38V3.93c0-.76.62-1.38%2C1.38-1.38h4.83v1H2.1c-.21%2C0-.38.17-.38.38v8.97c0%2C.21.17.38.38.38h8.97c.21%2C0%2C.38-.17.38-.38v-4.83h1v4.83c0%2C.76-.62%2C1.38-1.38%2C1.38Z%22%2F%3E%3Cpolygon%20points%3D%228.61%20.72%208.61%201.72%2012.57%201.72%206.55%207.74%207.26%208.45%2013.28%202.43%2013.28%206.39%2014.28%206.39%2014.28%20.72%208.61%20.72%22%2F%3E%3Crect%20class%3D%22cls-1%22%20width%3D%2215%22%20height%3D%2215%22%2F%3E%3C%2Fsvg%3E');
  background-repeat: no-repeat;
  background-size: cover;
  width: 1em;
  height: 1em;
}
footer{
  background-color: var(--cmspro--BlockTheme--basic-color-primary) ;
  color: #fff;
  text-align: center;
  padding: 0;
  margin:0;

}
footer p{
  display: block;
  font-size: 11px;
  padding: 0;
  padding: 1em 2%!important;
  margin: 0!important;
}
@media (max-width:1000px) {
  body:not(.page-id-203) footer{
    padding-bottom: 70px;
  }
}

/*投稿・固定ページ*/
#submain {
    height: 150px;
    position: relative;
    overflow: hidden;
    background-color:#FFEFEF;
}
.h1wrap {
    width: 1000px;
    height: 100%;
    margin: auto;
    display: flex;
    align-items: center;
}
#submain h1 {
    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: 700;
    width: 100%;
    padding: 0 30px;
    color: #000;
    /*font-size: 2rem;*/
    font-size: clamp(1.25rem, 0.8095rem + 1.9048vw, 2rem);
    font-weight: bold;
    line-height: 1.3;
    text-align: center;
}
@media screen and (max-width: 1000px) {
    #submain h1{
      text-align: left;
    }
    #submain .h1wrap {
        width: auto;
    }

}
/*パンくずリスト*/
#pan {
    font-size: 10px;
    font-family: 'Arial', 'Helvetica', sans-serif;
    margin: 10px auto;
    max-width: 1000px;
    line-height: 1.4;
    padding:2% 0;
}
@media screen and (max-width: 1000px) {
    #pan {
      padding:2%;
    }
}


/*アーカイブ*/
#archive-main{
  max-width: 1000px;
  margin: auto;
  padding: 0 0 5%;
}
.post_wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0 0 20px;
}
.post_wrap::after{
  content: '';
  width: calc(50% - 10px);
  display: block;
  height: 1px;
}
.post_box {
    width: calc(50% - 10px);
    margin-bottom: 20px;
    position: relative;
    border: 1px solid #ccc;
}
.post_box.nonesetting{
    border: 0px;
    margin-bottom:20px;
    width: 100%;
}
.post_box.nonesetting p{
  padding-left: 0px;
  padding-right: 0px;
}
.post_box.nonesetting p.more::before {
    left: 0px;
}
.post_box.nonesetting p.more {
  padding-left: 15px;
}

.post_box a.post_link {
    display: block;
    width: 100%;
    height: 100%;
    transition-duration: 0.3s;
    text-decoration: none;
}
.post_img {
    height: 300px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.posttitle {
    margin-bottom: 5px;
}
.post_box p.date {
    display: block;
    padding: 10px;
    margin: 0;
}
p.date i {
    margin: 0 10px 0 0;
}
.fa {
    display: inline-block;
    font: normal normal normal 14px / 1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.post_wrap h3 {
    clear: both;
    height: auto;
    background: none;
    padding: 0;
    margin: 5px 10px 0;
    font-size: 18px;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;
    color: #333;
    letter-spacing: 2px;
    line-height: normal;
    text-align: left;
    border-bottom: none;
}
.post_box p.more {
    padding: 5px 20px 5px 40px;
    position: relative;
    text-decoration: none;
}
.post_box p {
    line-height: 1.5;
    padding: 10px;
}
.post_box p.more::before {
    content: " \f054";
    font-family: FontAwesome;
    color: #ccc;
    position: absolute;
    left: 15px;
    top: 5px;
    transition: 0.3s;
}
@media screen and (max-width: 1000px) {
  #archive-main{
    padding: 0 2% 5%;
  }
  .post_wrap::after{
    width:100%;
  }
  .post_box {
    width:100%;
  }
}

/*リクルートページアーカイブ*/
ul.recruit-archivelist li{
  max-width: 900px;
  border-radius: 10px;
  background: #FFF;
  box-shadow: 2px 2px 8px 1px rgba(0, 0, 0, 0.25);
  margin:0 auto 1.5em;
  overflow: hidden;
  padding: 1em;
}
ul.recruit-archivelist li a{
  display: flex;
  text-decoration: none;
  align-items: center;
  min-height: 100px;
  height: 100%;
  gap: 20px;
}
ul.recruit-archivelist li a img{
  /*
  height: 100%;
  min-height: 100px;
  width: 300px;
  */
  width: 300px;
  aspect-ratio: 3 / 2;
    /*border-radius: 0 10px 10px 0;*/
  border-radius:8px;
  object-fit: cover;
  object-position: center center;
}
ul.recruit-archivelist li .recruit-info-group{
  width: calc(100% - 320px);
  /*padding: 1em;*/
}
ul.recruit-archivelist li .recruit-info-group h3{
    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: 700;
    font-size: 22px;
    margin-bottom: 0.3em;
}
ul.recruit-archivelist li .recruit-info-group p{
  font-size: 16px;
  margin-bottom: 0;
}
@media (max-width: 781px) {
ul.recruit-archivelist{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
ul.recruit-archivelist li{
  max-width: 48%;
  width: 48%;
  border-radius: 10px;
  background: #FFF;
  box-shadow: 2px 2px 8px 1px rgba(0, 0, 0, 0.25);
  margin:0 auto 1.5em;
  overflow: hidden;
  padding: 1em;
}
ul.recruit-archivelist li a{
  display: block;
}
ul.recruit-archivelist li .recruit-info-group{
  width: 100%;
}
ul.recruit-archivelist li a img{
  width: 100%;
  margin-bottom: 0.5em;
}
}
@media (max-width: 500px) {
ul.recruit-archivelist li{
  max-width: 100%;
  width: 100%;
}
}

/*フッター固定*/
.footer-fixed{
  display: none;
}
@media (max-width:1000px) {
.footer-fixed{
  display: block;
  position: fixed;
  bottom: 0px;
  left: 0px;
  padding: 10px;
  background-color: rgba(255,255,255,.5);
  width: 100%;
}
.footer-fixed .footer-element-button {
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 18px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e5555d;
    color: #fff;
    width: 100%;
    height: 50px;
    border-radius: 9999px;
    text-align: center;
    text-decoration: none;
}
}

/*---------------------------------------------------------------------
【 重要 】このCSSには投稿・固定ページで入力した内容を整形するものは含めない
● このファイル上部・注意の項目を必ず参照してください
● この行以降にはコードを記述しないでください。必ずこのコメントアウト最終行にあること
---------------------------------------------------------------------*/