/*
Theme Name: STARTER GYM
Author: 飯島 怜
Description: STARTER GYMのホームページ用テーマ
Version: 1.0
*/

@charset "UTF-8";

/* ベース ------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------*/
html {
    font-size: 62.5%;
    overflow: auto;
}
  
body {
    font-size: 1.6rem;
    line-height: 22px;
    font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
    color: #0A0A0A;
    background-color: #fff;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

a {
    color: #000;
}

a:hover {
    color: #616161;
}

/* ヘッダー ----------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------*/
header {
    position: fixed;
    width: 100%;
    align-items: center;
    background: -moz-linear-gradient(top, #0000009f, #FFF);
    background: -webkit-linear-gradient(top, #0000009f, rgba(255, 255, 255, 0));
    background: linear-gradient(to bottom, #0000009f, rgba(255, 255, 255, 0));
    z-index: 1000;
}

/* ロゴ -----------------------------------------*/
header .header_logo {
    padding-left: 3%;
}

header .header_logo img {
    width: 18%;
    vertical-align: bottom;
}

/* ハンバーガーメニュー ---------------------------------*/
.h-menu {
    position: fixed;
    top: 3%;
    right: 6%;
}

/* inputのcheckboxは非表示に */
.h-menuCheckbox {
    display: none;
}

/* ハンバーガーメニュー アイコン */
.h-menu_icon {
    display: inline-block;
    width: 20px;
    height: 30px;
    vertical-align: middle;
}

/* 3本線 */
.hamburger-icon, .hamburger-icon::before, .hamburger-icon::after {
    content: '';
    display: block;
    position: absolute;
    z-index: 100;
    top: 0;
    bottom: 0;
    width: 24px;
    height: 1.5px;
    background: #fff;
    cursor: pointer;
}

.hamburger-icon:before {
    top: 7px;
}

.hamburger-icon:after {
    top: 14px;
}

/* メニュー以外を暗くする */
#h-menu_black {
    display: none;
    position: fixed;
    z-index: 98;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: black;
    opacity: 0;
    transition: .7s ease-in-out;
}

/* 中身 */
#h-menu_content {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 99;
    width: 100%;
    max-width: 220px;
    height: 100vh;
    padding: 53px 16px 16px;
    background: #D47803;
    overflow: auto;
    transition: .3s ease-in-out;
    -webkit-transform: translateX(105%);
    transform: translateX(105%);
}

/* チェックボックスにチェックが入ったら表示 */
input:checked ~ .h-menu_icon .hamburger-icon {
    background: transparent;
}

input:checked ~ .h-menu_icon .hamburger-icon::before {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    top: 10px;
    z-index: 999;
    background-color: #fff;
}

input:checked ~ .h-menu_icon .hamburger-icon::after {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 10px;
    z-index: 999;
    background-color: #fff;
}

input:checked ~ #h-menu_black {
    display: block;
    opacity: .8;
}

#h-menu_checkbox:checked ~ #h-menu_content {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    box-shadow: 6px 0 25px rgba(0, 0, 0, 0.041);
}

.h-menu_icon .hamburger-icon,
.h-menu_icon .hamburger-icon::before,
.h-menu_icon .hamburger-icon::after,
#h-menu_black,
#h-menu_content {
    -webkit-transition: all .3s;
    transition: all .3s;
}

#h-menu_content ul {
    list-style: none;
    margin: 15% 0% 0% 5%;
    padding: 0;
}

#h-menu_content li a {
    display: block;
    color: #fff;
    font-size: 1.6rem;
    line-height: 10px;
    padding: 35px;
    text-decoration: none;
    transition-duration: 0.2s;
}

#h-menu_content li a:hover {
    background: #e2e2e288;
}

/* ヘッダーメニュー -----------------------------------*/
header .header_menu ul {
    display: none;
}

/* TOP --------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------*/
/* メインビジュアル -----------------------------------------------------------------------------------*/
.mainvisual {
    position: relative;
}

/* 背景画像 ---------------------------------------*/
.toppage .mainvisual .img img {
    height: 100vh;
    object-fit: cover;
    object-position: -700px;
    vertical-align: bottom;
}

/* キャッチコピー ------------------------------------*/
.toppage .mainvisual .catchcopy1 {
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    white-space: nowrap;
    text-align: center;
}

.toppage .mainvisual .catchcopy1 h1 {
    color: #fff;
    font-size: 3.8rem;
    animation-name: fadeLeftAnime;
    animation-duration: 1.5s;
    animation-fill-mode: forwards;
    animation-delay: 0.5s;
    opacity: 0;
}

@keyframes fadeLeftAnime{
from {
    opacity: 0;
}

to {
    opacity: 1;
    }
}

.toppage .mainvisual .catchcopy1 h2 {
    color: #fff;
    font-size: 1.8rem;
    font-weight: normal;
    animation-name: fadeLeftAnime;
    animation-duration: 1.5s;
    animation-fill-mode: forwards;
    animation-delay: 1s;
    opacity: 0;
}

@keyframes fadeLeftAnime{
    from {
        opacity: 0;
    }
    
    to {
        opacity: 1;
    }
}

