@charset "UTF-8";

@media screen and (max-width: 480px) {

  /*
INDEX
----- 01. GLOBAL
----- 02. HEADER
----- 03. FO0TER
----- 04. TOP PAGE
----- 05. OUTLINE
----- 08. page-intro
----- 09. page-about
----- 10. page-contact
----- 11. page-contact-form
----- 12. LIST
----- 13.　SUPPORT
----- 28.　PAJER
----- 
----- 





*/
  .sp-none {
    display: none;
  }

  main {
    text-align: center;
  }

  main p,
  main dd {
    width: 80%;
    font-size: 14px;
    text-align: left;
    margin-bottom: 30px;
    margin-left: auto;
    margin-right: auto;
    display: inline-block;
    box-sizing: border-box;
  }

  main dt {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 20px;
  }

  main dd {
    line-height: 7.5vw;
    margin-bottom: 30px;
  }

  #second-level h2 {
    display: inline-block;
    padding: 10px 30px;
    background: url("../img/bg_page_h2_title.png");
    border-radius: 20px;
    font-size: 20px;
    font-weight: bold;
    margin: 60px auto 80px;
  }

  h3 {
    width: 80%;
    font-size: 5vw;
    font-weight: bold;
    text-align: center;
    margin: 20px auto 10px;
  }

  h4 {
    width: 80%;
    font-size: 4.6vw;
    font-weight: bold;
    text-align: center;
    margin: 0px auto;
  }

  h5 {
    width: 80%;
    font-size: 4vw;
    font-weight: bold;
    text-align: left;
    margin: 0px auto;
  }

  hr {
    margin: 50px auto 100px;
    width: 85%;
  }

  .annotation {
    font-size: 3.5vw;
    line-height: 7vw;
    padding-bottom: 10px;
  }

  .margin-bottom-lll {
    margin-bottom: 100px;
  }

  .margin-bottom-ll {
    margin-bottom: 75px;
  }

  .margin-bottom-l {
    margin-bottom: 50px;
  }

  .margin-bottom-mm {
    margin-bottom: 40px;
  }

  .padding-bottom-l {
    padding-bottom: 50px;
  }

  table {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    background-color: #ebebeb;
    border-collapse: collapse;
  }

  .btn-common--center {
    text-align: center;
  }

  .btn-common {
    width: 60%;
    background-color: #42200a;
    color: #FFFFFF;
    border-radius: 100vh;
    display: inline-block;
    margin-bottom: 30px;
  }

  .btn-common a {
    color: #FFFFFF;
  }



  /* ------------------------------------------------------------
01. GLOBAL
------------------------------------------------------------ */
  main section {
    text-align: center;
    /*  margin: 30px 0;
  width: 100%;
  text-align: left;*/
  }

  #banner-support img {
    width: 90%;
  }

  .top__title {
    width: 80%;
  }

  /* ------------------------------------------------------------
02. HEADER
------------------------------------------------------------ */
  /* ------------------------------------------------------------
02. #HEADER
------------------------------------------------------------ */
  header {
    width: 100%;
  }

  header .header__inner {
    width: 100%;
  }

  .header__left {}

  .header__right {}

  .header__sns {
    display: inline-block;
    width: 76%;
    text-align: center;
  }

  .header__sns ul {
    width: 100%;
    vertical-align: bottom;
  }

  .header__left img {
    width: 100%;
    vertical-align: top;
  }

  .header__sns ul li {
    display: inline-block;
    font-size: 8vw;
  }

  .header__sns ul li:nth-child(2) {
    margin: 0 10px;
  }

  .header__menu {
    display: inline-block;
    width: 20%;
    text-align: left;
    vertical-align: middle;
  }

  .header__menu img {
    width: 90%;
  }

  /* ------------------------------------------------------------
03. FO0TER
------------------------------------------------------------ */
  footer {
    width: 100%;
    background: url("../img/common/bg_top.jpg");
  }

  .footer__sns {
    text-align: center;
    width: 100%;
  }

  .footer__sns ul {
    width: 100%;
    margin: 50px auto 30px;
  }

  .footer__sns ul li {
    margin: 0px;
    display: inline-block;
    box-sizing: border-box;
    font-size: 10vw;
  }

  .footer__sns ul li:nth-child(2) {
    padding: 0 15px;
  }

  .footer__sns p {
    font-size: 5vw;
    text-align: center;
  }

  .footer__sponsors {
    margin: 20px 0;
    width: 100%;
    text-align: center;
  }

  .footer__sponsors h2 {
    width: 100%;
  }

  .footer__sponsors h2 img {
    width: 40%;
  }

  .footer__sponsors ul {
    width: 90%;
    margin: 0px auto;
  }

  .footer__sponsors li {
    margin-top: 20px;
    display: inline-block;
    width: 45%;
  }

  .footer__sponsors li img {
    width: 100%;
  }

  footer .inner {
    width: 100%;
    background: no-repeat url("../img/common/bg_footer_under.png");
    background-size: contain;
  }

  address {
    width: 100%;
    font-size: 4vw;
    margin: 30px 0 20px;
    font-style: normal;
  }

  address span {
    font-size: 3.5vw;
  }

  .footer__inner {
    text-align: center;
    width: 100%;
    padding-top: 150px;
  }

  .footer__sitemap-btn {
    width: 50%;
    background-color: #42200a;
    color: #FFFFFF;
    border-radius: 100vh;
    display: inline-block;
  }

  .footer__copyright {
    width: 100vw;
    text-align: center;
    font-size: 3.5vw;
    padding: 30px 0;
  }

  /* ------------------------------------------------------------
04. TOP PAGE
------------------------------------------------------------ */
  body {
    /*
    overflow-y: scroll;*/
  }

  .slide-img {
    width: 100%
  }

  .slick01 {
    width: 100%;
  }

  .slick01 img {
    width: 100%;
  }

  /* #NEWS AREA */
  #news-area {
    width: 100%;
    text-align: center;
    margin: 0;
    background: url("../img/common/bg_top.jpg")no-repeat;
    padding: 10px 0;
  }

  main .top__main-news {
    text-align: left;
    box-sizing: border-box;
    width: 95%;
    background-color: #FFFFFF;
    border-radius: 5px;
    border: solid 5px #754C24;
    margin: 20px auto;
    padding: 5px 5px;
  }

  #news-title {
    box-sizing: border-box;
    width: 100%;
    margin: 10px 5px;
    text-align: center;
  }

  #news-title h2 img {
    width: 60%;
  }

  .news-list {
    width: 100%;
  }

  .news-list dl {
    width: 100%;
  }

  .news-list dt::before {
    content: '●';
    color: #D65A24;
    font-size: 4vw;
  }

  .news-list dt {
    display: inline-block;
    box-sizing: border-box;
    margin: 0 0 15px 5px;
    font-size: 4vw;
    vertical-align: top;
    line-height: 6vw;
  }

  .news-list dd {
    display: inline-block;
    box-sizing: border-box;
    margin: 0 0 15px;
    font-size: 4vw;
    width: 70%;
    overflow-wrap: break-word;
    line-height: 6vw;
    vertical-align: top;
    text-align: left;
  }

  .more-news {
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    text-align: center;
    padding: 10px;
  }

  .more-news img {
    width: 50%;
  }

  /* .NEWS AREA */
  /* #TOP DONATE */
  .top__donate {
    width: 100%;
    position: relative;
    background: url("../img/common/bg_top.jpg");
  }

  .top__donate-img {
    width: 100%;
    background: url("../img/common/bg_top.jpg");
  }

  .top__donate-img img {
    width: 100vw;
    height: 90vh;
    object-fit: cover;
    object-position: 70% 50%;
  }

  .top__donate h2 {
    position: absolute;
    top: 2%;
    left: 5%;
    z-index: 50;
    text-align: left;
    font-size: 8vw;
    line-height: 11vw;
    color: #FFFFFF;
  }

  .top__donate h2 span {
    color: #ffff00;
  }

  .top__donate p {
    position: absolute;
    top: 20%;
    left: 5%;
    z-index: 50;
    text-align: left;
    font-size: 4.8vw;
    line-height: 6vw;
    color: #FFFFFF;
  }

  .top__donate-btn {
    position: absolute;
    bottom: 5%;
    left: 0%;
    right: 0%;
    text-align: center;
  }

  .top__donate-btn img {
    width: 70%;
    margin-top: 5px;
  }

  /* .TOP DONATE */
  /* #TOP PLAY WORKER */
  .top__playworker {
    width: 100%;
    position: relative;
    background: url("../img/common/bg_top.jpg");
  }

  .top__playworker-img {
    width: 100%;
  }

  .top__playworker-img img {
    width: 100vw;
    height: 90vh;
    object-fit: cover;
    object-position: 10% 50%;
  }

  .top__playworker h2 {
    position: absolute;
    top: 2%;
    right: 5%;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    z-index: 50;
    font-size: 8vw;
    line-height: 11vw;
    color: #FFFFFF;
    text-align: left;
  }

  .top__playworker h2 span {
    color: #ffff00;
  }

  .top__playworker p {
    position: absolute;
    top: 20%;
    left: 5%;
    z-index: 50;
    text-align: left;
    font-size: 4.8vw;
    line-height: 6vw;
    color: #FFFFFF;
  }

  .top__playworker-btn {
    position: absolute;
    bottom: 5%;
    left: 0%;
    right: 0%;
    text-align: center;
  }

  .top__playworker-btn img {
    width: 70%;
    margin-top: 5px;
  }

  /* #TOP PLAY WORKER */
  main .top__park-nav {
    width: 100%;
    text-align: center;
    padding: 40px 0px 20px;
  }

  main .top__park-nav h2 {
    width: 100%;
    margin-bottom: 20px;
    text-align: center;
  }

  main .top__park-nav li {
    display: inline-block;
    box-sizing: border-box;
    width: 45%;
    margin-bottom: 30px;
  }

  main .top__park-nav li img {
    width: 100%;
  }

  /* .TOP PLAY WORKER */
  .top__banner {
    width: 100%;
    padding: 10px 0px;
  }

  .top__banner img {
    width: 90%;
    text-align: center;
  }

  .top__topics-view {
    width: 100%;
    background: url("../img/common/bg_top.jpg");
    text-align: center;
    padding: 0px 10px;
    display: inline-block;
    box-sizing: border-box;
  }

  .top__topics-title {
    width: 80%;
    margin: 20px 0;
  }

  main .top__topics-view li {
    display: inline-block;
    box-sizing: border-box;
    width: 32%;
    margin-bottom: 20px;
  }

  .top__btn-topics {
    width: 100%;
  }

  /* #TOP BLOG  VIEW */
  #blog-view-list {
    background: url("../img/common/bg_top.jpg");
  }

  .top__blog-view-list {}

  #blog-view-list ul {
    list-style: none;
    text-align: center;
    margin: 0;
  }

  #blog-view-list li {
    display: inline-block;
    box-sizing: border-box;
    width: 95%;
    border: solid 2px #000000;
    text-align: left;
    margin-bottom: 15px;
    background-color: #FFFFFF;
    font-size: 4.6vw;

  }

  #blog-view-list li span {
    display: inline-block;
    box-sizing: border-box;
  }

  #blog-view-list li span.blog-card__thumb {
    width: 34%;
    padding: 8px 0px 8px 8px;
  }

  #blog-view-list li span.blog-card__txt {
    vertical-align: top;
    width: 64%;
    padding: 8px 8px 0px 8px;
  }

  #blog-view-list li span.blog-card__title {
    font-size: 4.5vw;
    font-weight: 600;
    width: 100%;
    padding-bottom: 5px;
    line-height: 6vw;
  }

  #blog-view-list li span.blog-card__read p {
    width: 100%;
    font-size: 3.5vw;
    line-height: 5vw;
    margin-bottom: 0;
  }

  #blog-view-list li span img {
    width: 100%;
    height: 100%;
  }

  /* .TOP BLOG  VIEW */
  /* #SORT BLOG  VIEW */
  #sort-blog-view-list {}

  #sort-blog-view-list ul {
    list-style: none;
    text-align: center;
    margin: 0;
  }

  #sort-blog-view-list li {
    display: inline-block;
    box-sizing: border-box;
    width: 95%;
    border: solid 2px #000000;
    text-align: left;
    margin-bottom: 15px;
    background-color: #FFFFFF;
  }

  #sort-blog-view-list li span {
    display: inline-block;
    box-sizing: border-box;
  }

  #sort-blog-view-list li span.blog-card__thumb {
    width: 34%;
    padding: 8px 0px 0px 8px;
  }

  #sort-blog-view-list li span.blog-card__txt {
    vertical-align: top;
    width: 64%;
    padding: 8px 8px 0px 8px;
  }

  #sort-blog-view-list li span.blog-card__title {
    font-size: 4.5vw;
    font-weight: 600;
    width: 100%;
    padding-bottom: 5px;
    line-height: 6vw;
  }

  #sort-blog-view-list li span.blog-card__read p {
    width: 100%;
    font-size: 3.5vw;
    line-height: 5vw;
  }

  #sort-blog-view-list li span img {
    width: 100%;
    height: 100%;
  }

  /* .TOP BLOG  VIEW */
  /* #TOP RECOMEND */
  .top__recomend {
    width: 100%;
    padding: 20px 0 10px;
    ;
    background: url("../img/common/bg_top.jpg");
  }

  .top__recomend h2 {
    width: 100%;
    text-align: center;
    margin-bottom: 10px;
  }

  .top__recomend-banner {
    width: 100%;
  }

  .top__recomend-banner div {
    width: 50%;
    padding-left: 15px;
    text-align: left;
  }

  .top__recomend-banner div img {
    width: 80%;
  }

  .top__recomend-donate img {
    width: 90%;
  }

  .recomend-btn {
    width: 60%;
  }

  /* .TOP RECOMEND */
  /* ------------------------------------------------------------
05. OUTLINE
------------------------------------------------------------ */
  main .outline {
    width: 100%;
    text-align: center;
    margin: 0;
  }

  .outline__title {
    width: 100%;
    text-align: center;
    background: url("../img/common/bg_top.jpg");
    margin-top: 20px;
  }

  .outline__title h2 img {
    width: 80%;
  }

  .outline__title h2 {
    display: inline-block;
    padding: 0px;
    background: none;
    border-radius: 0px;
    font-size: 0vw;
    margin: 30px auto 20px;
  }

  .outline__title-h3-a {
    text-align: center;
    width: 100%;
    padding: 10px 0 0px;
    background-color: #39984A;
    color: #FFFFFF;
  }

  .outline__title-h3-a h3 {
    font-size: 0vw;
    line-height: 0vw;
    width: 100%;
  }

  .outline__title-h3-a h3 img,
  .outline__title-h3-b h3 img,
  .outline__title-h3-c h3 img {
    width: 90%;
  }

  .outline__title-h3-b {
    text-align: center;
    width: 100%;
    background-color: #da801e;
  }

  .outline__title-h3-b h3 {
    margin: 0px auto;
    padding: 30px 0 20px;
  }

  .outline__title-h3-c {
    text-align: center;
    width: 100%;
    background-color: #39984a;
  }

  .outline__title-h3-c h3 {
    margin: 0 auto;
    padding: 30px 0 20px;
  }

  .outline__img {
    width: 100%;
  }

  .outline__img img {
    width: 100%;
  }

  .outline__btn-more {
    width: 100%;
    text-align: center;
  }

  .outline__btn-more img {
    width: 50%;
    margin: 30px 0;
  }

  .outline__next {
    background-color: #42200a;
    color: #FFFFFF;
    border-radius: 100vh;
    display: inline-block;
    padding: 5px 15px;
    font-size: 4.6vw;
    margin: 0 auto 50px;
  }

  .outline__next p {
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
    color: #FFFFFF;
  }

  .outline__next p::before {
    content: "次へ";
    margin-right: 5px;
  }

  .outline__next p::after {
    content: "▶︎";
    margin-left: 5px;
  }

  /* ------------------------------------------------------------
08. page-intro
------------------------------------------------------------ */
  #intro-h2 {
    padding: 20px 0 2;
    width: 100%;
  }

  #page-intro img {
    width: 85%;
  }

  #page-intro p {
    margin-top: 50px;
    margin-bottom: 50px;
  }

  .park-attention {
    font-size: 4vw;
    margin-bottom: 25px;
  }

  #park-nav li {
    width: 30%;
    display: inline-block;


  }

  #park-nav li img {
    width: 100%;
  }

  /* ------------------------------------------------------------
09. page-about
------------------------------------------------------------ */
  main #about-view {
    width: 80%;
    text-align: center;
    margin: 0 auto;
  }

  /*----*/
  #about-menu {
    width: 100%;
    text-align: center;
    margin-top: 20px;
  }

  #about-menu dl {
    width: 100%;
    border: solid 4px #42210B;
    display: inline-block;
    box-sizing: border-box;
    border-radius: 5px;
    background-color: #FAF8F0;
  }

  #about-menu dt {
    background-color: #FFFFFF;
    padding: 10px 0;
  }

  #about-menu dd {
    text-align: left;
    padding: 0 10px 10px;
    border-bottom: solid 2px #42210B;
  }

  /*----*/
  #about-tosaka {
    margin: 15px auto;
    text-align: center;
    width: 100%;
  }

  #about-chart {
    margin: 15px auto;
    text-align: center;
    width: 90%;
  }

  #about-tosaka img,
  #balance-sheet img,
  #about-chart img {
    width: 80%;
  }

  /*----*/
  #about-officer dl {
    width: 80%;
    margin: 0 auto;
  }

  #about-officer dt {
    width: 32%;
    display: inline-block;
    box-sizing: border-box;
    margin: 5px 0 5px 0;
    vertical-align: top;
    font-size: 4.6vw;
  }

  #about-officer dd {
    width: 60%;
    display: inline-block;
    box-sizing: border-box;
    margin: 5px 5px;
    vertical-align: top;
    font-size: 4.6vw;
  }

  #about-menu dd:last-child {
    border-bottom: none;
  }

  /*----*/
  /* ------------------------------------------------------------
10. page-contact
------------------------------------------------------------ */
  #contact-info img {
    width: 80%;
    margin: 15px 0;
  }

  .green-column {
    border: solid 4px #39B54A;
    display: inline-block;
    box-sizing: border-box;
    border-radius: 5px;
    color: #39B54A;
    padding: 5px;
    margin: 15px 0 50px;
  }

  /* ------------------------------------------------------------
11. page-contact-form
------------------------------------------------------------ */
  /* ------------------------------------------------------------
12. LIST
------------------------------------------------------------ */
  #category-news-list {
    width: 90%;
    text-align: center;
  }

  /* ------------------------------------------------------------
 13.　SUPPORT
------------------------------------------------------------ */
  #support-title h2 img {
    width: 15%;
  }

  #support-title h2 {
    line-height: 10vw;
  }

  #support-title h2 span {
    color: #da801e;
    font-size: 7vw;
  }

  #surport-main-img {
    width: 100%;
  }

  section[id*="support-select-"] {
    width: 100%;
  }

  section[id*="support-select-"] h3 {
    width: 100%;
    margin-bottom: 50px;
  }

  section[id*="support-select-"] img {
    width: 100%;
  }

  section[id*="support-select-"] p {
    margin-bottom: 50px;
  }

  section[id*="support-select-"] h4 {
    margin-bottom: 50px;
  }

  .support-btn {
    width: 80%;
    margin: 0 auto 50px;
  }

  #support-view table tr,
  caption {
    width: 100%;
  }

  #support-view caption span {
    font-size: 4vw;
  }

  #support-view table th,
  #support-view table td {
    width: 50%;
    font-size: 4vw;
    border: 1px solid #FFFFFF;
    padding: 5px 10px;
  }

  #support-view table td:nth-child(2) {
    text-align: right;
  }

  #support-view button {
    background-color: #FFFFFF;
    border: none;
    margin-top: 15px;
    width: 80%;
  }

  /*+++++++++++++++++++++++++*/
  /*タブ切り替え全体のスタイル*/
  .tabs1,
  .tabs2,
  .tabs3 {
    margin-top: 50px;
    padding-bottom: 40px;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    width: 90%;
    margin: 0 auto;
  }

  .tabs1 p,
  .tabs2 p,
  .tabs3 p {
    text-align: center;
    margin-bottom: 30px !important;
    font-weight: bold;
  }

  /*タブのスタイル*/
  .tab_item1,
  .tab_item2,
  .tab_item3 {
    width: calc(100%/2);
    height: 50px;
    border-bottom: 3px solid #5ab4bd;
    background-color: #d9d9d9;
    line-height: 50px;
    font-size: 16px;
    text-align: center;
    color: #565656;
    display: block;
    float: left;
    font-weight: bold;
    transition: all 0.2s ease;
  }

  .tab_item1:hover,
  .tab_item2:hover,
  .tab_item3:hover {
    opacity: 0.75;
  }

  /*ラジオボタンを全て消す*/
  input[name="tab_item1"],
  input[name="tab_item2"],
  input[name="tab_item3"] {
    display: none;
  }

  /*タブ切り替えの中身のスタイル*/
  .tab_content {
    display: none;
    padding: 40px 40px 0;
    clear: both;
    overflow: hidden;
  }

  /*選択されているタブのコンテンツのみを表示*/
  .tabs1 #credit1:checked~#credit1_content,
  .tabs1 #transfer1:checked~#transfer1_content {
    display: block;
  }

  .tabs2 #credit2:checked~#credit2_content,
  .tabs2 #transfer2:checked~#transfer2_content {
    display: block;
  }

  .tabs3 #credit3:checked~#credit3_content,
  .tabs3 #transfer3:checked~#transfer3_content {
    display: block;
  }

  /*選択されているタブのスタイルを変える*/
  .tabs1 input:checked+.tab_item1 {
    background-color: #5ab4bd;
    color: #fff;
  }

  .tabs2 input:checked+.tab_item2 {
    background-color: #5ab4bd;
    color: #fff;
  }

  .tabs3 input:checked+.tab_item3 {
    background-color: #5ab4bd;
    color: #fff;
  }

  input[name="submit"] {
    width: 98%;
  }

  .tabs2 h3 {
    margin-bottom: 10px !important;
  }

  .tabs2 p {
    margin-bottom: 10px !important;
  }

  /*ラジオボタンを全て消す*/
  input[name="Amount"] {
    margin-bottom: 30px !important;
  }

  /*+++++++++++++++++++++++++*/
  /* ------------------------------------------------------------
14. TOUR
------------------------------------------------------------ */
  #page-tour h3 {
    width: 80%;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
  }

  /* ------------------------------------------------------------
15. SEND-STAFF
------------------------------------------------------------ */
  .send-staff-link {
    margin: 20px auto 40px;
    text-align: right;
  }

  .staff-profile img {
    width: 100%;
    margin-bottom: 20px;
  }

  .staff-name {
    margin-top: 40px;
  }

  /* ------------------------------------------------------------
16. SEMINAR
------------------------------------------------------------ */
  #page-seminar .seminar-img-01 img {
    width: 80%;
  }

  #page-seminar .seminar-img-02 img {
    width: 80%;
  }

  /* ------------------------------------------------------------
17. DOJO
------------------------------------------------------------ */
  #page-dojyo .dojo-time-table {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }

  /* ------------------------------------------------------------
18. BOOKS
------------------------------------------------------------ */
  .book-img {
    width: 100%;
    text-align: center;
  }

  #page-books img {
    width: 70%;
    margin-bottom: 50px;
    margin-left: auto;
    margin-right: auto;


  }

  #page-books #books-buy {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }



  /* ------------------------------------------------------------
19.　VISION
------------------------------------------------------------ */
  #page-vision h3 {
    margin-bottom: 40px;
  }

  /* ------------------------------------------------------------
20.　CONCEPT
------------------------------------------------------------ */
  #page-concept h2,
  #page-field h2 {
    width: 100%;
    margin: 20px auto;
  }

  #page-concept img,
  #page-field img,
  #page-history img,
  #page-recruit img {
    width: 80%;
  }

  #page-concept h2 img,
  #page-field h2 img {
    width: 90%;
  }

  .concept__img {
    width: 100%;
  }

  .concept__img img {
    width: 100%;
  }

  #page-concept h3 {
    margin: 30px auto;
    width: 80%;
    text-align: left;
    padding-left: 10px;
    box-sizing: border-box;
    font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, "sans-serif";
    font-weight: bold;
    font-size: 7vw;
    line-height: 9vw;
  }

  #page-concept h4 {
    font-size: 6vw;
  }

  .concept--red {
    border-left: 25px solid #ff0000;
  }

  .concept--cyan {
    border-left: 25px solid #2989c0;
  }

  .concept--gren {
    border-left: 25px solid #80a43f;
  }

  .concept__lastimg {
    width: 100%;
  }

  #page-concept .concept__lastimg img,
  #page-field .concept__lastimg img {
    width: 100%;
  }

  .concept__btn {
    display: inline-block;
    padding: 10px 30px;
    border-radius: 70px;
    font-size: 6.5vw;
    line-height: 7.5vw;
    font-weight: bold;
    margin: 10px auto;
    width: 75%;
    font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, "sans-serif";
  }

  .concept__btn a {
    color: #FFFFFF;
  }

  .concept__btn span {
    font-size: 5vw;
  }

  #page-field h3 {
    width: 80%;
  }

  #page-field h3 img {
    width: 100%;
  }

  #page-field h4 {
    font-size: 5vw;
    width: 90%;
  }

  #page-field .caption,
  #page-history .caption {
    margin-bottom: 10px;
    padding-bottom: 0px;
    font-size: 3.2vw;
    text-align: center;
    width: 90%;
  }

  #page-history h3 {
    display: inline-block;
    padding: 10px 30px;
    border-radius: 70px;
    font-size: 5vw;
    line-height: 7.5vw;
    font-weight: bold;
    margin: 30px auto 40px;
    width: 75%;
    background-color: #64b4e6;
    position: relative;
    font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, "sans-serif";
    color: #FFFFFF;
  }

  #page-history .icon01 {
    position: absolute;
    right: 1%;
    top: 15%;
    width: 18.5%;
  }

  #page-history .icon02 {
    position: absolute;
    right: 3%;
    top: 10%;
    width: 18.5%;
  }

  #page-history .icon03 {
    position: absolute;
    right: 0%;
    top: 41%;
    width: 18.5%;
  }

  #page-history .icon04 {
    position: absolute;
    right: 0%;
    top: 10%;
    width: 25.5%;
  }

  #page-history .icon05 {
    position: absolute;
    right: 3%;
    top: 41%;
    width: 12%;
  }

  #page-history .icon06 {
    position: absolute;
    right: 2%;
    top: 25%;
    width: 30%;
  }

  #page-history .icon07 {
    position: absolute;
    right: 1%;
    top: 30%;
    width: 19%;
  }

  #page-history .icon08 {
    position: absolute;
    right: 2%;
    top: 27%;
    width: 19%;
  }

  /* ------------------------------------------------------------
21. HANEKKO/FUKKOU
------------------------------------------------------------ */
  #page-hanekko img,
  #page-fukkou img,
  #page-youth img {
    width: 80%;
  }

  /* ------------------------------------------------------------
22. Q & A
------------------------------------------------------------ */
  #page-q-and-a h2 {
    position: relative;
  }

  #page-q-and-a h2::after {
    content: "";
    display: block;
    width: 18%;
    height: 100%;
    position: absolute;
    background: no-repeat url("../img/q_a/qa_icon01.png");
    background-size: 100%;
    right: 2%;
    top: 40%;
  }

  #page-q-and-a h3 {
    position: relative;
    text-align: left;
    padding-left: 9%;
    line-height: 7vw;
  }

  #page-q-and-a h3::before {
    content: '';
    display: block;
    width: 40%;
    height: 90%;
    background: no-repeat url("../img/q_a/qa_icon_q.png");
    background-size: 16%;
    position: absolute;
    top: 10%;
    left: 1%;
  }

  #page-q-and-a p {
    /*    display: inline-block;*/
    padding: 20px;
    border-radius: 30px;
    background-color: #FAF8F0;
    margin-bottom: 50px;
    width: 90%;
  }

  /* ------------------------------------------------------------
23. PAGE RECRUIT
------------------------------------------------------------ */
  .recruit-flyer img {
    width: 80%;
  }

  /* ------------------------------------------------------------
24.  PLAY WORKER DAY
------------------------------------------------------------ */
  #page-play-worker-day {
    background: url("../img/common/bg_top.jpg");
    padding-bottom: 75px;
  }

  #play-worker-day-h2 {
    background-color: #FFFFFF;
    padding-bottom: 30px;
  }

  #page-play-worker-day h2 {
    width: 100%;
  }

  #page-play-worker-day h2 img {
    width: 100%;
  }

  #note {
    width: 90%;
    background: url("../img/common/bg_note.png");
    background-size: contain;
    margin: 0px auto;
  }

  #note img {
    width: 90%;
    margin-bottom: 30px;
  }

  .img-asa {
    margin: -20px 0 15px;
  }

  #note h3 {
    width: 85%;
    font-size: 4.5vw;
    font-weight: bold;
    text-align: left;
    margin: 20px auto 10px;
  }

  #note p {
    width: 85%;
    font-size: 4vw;
    text-align: left;
    font-weight: normal;
  }

  #play-worker-day-img-last {
    width: 80%;
    margin: 0 auto 50px;
  }

  #play-worker-day-img-last img {
    width: 100%;
    margin-top: -65px;
  }

  /* ------------------------------------------------------------
25.　SINGLE
------------------------------------------------------------ */
  #single-page {
    width: 100%;
    margin: 0 auto;
    overflow: auto;
  }

  #single-page img {
    width: 80%;
    height: auto;
    margin: 30px auto;
  }

  #single-page h2 {
    margin: 30px auto 15px;
    width: 80%;
    line-height: 9vw;
  }

  #single-page .date {
    margin-bottom: 50px;
  }


  /* ------------------------------------------------------------
26. SNS-LINK
------------------------------------------------------------ */

  .sns-link {
    width: 80%;
    height: 24px;
    margin: 10px auto;
    display: flex;
  }

  .sns-link__twitter {
    width: 88px !important;
    height: 24px !important;
    margin: 0 !important;
    padding-right: 10px;
  }

  .sns-link__facebook {
    width: 83px !important;
    height: 24px !important;
    margin: 0 !important;
    padding-right: 10px;

  }

  .sns-link__line {
    width: 102px !important;
    height: 24px !important;
    margin: 0 !important;
  }

  /* ------------------------------------------------------------
27. SNS-LINK-PAGE
------------------------------------------------------------ */

  .sns-link--page {
    width: 80%;
    height: 24px;
    margin: 0px auto 25px;
    display: flex;
  }

  .sns-link__twitter {
    width: 88px !important;
    height: 24px !important;
    margin: 0 !important;
    padding-right: 10px;
  }

  .sns-link__facebook {
    width: 83px !important;
    height: 24px !important;
    margin: 0 !important;
    padding-right: 10px;

  }

  .sns-link__line {
    width: 102px !important;
    height: 24px !important;
    margin: 0 !important;
  }



}


/* ------------------------------------------------------------
28. PAGER
------------------------------------------------------------ */


.pager {
  text-align: center;
  /* ページャー全体を中央揃え */
  margin-top: 20px;
  /* 必要に応じて間隔を調整 */
}

.pager__inner {
  display: inline-block;
  /* ページャーリンクを中央寄せ */
}

.pager__inner a,
.pager__inner span {
  text-decoration: none;
  /* 下線を削除 */
  margin: 0 5px;
  /* 各リンクの間隔を調整 */
  color: #000;
  /* テキスト色を黒に設定 */
  font-size: 16px;
  /* フォントサイズ */
  font-weight: normal;
  /* フォントの太さを調整 */
}

.pager__inner a:hover {
  color: #0073aa;
  /* ホバー時の文字色を変更 */
}

.pager__inner .current {
  color: #0073aa;
  /* 現在のページの文字色 */
  font-weight: bold;
  /* 現在のページを太字に */
}