/* 会員登録ボタン ------------------------------------*/
.toppage .mainvisual .entry_btn a img {
    position: absolute;
    width: 45%;
    top: 55%;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

/* スクロールダウン -----------------------------------*/
.toppage .scrolldown {
    position: absolute;
    left: 50%;
    bottom: 10px;
    height: 50px;
}

.toppage .scrolldown span {
    position: absolute;
    font-size: 1.4rem;
    color: #fff;
    top: -30px;
    left: -30px;
    letter-spacing: 0.05em;
}

.toppage .scrolldown::after {
    content: "";
    position: absolute;
    top: 0;
    width: 1px;
    height: 35px;
    background: #fff;
    animation: pathmove 1.4s ease-in-out infinite;
    opacity: 0;
}

@keyframes pathmove{
    0%{
      height: 0;
      top: -15px;
      opacity: 0;
    }
    30%{
      height: 35px;
      opacity: 1;
    }
    100%{
      height: 0;
      top: 60px;
      opacity: 0;
    }
}

/* キャンペーン ---------------------------------------------------------------------------------------*/
.campaign {
    color: #D47803;
    font-size: 1.8rem;
    font-weight: bolder;
    line-height: 27px;
    text-align: center;
    width: 100%;
    margin: 7% 0% 0% 0%;
}

/* キャッチコピー --------------------------------------------------------------------------------------*/
.catchcopy2 {
    font-weight: bolder;
    text-align: center;
    line-height: 25px;
    width: 80%;
    margin: 7% 10% 0% 10%;
}

/* 他社との比較メリット -----------------------------------------------------------------------------------*/
/* メインタイトル ------------------------------------*/
.merit .maintitle {
    text-align: center;
}
  
.merit .maintitle h1 {
    position: relative;
    display: inline-block;
    color: #D47803;
    font-size: 1.8rem;
    margin: 15% 0% 0% 0%;
}
  
.merit .maintitle h1:before {
    content: '';
    position: absolute;
    bottom: -10px;
    display: inline-block;
    width: 70px;
    height: 2.5px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: #D47803;
    border-radius: 2px;
}

/* テキスト ---------------------------------------*/
.merit .text {
    width: 80%;
    margin: 7% 10% 0% 10%;
}

/* チェック項目 --------------------------------------*/
.merit .checkmark_content {
    width: 70%;
    margin: 5% 15% 0% 15%;
}

.merit .checkmark_content .checkmark {
    display: flex;
    margin-top: 2%;
}

.merit .checkmark_content .checkmark img {
    width: 25px;
    height: 25px;
    vertical-align: bottom;
}

.merit .checkmark_content .checkmark p {
    margin: 0% 0% 0% 2%;
}

/* NEWS -----------------------------------------------------------------------------------------*/
.toppage .news {
    margin: 0;
}

/* メインタイトル ------------------------------------*/
.toppage .news .maintitle h1 {
    color: #fff;
    font-size: 1.8rem;
    font-weight: bolder;
    text-align: center;
    padding: 3% 0%;
    background-color: #D47803;
    margin: 15% 0% 0% 0%;
}

/* コンテンツ --------------------------------------*/
.toppage .news .whatsnew h1 {
    display: none;
}

.toppage .news .whatsnew {
    width: 80%;
    margin: 7% 10% 0% 10%;
}

.toppage .news .whatsnew dt , dd {
    color: #404040;
}

.toppage .news .whatsnew .newmark {
    font-size: 1.4rem;
    background-color: #D47803;
}

/* MOREボタン ------------------------------------*/
.toppage .news img {
    width: 40%;
    margin: 5% 30% 0% 30%;
    vertical-align: bottom;
}

/* PLAN -----------------------------------------------------------------------------------------*/
/* メインタイトル ------------------------------------*/
.toppage .plan .maintitle h1 {
    color: #fff;
    font-size: 1.8rem;
    font-weight: bolder;
    text-align: center;
    padding: 3% 0%;
    background-color: #D47803;
    margin: 15% 0% 0% 0%;
}

/* コンテンツ --------------------------------------*/
.toppage .plan .content {
    text-align: center;
    width: 80%;
    margin: 7% 10% 0% 10%;
}

.toppage .plan .content .title {
    color: #D47803;
    font-weight: bold;
    margin: 5% 0% 0% 0%;
}

.toppage .plan .content .sentence {
    margin: 2% 0% 0% 0%;
}

.toppage .plan .content .last_sentence {
    color: #D47803;
}

/* ACCESS ---------------------------------------------------------------------------------------*/
/* メインタイトル ------------------------------------*/
.toppage .access .maintitle h1 {
    color: #fff;
    font-size: 1.8rem;
    font-weight: bolder;
    text-align: center;
    padding: 3% 0%;
    background-color: #D47803;
    margin: 15% 0% 0% 0%;
}

























/* NEWSページ --------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------*/
.news {
    margin: 25% 0% 0% 0%;
}
  
/* ページタイトル ------------------------------------*/
.news .page_title {
    color: #fff;
    font-size: 1.8rem;
    font-weight: bolder;
    text-align: center;
    padding: 3% 0%;
    background-color: #D47803;
}
  
/* コンテンツ --------------------------------------*/
.news .article {
    list-style: none;
    padding: 0;
}
  
/* タイトル */
.news .article .title {
    font-size: 1.8rem;
    font-weight: bold;
    width: 80%;
    margin: 10% 10% 0% 10%;
    padding: 10% 0% 0% 0%;
    border-top: 1.5px solid #D47803;
}
  
/* 日付 */
.news .article .date {
    margin: 2% 0% 0% 10%;
}
  
/* 本文（画像）*/
.news .article img {
    width: 55%;
    margin: 2% 0% 0% 10%;
    vertical-align: bottom;
}
  
/* 本文（テキスト）*/
.news .article p {
    width: 80%;
    margin: 2% 10% 2% 10%;
}
  
/* 本文（続きを見る）*/
.news .article .more-link {
    margin: 0% 0% 0% 10%;
}
  
/* ページネーション -----------------------------------*/
.news .nav-links {
    text-align: center;
    margin: 15% 0% 0% 0%;
}
  
/* 記事詳細ページ ----------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------*/
/* 記事 -----------------------------------------*/
/* タイトル */
.detail .title {
    font-size: 1.8rem;
    width: 80%;
    margin: 35% 10% 0% 10%;
}
  
/* 日付 */
.detail .date {
    margin: 2% 0% 0% 10%;
}
  
/* 本文（テキスト）*/
.detail .content p {
    width: 80%;
    margin: 2% 10% 0% 10%;
}
  
.detail .content .has-text-align-left {
    width: 80%;
    margin: 2% 0% 0% 10%;
}
  
/* 本文（画像） */
.detail .content img {
    width: 55%;
    margin: 2% 0% 0% 10%;
    vertical-align: bottom;
}
  
/* ページナビゲーション ---------------------------------*/
.detail .page_nav {
    margin: 15% 0% 0% 10%;
}
  
/* 記事一覧に戻る ------------------------------------*/
.detail .link a {
    display: block;
    text-align: right;
    margin: 0% 10% 0% 0%;
}  

/* STAFFページ -------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------*/
.staff {
    margin: 25% 0% 0% 0%;
}
  
/* ページタイトル ------------------------------------*/
.staff .page_title {
    color: #fff;
    font-size: 1.8rem;
    font-weight: bolder;
    text-align: center;
    padding: 3% 0%;
    background-color: #D47803;
}
  
/* コンテンツ --------------------------------------*/
.staff .content {
    width: 80%;
    margin: 0% 10% 0% 10%;
}

.staff .content .item {
    display: flex;
    flex-direction: column;
}
  
.staff .content .item .img img {
    width: 40%;
    margin: 5% 0% 0% 0%;
    vertical-align: bottom;
}
  
.staff .content .item .text .name {
    font-size: 1.8rem;
    font-weight: bold;
    margin: 3% 0% 0% 0%;
    padding-bottom: 3%; 
    border-bottom: 1.5px solid #D47803;
}

.staff .content .item .text .sentence {
    margin: 3% 0% 0% 0%;
}

/* RECRUITページ -----------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------*/
.recruit {
    margin: 25% 0% 0% 0%;
}
  
/* ページタイトル ------------------------------------*/
.recruit .page_title {
    color: #fff;
    font-size: 1.8rem;
    font-weight: bolder;
    text-align: center;
    padding: 3% 0%;
    background-color: #D47803;
}
  
/* コンテンツ --------------------------------------*/






























/* Q&Aページ ---------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------*/
.qa {
    margin: 25% 0% 0% 0%;
}
  
/* ページタイトル ------------------------------------*/
.qa .page_title {
    color: #fff;
    font-size: 1.8rem;
    font-weight: bolder;
    text-align: center;
    padding: 3% 0%;
    background-color: #D47803;
}
  
/* コンテンツ --------------------------------------*/
.qa .content ul {
    list-style: none;
    width: 80%;
    margin: 7% 10% 0% 10%;
    padding: 0;
}

.qa .content ul .q {
    font-size: 1.8rem;
    color: #D47803;
    font-weight: bold;
    line-height: 23px;
    background: url(images/qa.png) left 0px top 0px no-repeat;
    background-size: 20px auto;
    border-bottom: 1.5px solid #D47803;
    padding: 0% 0% 2% 10%;
}

.qa .content ul .a {
    margin: 2% 0% 10% 0%;
}

/* CONTACTページ -----------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------*/
.contact {
    margin: 25% 0% 0% 0%;
}
  
/* ページタイトル ------------------------------------*/
.contact .page_title {
    color: #fff;
    font-size: 1.8rem;
    font-weight: bolder;
    text-align: center;
    padding: 3% 0%;
    background-color: #D47803;
}
  
/* コンテンツ --------------------------------------*/
.wpcf7 {
    width: 70%;
    margin: 7% 15% 0% 15%;
}

/* 必須 */
.required {
    color: #fff;
    font-size: 1.4rem;
    background-color: #D47803;
    padding: 1% 1.5%;
    border-radius: 5px;
}

/* 入力欄 */
input, textarea {
    width: 100%;
    margin: 1% 0% 0% 0%;
    color: #fff;
    border: 1.5px solid #D47803;
    border-radius: 5px;
}

/* 送信ボタン */
.wpcf7 .wpcf7-submit {
    width: 50%;
    margin: 3% 25% 0% 25%;
    padding: 5% 5%;
    color: #fff;
    font-weight: normal;
    background-color: #D47803;
    border: none;
    font-weight: normal;
}

/* フッター ----------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------*/
footer {
    margin: 20% 0% 0% 0%;
    color: #fff;
    background-color: #D47803;
}

/* ロゴ（画像）--------------------------------------*/
footer .footer_logo img {
    width: 25%;
    margin: 5% 0% 0% 10%;
}

/* テキスト1 --------------------------------------*/
footer .footer_text1 {
    font-size: 1.8rem;
    font-weight: bold;
    width: 80%;
    margin: 5% 10% 0% 10%;
}

/* テキスト2 --------------------------------------*/
footer .footer_text2 {
    width: 80%;
    margin: 5% 10% 0% 10%;
}

/* テキスト3 --------------------------------------*/
footer .footer_text3 {
    width: 80%;
    margin: 2% 10% 0% 10%;
}

/* フッターメニュー -----------------------------------*/
footer .footer_menu ul {
    list-style: none;
    line-height: 27px;
    margin: 5% 0% 0% 10%;
    padding: 0;
}

footer .footer_menu ul li a {
    color: #fff;
    margin: 0;
    padding: 0;
}

footer .footer_menu ul li a:hover {
    color: #8caf97;
}

/* コピーライト -------------------------------------*/
footer #copyright {
    font-size: 1.4rem;
    text-align: right;
    margin: 5% 0% 0% 0%;
    padding: 0% 1% 1% 0%;
}

/* 404ページ ---------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------*/
/* タイトル ---------------------------------------*/
.errorpage .errorpage_title {
    font-size: 2.5rem;
    font-weight: bold;
    text-align: center;
    margin: 45% 0% 0% 0%;
}

/* テキスト ---------------------------------------*/
.errorpage .errorpage_text {
    width: 80%;
    margin: 5% 10% 0% 10%;
}

/* トップページに戻る ----------------------------------*/
.errorpage .link a {
    display: inline-block;
    color: #fff;
    background: #D47803;
    border-radius: 60px;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    width: 55%;
    margin: 5% 22.5% 70% 22.5%;
    padding: 2.5% 0%;
}

/* TB用 -------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 767px) {

    /* ベース ------------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    html {
        font-size: 62.5%;
        overflow: auto;
    }
    
    body {
        font-size: 1.8rem;
        line-height: 22px;
        font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
        color: #0A0A0A;
        background-color: #fff;
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        overflow: hidden;
    }

    a {
        color: #000;
    }

    a:hover {
        color: #616161;
    }

    /* ヘッダー ----------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    header {
        position: fixed;
        width: 100%;
        align-items: center;
        background: -moz-linear-gradient(top, #0000009f, #FFF);
        background: -webkit-linear-gradient(top, #0000009f, rgba(255, 255, 255, 0));
        background: linear-gradient(to bottom, #0000009f, rgba(255, 255, 255, 0));
        z-index: 1000;
    }

    /* ロゴ -----------------------------------------*/
    header .header_logo {
        padding-left: 3%;
    }

    header .header_logo img {
        width: 13%;
        vertical-align: bottom;
    }

    /* ハンバーガーメニュー ---------------------------------*/
    .h-menu {
        position: fixed;
        top: 3%;
        right: 5%;
    }

    /* inputのcheckboxは非表示に */
    .h-menuCheckbox {
        display: none;
    }

    /* ハンバーガーメニュー アイコン */
    .h-menu_icon {
        display: inline-block;
        width: 20px;
        height: 30px;
        vertical-align: middle;
    }

    /* 3本線 */
    .hamburger-icon, .hamburger-icon::before, .hamburger-icon::after {
        content: '';
        display: block;
        position: absolute;
        z-index: 100;
        top: 0;
        bottom: 0;
        width: 30px;
        height: 1.5px;
        background: #fff;
        cursor: pointer;
    }

    .hamburger-icon:before {
        top: 10px;
    }

    .hamburger-icon:after {
        top: 20px;
    }

    /* メニュー以外を暗くする */
    #h-menu_black {
        display: none;
        position: fixed;
        z-index: 98;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: black;
        opacity: 0;
        transition: .7s ease-in-out;
    }

    /* 中身 */
    #h-menu_content {
        position: fixed;
        top: 0;
        right: 0;
        z-index: 99;
        width: 100%;
        max-width: 350px;
        height: 100vh;
        padding: 53px 16px 16px;
        background: #D47803;
        overflow: auto;
        transition: .3s ease-in-out;
        -webkit-transform: translateX(105%);
        transform: translateX(105%);
    }

    /* チェックボックスにチェックが入ったら表示 */
    input:checked ~ .h-menu_icon .hamburger-icon {
        background: transparent;
    }

    input:checked ~ .h-menu_icon .hamburger-icon::before {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        top: 10px;
        z-index: 999;
        background-color: #fff;
    }

    input:checked ~ .h-menu_icon .hamburger-icon::after {
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 10px;
        z-index: 999;
        background-color: #fff;
    }

    input:checked ~ #h-menu_black {
        display: block;
        opacity: .8;
    }

    #h-menu_checkbox:checked ~ #h-menu_content {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
        box-shadow: 6px 0 25px rgba(0, 0, 0, 0.041);
    }

    .h-menu_icon .hamburger-icon,
    .h-menu_icon .hamburger-icon::before,
    .h-menu_icon .hamburger-icon::after,
    #h-menu_black,
    #h-menu_content {
        -webkit-transition: all .3s;
        transition: all .3s;
    }

    #h-menu_content ul {
        list-style: none;
        margin: 15% 0% 0% 5%;
        padding: 0;
    }

    #h-menu_content li a {
        display: block;
        color: #fff;
        font-size: 2rem;
        line-height: 10px;
        padding: 50px;
        text-decoration: none;
        transition-duration: 0.2s;
    }

    #h-menu_content li a:hover {
        background: #e2e2e288;
    }

    /* ヘッダーメニュー -----------------------------------*/
    header .header_menu ul {
        display: none;
    }

    /* TOP --------------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    /* メインビジュアル -----------------------------------------------------------------------------------*/
    .mainvisual {
        position: relative;
    }

    /* 背景画像 ---------------------------------------*/
    .toppage .mainvisual .img img {
        width: 100%;
        height: 100vh;
        object-fit: cover;
        object-position: center;
        vertical-align: bottom;
    }

    /* キャッチコピー ------------------------------------*/
    .toppage .mainvisual .catchcopy1 {
        position: absolute;
        top: 40%;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        white-space: nowrap;
        text-align: center;
    }

    .toppage .mainvisual .catchcopy1 h1 {
        color: #fff;
        font-size: 4.5rem;
        animation-name: fadeLeftAnime;
        animation-duration: 1.5s;
        animation-fill-mode: forwards;
        animation-delay: 0.5s;
        opacity: 0;
    }

    @keyframes fadeLeftAnime{
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
        }
    }

    .toppage .mainvisual .catchcopy1 h2 {
        color: #fff;
        font-size: 2.3rem;
        font-weight: normal;
        animation-name: fadeLeftAnime;
        animation-duration: 1.5s;
        animation-fill-mode: forwards;
        animation-delay: 1s;
        opacity: 0;
    }

    @keyframes fadeLeftAnime{
        from {
            opacity: 0;
        }
        
        to {
            opacity: 1;
        }
    }

    /* 会員登録ボタン ------------------------------------*/
    .toppage .mainvisual .entry_btn a img {
        position: absolute;
        width: 25%;
        top: 57%;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        animation-name: fadeLeftAnime;
        animation-duration: 1.5s;
        animation-fill-mode: forwards;
        animation-delay: 1.5s;
        opacity: 0;
    }

    @keyframes fadeLeftAnime{
        from {
            opacity: 0;
        }
        
        to {
            opacity: 1;
        }
    }

    /* スクロールダウン -----------------------------------*/
    .toppage .scrolldown {
        position: absolute;
        left: 50%;
        bottom: 10px;
        height: 50px;
    }

    .toppage .scrolldown span {
        position: absolute;
        font-size: 1.6rem;
        color: #fff;
        top: -35px;
        left: -35px;
        letter-spacing: 0.05em;
    }

    .toppage .scrolldown::after {
        content: "";
        position: absolute;
        top: 0;
        width: 1px;
        height: 35px;
        background: #fff;
        animation: pathmove 1.4s ease-in-out infinite;
        opacity: 0;
    }

    @keyframes pathmove{
        0%{
        height: 0;
        top: -15px;
        opacity: 0;
        }
        30%{
        height: 35px;
        opacity: 1;
        }
        100%{
        height: 0;
        top: 60px;
        opacity: 0;
        }
    }

    /* キャンペーン ---------------------------------------------------------------------------------------*/
    .campaign {
        color: #D47803;
        font-size: 2.5rem;
        font-weight: bolder;
        line-height: 35px;
        text-align: center;
        width: 80%;
        margin: 7% 10% 0% 10%;
    }

    /* キャッチコピー --------------------------------------------------------------------------------------*/
    .catchcopy2 {
        font-weight: bolder;
        text-align: center;
        font-size: 2rem;
        line-height: 30px;
        width: 80%;
        margin: 5% 10% 0% 10%;
    }

    /* 他社との比較メリット -----------------------------------------------------------------------------------*/
    /* メインタイトル ------------------------------------*/
    .merit .maintitle {
        text-align: center;
    }
    
    .merit .maintitle h1 {
        position: relative;
        display: inline-block;
        color: #D47803;
        font-size: 2.2rem;
        margin: 10% 0% 0% 0%;
    }
    
    .merit .maintitle h1:before {
        content: '';
        position: absolute;
        bottom: -15px;
        display: inline-block;
        width: 70px;
        height: 2.5px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        background-color: #D47803;
        border-radius: 2px;
    }

    /* テキスト ---------------------------------------*/
    .merit .text {
        width: 80%;
        margin: 5% 10% 0% 10%;
    }

    /* チェック項目 --------------------------------------*/
    .merit .checkmark_content {
        width: 60%;
        margin: 5% 20% 0% 20%;
    }

    .merit .checkmark_content .checkmark {
        display: flex;
        margin-top: 2%;
    }

    .merit .checkmark_content .checkmark img {
        width: 25px;
        height: 25px;
        vertical-align: bottom;
    }

    .merit .checkmark_content .checkmark p {
        margin: 0% 0% 0% 2%;
    }

    /* NEWS -----------------------------------------------------------------------------------------*/
    .toppage .news {
        margin: 0;
    }
    
    /* メインタイトル ------------------------------------*/
    .toppage .news .maintitle h1 {
        color: #fff;
        font-size: 2.2rem;
        font-weight: bolder;
        text-align: center;
        padding: 2.5% 0%;
        background-color: #D47803;
        margin: 10% 0% 0% 0%;
    }

    /* コンテンツ --------------------------------------*/
    .toppage .news .whatsnew h1 {
        display: none;
    }

    .toppage .news .whatsnew {
        width: 80%;
        margin: 5% 10% 0% 10%;
    }

    .toppage .news .whatsnew dt , dd {
        color: #404040;
    }

    .toppage .news .whatsnew .newmark {
        font-size: 1.4rem;
        background-color: #D47803;
    }

    /* MOREボタン ------------------------------------*/
    .toppage .news img {
        width: 25%;
        margin: 3% 37.5% 0% 37.5%;
        vertical-align: bottom;
    }

    /* PLAN -----------------------------------------------------------------------------------------*/
    /* メインタイトル ------------------------------------*/
    .toppage .plan .maintitle h1 {
        color: #fff;
        font-size: 2.2rem;
        font-weight: bolder;
        text-align: center;
        padding: 2.5% 0%;
        background-color: #D47803;
        margin: 10% 0% 0% 0%;
    }

    /* コンテンツ --------------------------------------*/
    .toppage .plan .content {
        text-align: center;
        width: 80%;
        margin: 5% 10% 0% 10%;
    }

    .toppage .plan .content .title {
        color: #D47803;
        font-weight: bold;
        margin: 5% 0% 0% 0%;
    }

    .toppage .plan .content .sentence {
        margin: 2% 0% 0% 0%;
    }

    .toppage .plan .content .last_sentence {
        color: #D47803;
        margin-top: 5%;
    }

    /* ACCESS ---------------------------------------------------------------------------------------*/
    /* メインタイトル ------------------------------------*/
    .toppage .access .maintitle h1 {
        color: #fff;
        font-size: 2.2rem;
        font-weight: bolder;
        text-align: center;
        padding: 2.5% 0%;
        background-color: #D47803;
        margin: 10% 0% 0% 0%;
    }

























    /* NEWSページ --------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    .news {
        margin: 15% 0% 0% 0%;
    }
    
    /* ページタイトル ------------------------------------*/
    .news .page_title {
        color: #fff;
        font-size: 2.2rem;
        font-weight: bolder;
        text-align: center;
        padding: 2.5% 0%;
        background-color: #D47803;
    }
    
    /* コンテンツ --------------------------------------*/
    .news .article {
        list-style: none;
        padding: 0;
    }
    
    /* タイトル */
    .news .article .title {
        font-size: 2rem;
        font-weight: bold;
        width: 80%;
        margin: 7% 10% 0% 10%;
        padding: 7% 0% 0% 0%;
        border-top: 2px solid #D47803;
    }
    
    /* 日付 */
    .news .article .date {
        margin: 1% 0% 0% 10%;
    }
    
    /* 本文（画像）*/
    .news .article img {
        width: 40%;
        margin: 1% 0% 0% 10%;
        vertical-align: bottom;
    }
    
    /* 本文（テキスト）*/
    .news .article p {
        width: 80%;
        margin: 1% 10% 2% 10%;
    }
    
    /* 本文（続きを見る）*/
    .news .article .more-link {
        margin: 0% 0% 0% 10%;
    }
    
    /* ページネーション -----------------------------------*/
    .news .nav-links {
        text-align: center;
        margin: 10% 0% 0% 0%;
    }
    
    /* 記事詳細ページ ----------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    /* 記事 -----------------------------------------*/
    /* タイトル */
    .detail .title {
        font-size: 2rem;
        width: 80%;
        margin: 25% 10% 0% 10%;
    }
    
    /* 日付 */
    .detail .date {
        margin: 1% 0% 0% 10%;
    }
    
    /* 本文（テキスト）*/
    .detail .content p {
        width: 80%;
        margin: 1% 0% 0% 10%;
    }
    
    .detail .content .has-text-align-left {
        width: 80%;
        margin: 1% 10% 0% 10%;
    }
    
    /* 本文（画像） */
    .detail .content img {
        width: 40%;
        margin: 1% 0% 0% 10%;
        vertical-align: bottom;
    }
    
    /* ページナビゲーション ---------------------------------*/
    .detail .page_nav {
        margin: 10% 0% 0% 10%;
    }
    
    /* 記事一覧に戻る ------------------------------------*/
    .detail .link a {
        display: block;
        text-align: right;
        margin: 0% 10% 0% 0%;
    }  

    /* STAFFページ -------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    .staff {
        margin: 15% 0% 0% 0%;
    }
    
    /* ページタイトル ------------------------------------*/
    .staff .page_title {
        color: #fff;
        font-size: 2.2rem;
        font-weight: bolder;
        text-align: center;
        padding: 2.5% 0%;
        background-color: #D47803;
    }
    
    /* コンテンツ --------------------------------------*/
    .staff .content {
        width: 70%;
        margin: 0% 15% 0% 15%;
    }

    .staff .content .item {
        display: flex;
        flex-direction: row;
        gap: 30px;
    }

    .staff .content .item .img img {
        width: 150px;
        height: 200px;
        margin: 15% 0% 0% 0%;
        vertical-align: bottom;
        flex-shrink: 0;
    }
    
    .staff .content .item .text .name {
        font-size: 2rem;
        font-weight: bold;
        margin: 10% 0% 0% 0%;
        padding-bottom: 2%; 
        border-bottom: 2px solid #D47803;
    }

    .staff .content .item .text .sentence {
        margin: 2% 0% 0% 0%;
    }

    /* RECRUITページ -----------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    .recruit {
        margin: 15% 0% 0% 0%;
    }
    
    /* ページタイトル ------------------------------------*/
    .recruit .page_title {
        color: #fff;
        font-size: 2.2rem;
        font-weight: bolder;
        text-align: center;
        padding: 2.5% 0%;
        background-color: #D47803;
    }
    
    /* コンテンツ --------------------------------------*/





























    /* Q&Aページ ---------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    .qa {
        margin: 15% 0% 0% 0%;
    }
    
    /* ページタイトル ------------------------------------*/
    .qa .page_title {
        color: #fff;
        font-size: 2.2rem;
        font-weight: bolder;
        text-align: center;
        padding: 2.5% 0%;
        background-color: #D47803;
    }
    
    /* コンテンツ --------------------------------------*/
    .qa .content ul {
        list-style: none;
        width: 70%;
        margin: 7% 15% 0% 15%;
        padding: 0;
    }

    .qa .content ul .q {
        font-size: 2rem;
        color: #D47803;
        font-weight: bold;
        line-height: 23px;
        background: url(images/qa.png) left 0px top 0px no-repeat;
        background-size: 20px auto;
        border-bottom: 2px solid #D47803;
        padding: 0% 0% 2% 5%;
    }

    .qa .content ul .a {
        margin: 2% 0% 10% 0%;
    }

    /* CONTACTページ -----------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    .contact {
        margin: 15% 0% 0% 0%;
    }
    
    /* ページタイトル ------------------------------------*/
    .contact .page_title {
        color: #fff;
        font-size: 2.2rem;
        font-weight: bolder;
        text-align: center;
        padding: 2.5% 0%;
        background-color: #D47803;
    }
    
    /* コンテンツ --------------------------------------*/
    .wpcf7 {
        width: 50%;
        margin: 7% 25% 0% 25%;
    }

    /* 必須 */
    .required {
        color: #fff;
        font-size: 1.6rem;
        background-color: #D47803;
        padding: 0.5% 1.5%;
        border-radius: 5px;
    }

    /* 入力欄 */
    input, textarea {
        width: 100%;
        margin: 1% 0% 0% 0%;
        color: #fff;
        border: 2px solid #D47803;
        border-radius: 5px;
    }

    /* 送信ボタン */
    .wpcf7 .wpcf7-submit {
        width: 40%;
        margin: 3% 30% 0% 30%;
        padding: 5% 5%;
        color: #fff;
        font-weight: normal;
        background-color: #D47803;
        border: none;
        font-weight: normal;
    }

    /* フッター ----------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    footer {
        margin: 15% 0% 0% 0%;
        color: #fff;
        background-color: #D47803;
    }

    /* ロゴ（画像）--------------------------------------*/
    footer .footer_logo img {
        width: 15%;
        margin: 3% 0% 0% 10%;
    }

    /* テキスト1 --------------------------------------*/
    footer .footer_text1 {
        font-size: 2rem;
        font-weight: bold;
        width: 80%;
        margin: 2% 10% 0% 10%;
    }

    /* テキスト2 --------------------------------------*/
    footer .footer_text2 {
        width: 80%;
        margin: 2% 10% 0% 10%;
    }

    /* テキスト3 --------------------------------------*/
    footer .footer_text3 {
        width: 80%;
        margin: 1% 10% 0% 10%;
    }

    /* フッターメニュー -----------------------------------*/
    footer .footer_menu ul {
        list-style: none;
        line-height: 32px;
        margin: -30% 0% 0% 75%;
        padding: 0;
    }

    footer .footer_menu ul li a {
        color: #fff;
        margin: 0;
        padding: 0;
    }

    footer .footer_menu ul li a:hover {
        color: #8caf97;
    }

    /* コピーライト -------------------------------------*/
    footer #copyright {
        font-size: 1.6rem;
        text-align: right;
        margin: 7% 0% 0% 0%;
        padding: 0% 1% 1% 0%;
    }

    /* 404ページ ---------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    /* タイトル ---------------------------------------*/
    .errorpage .errorpage_title {
        font-size: 3.5rem;
        font-weight: bold;
        text-align: center;
        margin: 45% 0% 0% 0%;
    }

    /* テキスト ---------------------------------------*/
    .errorpage .errorpage_text {
        width: 80%;
        margin: 3% 10% 0% 10%;
        text-align: center;
    }

    /* トップページに戻る ----------------------------------*/
    .errorpage .link a {
        display: inline-block;
        color: #fff;
        background: #D47803;
        border-radius: 60px;
        cursor: pointer;
        text-align: center;
        text-decoration: none;
        width: 35%;
        margin: 3% 32.5% 70% 32.5%;
        padding: 2.5% 0%;
    }
}

/* PC用 -------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 1024px) {

    /* ベース ------------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    html {
        font-size: 62.5%;
        overflow: auto;
    }
    
    body {
        font-size: 1.8rem;
        line-height: 22px;
        font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
        color: #0A0A0A;
        background-color: #fff;
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        overflow: hidden;
    }

    a {
        color: #000;
    }

    a:hover {
        color: #616161;
    }

    /* ヘッダー ----------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    header {
        display: flex;
        align-items: center;
        background: -moz-linear-gradient(top, #0000009f, #FFF);
        background: -webkit-linear-gradient(top, #0000009f, rgba(255, 255, 255, 0));
        background: linear-gradient(to bottom, #0000009f, rgba(255, 255, 255, 0));
    }

    /* ロゴ -----------------------------------------*/
    header .header_logo {
        padding-left: 0;
        padding: 0 30px;
    }

    header .header_logo img {
        width: 15%;
        vertical-align: bottom;
    }

    /* ハンバーガーメニュー ---------------------------------*/
    .h-menu {
        display: none;
    }

    /* ヘッダーメニュー -----------------------------------*/
    header .header_menu {
        margin-left: auto;
    }

    header .header_menu ul {
        display: flex;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    header .header_menu ul li a {
        font-size: 1.6rem;
        color: #fff;
        text-decoration: none;
        padding: 0 30px;
    }

    header .header_menu ul li a:hover {
        color: #616161;
    }

    /* TOP --------------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    /* メインビジュアル -----------------------------------------------------------------------------------*/
    .mainvisual {
        position: relative;
    }

    /* 背景画像 ---------------------------------------*/
    .toppage .mainvisual .img img {
        width: 100%;
        height: 100vh;
        object-fit: cover;
        object-position: center;
        vertical-align: bottom;
    }

    /* キャッチコピー ------------------------------------*/
    .toppage .mainvisual .catchcopy1 {
        position: absolute;
        top: 40%;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        white-space: nowrap;
        text-align: center;
    }

    .toppage .mainvisual .catchcopy1 h1 {
        color: #fff;
        font-size: 4rem;
        animation-name: fadeLeftAnime;
        animation-duration: 1.5s;
        animation-fill-mode: forwards;
        animation-delay: 0.5s;
        opacity: 0;
    }

    @keyframes fadeLeftAnime{
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
        }
    }

    .toppage .mainvisual .catchcopy1 h2 {
        color: #fff;
        font-size: 1.8rem;
        font-weight: normal;
        animation-name: fadeLeftAnime;
        animation-duration: 1.5s;
        animation-fill-mode: forwards;
        animation-delay: 1s;
        opacity: 0;
    }

    @keyframes fadeLeftAnime{
        from {
            opacity: 0;
        }
        
        to {
            opacity: 1;
        }
    }

    /* 会員登録ボタン ------------------------------------*/
    .toppage .mainvisual .entry_btn a img {
        position: absolute;
        width: 12%;
        top: 58%;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        animation-name: fadeLeftAnime;
        animation-duration: 1.5s;
        animation-fill-mode: forwards;
        animation-delay: 1.5s;
        opacity: 0;
    }

    @keyframes fadeLeftAnime{
        from {
            opacity: 0;
        }
        
        to {
            opacity: 1;
        }
    }

    /* スクロールダウン -----------------------------------*/
    .toppage .scrolldown {
        position: absolute;
        left: 50%;
        bottom: 10px;
        height: 50px;
    }

    .toppage .scrolldown span {
        position: absolute;
        font-size: 1.4rem;
        color: #fff;
        top: -30px;
        left: -30px;
        letter-spacing: 0.05em;
    }

    .toppage .scrolldown::after {
        content: "";
        position: absolute;
        top: 0;
        width: 1px;
        height: 35px;
        background: #fff;
        animation: pathmove 1.4s ease-in-out infinite;
        opacity: 0;
    }

    @keyframes pathmove{
        0%{
        height: 0;
        top: -15px;
        opacity: 0;
        }
        30%{
        height: 35px;
        opacity: 1;
        }
        100%{
        height: 0;
        top: 60px;
        opacity: 0;
        }
    }

    /* キャンペーン ---------------------------------------------------------------------------------------*/
    .campaign {
        color: #D47803;
        font-size: 2.3rem;
        font-weight: bolder;
        line-height: 35px;
        text-align: center;
        width: 90%;
        margin: 5% 5% 0% 5%;
    }

    /* キャッチコピー --------------------------------------------------------------------------------------*/
    .catchcopy2 {
        font-weight: bolder;
        text-align: center;
        font-size: 2rem;
        line-height: 32px;
        width: 80%;
        margin: 5% 10% 0% 10%;
    }

    /* 他社との比較メリット -----------------------------------------------------------------------------------*/
    /* メインタイトル ------------------------------------*/
    .merit .maintitle {
        text-align: center;
    }
    
    .merit .maintitle h1 {
        position: relative;
        display: inline-block;
        color: #D47803;
        font-size: 2.5rem;
        margin: 5% 0% 0% 0%;
    }
    
    .merit .maintitle h1:before {
        content: '';
        position: absolute;
        bottom: -20px;
        display: inline-block;
        width: 70px;
        height: 2.5px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        background-color: #D47803;
        border-radius: 2px;
    }

    /* テキスト ---------------------------------------*/
    .merit .text {
        width: 70%;
        margin: 5% 15% 0% 15%;
    }

    /* チェック項目 --------------------------------------*/
    .merit .checkmark_content {
        width: 50%;
        margin: 3% 25% 0% 25%;
    }

    .merit .checkmark_content .checkmark {
        display: flex;
        margin-top: 2%;
    }

    .merit .checkmark_content .checkmark img {
        width: 25px;
        height: 25px;
        vertical-align: bottom;
    }

    .merit .checkmark_content .checkmark p {
        margin: 0% 0% 0% 2%;
    }

    /* NEWS -----------------------------------------------------------------------------------------*/
    .toppage .news {
        margin: 0;
    }
    
    /* メインタイトル ------------------------------------*/
    .toppage .news .maintitle h1 {
        color: #fff;
        font-size: 2.5rem;
        font-weight: bolder;
        text-align: center;
        padding: 2% 0%;
        background-color: #D47803;
        margin: 5% 0% 0% 0%;
    }

    /* コンテンツ --------------------------------------*/
    .toppage .news .whatsnew h1 {
        display: none;
    }

    .toppage .news .whatsnew {
        width: 70%;
        margin: 3% 15% 0% 15%;
    }

    .toppage .news .whatsnew dt , dd {
        color: #404040;
    }

    .toppage .news .whatsnew .newmark {
        font-size: 1.4rem;
        background-color: #D47803;
    }

    /* MOREボタン ------------------------------------*/
    .toppage .news img {
        width: 15%;
        margin: 3% 42.5% 0% 42.5%;
        vertical-align: bottom;
    }

    /* PLAN -----------------------------------------------------------------------------------------*/
    /* メインタイトル ------------------------------------*/
    .toppage .plan .maintitle h1 {
        color: #fff;
        font-size: 2.5rem;
        font-weight: bolder;
        text-align: center;
        padding: 2% 0%;
        background-color: #D47803;
        margin: 5% 0% 0% 0%;
    }

    /* コンテンツ --------------------------------------*/
    .toppage .plan .content {
        text-align: center;
        width: 70%;
        margin: 3% 15% 0% 15%;
    }

    .toppage .plan .content .title {
        color: #D47803;
        font-weight: bold;
        margin: 5% 0% 0% 0%;
    }

    .toppage .plan .content .sentence {
        margin: 1% 0% 0% 0%;
    }

    .toppage .plan .content .last_sentence {
        color: #D47803;
        margin-top: 5%;
    }

    /* ACCESS ---------------------------------------------------------------------------------------*/
    /* メインタイトル ------------------------------------*/
    .toppage .access .maintitle h1 {
        color: #fff;
        font-size: 2.5rem;
        font-weight: bolder;
        text-align: center;
        padding: 2% 0%;
        background-color: #D47803;
        margin: 5% 0% 0% 0%;
    }

























    /* NEWSページ --------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    .news {
        margin: 10% 0% 0% 0%;
    }
    
    /* ページタイトル ------------------------------------*/
    .news .page_title {
        color: #fff;
        font-size: 2.5rem;
        font-weight: bolder;
        text-align: center;
        padding: 2% 0%;
        background-color: #D47803;
    }
    
    /* コンテンツ --------------------------------------*/
    .news .article {
        list-style: none;
        padding: 0;
    }
    
    /* タイトル */
    .news .article .title {
        font-size: 2.2rem;
        font-weight: bold;
        width: 70%;
        margin: 5% 15% 0% 15%;
        padding: 5% 0% 0% 0%;
        border-top: 2px solid #D47803;
    }
    
    /* 日付 */
    .news .article .date {
        margin: 1% 0% 0% 15%;
    }
    
    /* 本文（画像）*/
    .news .article img {
        width: 20%;
        margin: 1% 0% 0% 15%;
        vertical-align: bottom;
    }
    
    /* 本文（テキスト）*/
    .news .article p {
        width: 70%;
        margin: 1% 15% 2% 15%;
    }
    
    /* 本文（続きを見る）*/
    .news .article .more-link {
        margin: 0% 0% 0% 15%;
    }
    
    /* ページネーション -----------------------------------*/
    .news .nav-links {
        text-align: center;
        margin: 7% 0% 0% 0%;
    }
    
    /* 記事詳細ページ ----------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    /* 記事 -----------------------------------------*/
    /* タイトル */
    .detail .title {
        font-size: 2.2rem;
        width: 70%;
        margin: 15% 15% 0% 15%;
    }
    
    /* 日付 */
    .detail .date {
        margin: 1% 0% 0% 15%;
    }
    
    /* 本文（テキスト）*/
    .detail .content p {
        width: 70%;
        margin: 1% 15% 0% 15%;
    }
    
    .detail .content .has-text-align-left {
        width: 70%;
        margin: 1% 0% 0% 15%;
    }
    
    /* 本文（画像） */
    .detail .content img {
        width: 20%;
        margin: 1% 0% 0% 15%;
        vertical-align: bottom;
    }
    
    /* ページナビゲーション ---------------------------------*/
    .detail .page_nav {
        margin: 7% 0% 0% 15%;
    }
    
    /* 記事一覧に戻る ------------------------------------*/
    .detail .link a {
        display: block;
        text-align: right;
        margin: 0% 15% 0% 0%;
    }  

    /* STAFFページ -------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    .staff {
        margin: 10% 0% 0% 0%;
    }
    
    /* ページタイトル ------------------------------------*/
    .staff .page_title {
        color: #fff;
        font-size: 2.5rem;
        font-weight: bolder;
        text-align: center;
        padding: 2% 0%;
        background-color: #D47803;
    }
    
    /* コンテンツ --------------------------------------*/
    .staff .content {
        width: 70%;
        margin: 0% 15% 0% 15%;
    }

    .staff .content .item {
        display: flex;
        flex-direction: row;
        gap: 30px;
    }

    .staff .content .item .img img {
        width: 170px;
        height: 200px;
        margin: 20% 0% 0% 0%;
        vertical-align: bottom;
        flex-shrink: 0;
    }
    
    .staff .content .item .text .name {
        font-size: 2rem;
        font-weight: bold;
        margin: 10% 0% 0% 0%;
        padding-bottom: 1.5%; 
        border-bottom: 2px solid #D47803;
    }

    .staff .content .item .text .sentence {
        margin: 1.5% 0% 0% 0%;
    }

    /* RECRUITページ -----------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    .recruit {
        margin: 10% 0% 0% 0%;
    }
    
    /* ページタイトル ------------------------------------*/
    .recruit .page_title {
        color: #fff;
        font-size: 2.5rem;
        font-weight: bolder;
        text-align: center;
        padding: 2% 0%;
        background-color: #D47803;
    }
    
    /* コンテンツ --------------------------------------*/





























    /* Q&Aページ ---------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    .qa {
        margin: 10% 0% 0% 0%;
    }
    
    /* ページタイトル ------------------------------------*/
    .qa .page_title {
        color: #fff;
        font-size: 2.5rem;
        font-weight: bolder;
        text-align: center;
        padding: 2% 0%;
        background-color: #D47803;
    }
    
    /* コンテンツ --------------------------------------*/
    .qa .content ul {
        list-style: none;
        width: 70%;
        margin: 7% 15% 0% 15%;
        padding: 0;
    }

    .qa .content ul .q {
        font-size: 2rem;
        color: #D47803;
        font-weight: bold;
        line-height: 23px;
        background: url(images/qa.png) left 0px top 0px no-repeat;
        background-size: 20px auto;
        border-bottom: 2px solid #D47803;
        padding: 0% 0% 1.5% 5%;
    }

    .qa .content ul .a {
        margin: 1.5% 0% 7% 0%;
    }

    /* CONTACTページ -----------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    .contact {
        margin: 10% 0% 0% 0%;
    }
    
    /* ページタイトル ------------------------------------*/
    .contact .page_title {
        color: #fff;
        font-size: 2.5rem;
        font-weight: bolder;
        text-align: center;
        padding: 2% 0%;
        background-color: #D47803;
    }
    
    /* コンテンツ --------------------------------------*/
    .wpcf7 {
        width: 40%;
        margin: 5% 30% 0% 30%;
    }

    /* 必須 */
    .required {
        color: #fff;
        font-size: 1.6rem;
        background-color: #D47803;
        padding: 0.5% 1.5%;
        border-radius: 5px;
    }

    /* 入力欄 */
    input, textarea {
        width: 100%;
        margin: 1% 0% 0% 0%;
        color: #fff;
        border: 2px solid #D47803;
        border-radius: 5px;
    }

    /* 送信ボタン */
    .wpcf7 .wpcf7-submit {
        width: 35%;
        margin: 3% 32.5% 0% 32.5%;
        padding: 5% 5%;
        color: #fff;
        font-weight: normal;
        background-color: #D47803;
        border: none;
        font-weight: normal;
    }

    /* フッター ----------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    footer {
        margin: 10% 0% 0% 0%;
        color: #fff;
        background-color: #D47803;
    }

    /* ロゴ（画像）--------------------------------------*/
    footer .footer_logo img {
        width: 10%;
        margin: 2% 0% 0% 15%;
    }

    /* テキスト1 --------------------------------------*/
    footer .footer_text1 {
        font-size: 2.2rem;
        font-weight: bold;
        width: 70%;
        margin: 1% 15% 0% 15%;
    }

    /* テキスト2 --------------------------------------*/
    footer .footer_text2 {
        width: 70%;
        margin: 1% 15% 0% 15%;
    }

    /* テキスト3 --------------------------------------*/
    footer .footer_text3 {
        width: 70%;
        margin: 0.5% 15% 0% 15%;
    }

    /* フッターメニュー -----------------------------------*/
    footer .footer_menu ul {
        list-style: none;
        line-height: 32px;
        margin: -17% 0% 0% 75%;
        padding: 0;
    }

    footer .footer_menu ul li a {
        color: #fff;
        margin: 0;
        padding: 0;
    }

    footer .footer_menu ul li a:hover {
        color: #8caf97;
    }

    /* コピーライト -------------------------------------*/
    footer #copyright {
        font-size: 1.6rem;
        text-align: right;
        margin: 5% 0% 0% 0%;
        padding: 0% 0.5% 0.5% 0%;
    }

    /* 404ページ ---------------------------------------------------------------------------------------
    -------------------------------------------------------------------------------------------------*/
    /* タイトル ---------------------------------------*/
    .errorpage .errorpage_title {
        font-size: 3.5rem;
        font-weight: bold;
        text-align: center;
        margin: 20% 0% 0% 0%;
    }

    /* テキスト ---------------------------------------*/
    .errorpage .errorpage_text {
        width: 80%;
        margin: 2% 10% 0% 10%;
        text-align: center;
    }

    /* トップページに戻る ----------------------------------*/
    .errorpage .link a {
        display: inline-block;
        color: #fff;
        background: #D47803;
        border-radius: 60px;
        cursor: pointer;
        text-align: center;
        text-decoration: none;
        width: 20%;
        margin: 2% 40% 50% 40%;
        padding: 1% 0%;
    }
}