@charset "utf-8";

/*
  File Name   : junior.css
  Description : 中学校共通
*/

/* Color variables
----------------------------------------------------------- */
:root {
  --selection-color: #000;
  --placeholder-color: #a0a0a0;
  --select-icon-color: #000;
  --checkbox-base-color: #b5d87e;
  --checkbox-icon-color: #000;
  --radio-base-color: #b5d87e;
  --radio-icon-color: #000;
  --base-color: #b5d87e;
  --link-color: #0d50a4;
  --font-color: #000;
  --font-color2: #fff;
  --font-color3: #000;
  --font-color4: #a2c46b;
  --font-color5: #000;
  --bg-color: #a2c46b;
  --border-color: #ededed;
  --border-color2: #000;
  --border-color3: #a2c46b;
  --required-color: #de306d;
  --title-color: #fff;
  --button-color: #000;
  --disabled-color: #ababab;
}

/* ========================================================= */
/* common.css
============================================================ */

/* com-section-kv
============================================================ */
.com-section-kv {
  background-image: url(../img/common/common-kv-bg-gr.png);
}

/* sp
------------------------------------------------------------ */
@media screen and (max-width: 811px) {
  .com-section-kv {
    background-image: url(../img/common/common-kv-bg-gr-sp.png);
  }
}

/* com-form-bottom-btn-wrap
============================================================ */
.com-form-bottom-btn-wrap .btn-wrap .btn.btn-send::after {
  background-image: url(../img/common/icon-arrow-right-bk.png);
}
.com-form-bottom-btn-wrap .btn-wrap .btn.btn-back::after {
  background-image: url(../img/common/icon-arrow-left-bk.png);
}

/*
============================================================ */
/* global nav
============================================================ */

/* sp
------------------------------------------------------------ */
@media screen and (max-width: 811px) {
  #links .lay-global-nav ul li.links a,
  #manual .lay-global-nav ul li.manual a,
  #mypage .lay-global-nav ul li.mypage a,
  #service .lay-global-nav ul li.service a,
  #guide .lay-global-nav ul li.guide a,
  .lay-global-nav ul li a:hover {
    background-image: url(../img/info/icon-arrow-right-gr.png);
  }
}

/* com-btn-wrap
============================================================ */
.com-btn-wrap .btn::after {
  background-image: url(../img/common/icon-arrow-right-bk.png);
}

/* pagination
============================================================ */
.pagination a {
  color: var(--font-color);
}
.pagination .prev a::before,
.pagination .next a::before {
  background-image: url(../img/info/icon-arrow-left-bk.png);
}
.pagination .next a::before {
  background-image: url(../img/info/icon-arrow-right-bk.png);
}

/* ========================================================= */
/* module.css
============================================================ */
.mod-editor ol > li::before {
  content: counter(item);
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 0.5em;
  margin-bottom: 3px;
  padding-right: 0;
  border-radius: 20px;
  background: var(--base-color);
  color: var(--font-color3);
  font-size: 0.8em;
  font-weight: bold;
  line-height: 20px;
  text-align: center;
  text-indent: 0;
}

/* sp
------------------------------------------------------------ */
@media screen and (max-width: 811px) {
  .mod-editor ol > li::before {
    width: 18px;
    height: 18px;
    border-radius: 18px;
    line-height: 18px;
  }
}

/* ========================================================= */
/* layout.css
============================================================ */

/* lay-head-login-wrap
============================================================ */
.lay-head-login-wrap .user-name-block .name::before {
  background-image: url(../img/common/icon-member-bk.png);
}
.lay-head-login-wrap .login-btn-block button span::before,
.lay-head-login-wrap .login-btn-block a span::before {
  background-image: url(../img/common/icon-login-bk.png);
}

/* page-top
============================================================ */
.lay-page-top-wrap a {
  background-image: url(../img/common/page-top-gr.png);
}

/* ========================================================= */
/* top.css
============================================================ */

/* section-top-kv
============================================================ */
.section-top-kv {
  background-image: url(../img/top/kv-img-6.jpg);
}
.section-top-kv .kv-inner .btn-block a span::before,
.section-top-kv .kv-inner .btn-block button span::before {
  background-image: url(../img/common/icon-check-round-bk.png);
}
.section-top-kv .kv-inner .box-B .btn-block a span::before,
.section-top-kv .kv-inner .box-B .btn-block button span::before {
  background-image: url(../img/common/icon-login-bk.png);
}

/* box-D */
.section-top-kv .info-btn a span::before {
  background-image: url(../img/common/icon-list-bk.png);
}

/* sp
------------------------------------------------------------ */
@media screen and (max-width: 811px) {
  .section-top-kv .kv-inner .btn-block a span::before,
  .section-top-kv .kv-inner .btn-block button span::before {
    background-image: url(../img/common/icon-check-round-bk.png);
  }
  .section-top-kv .kv-inner .box-B .btn-block a span::before,
  .section-top-kv .kv-inner .box-B .btn-block button span::before {
    background-image: url(../img/common/icon-login-bk.png);
  }
}

/* section-info
============================================================ */
.section-info .info-btn a span::before {
  background-image: url(../img/common/icon-list-bk.png);
}

/* section-nav
============================================================ */
.section-nav {
  background-image: url(../img/top/top-bg-parts-1-gr.png);
}

/* flex-btn-wrap */
.section-nav .flex-btn-wrap .btn-area a::after {
  background-image: url(../img/common/icon-arrow-right-bk.png);
}
.section-nav .flex-btn-wrap .btn-area.-service .text-block {
  background-image: url(../img/common/icon-service-bk.png);
}
.section-nav .flex-btn-wrap .btn-area.-faq .text-block {
  background-image: url(../img/common/icon-faq-bk.png);
}

/* sp
------------------------------------------------------------ */
@media screen and (max-width: 811px) {
  .section-nav {
    background-image: url(../img/top/top-bg-parts-1-gr.png);
  }

  /* flex-btn-wrap */
  .section-nav .flex-btn-wrap .btn-area a::after {
    background-image: url(../img/common/icon-arrow-right-bk.png);
  }
}

/* ========================================================= */
/* info.css
============================================================ */

/* detail
============================================================ */
body.detail .info-detail .title {
  padding: 15px 20px;
  background: var(--base-color);
  color: var(--font-color3);
  font-size: inherit;
  line-height: 1.4;
}
body.detail .info-btn-wrap a::before {
  background-image: url(../img/common/icon-arrow-right-bk-2.png);
}

/* sp
------------------------------------------------------------ */
@media screen and (max-width: 811px) {
  .section-guide section h2 {
    padding: 5px 20px;
    font-size: inherit;
  }
}

/* ========================================================= */
/* login.css
============================================================ */

/* login
----------------------------------------------------------- */
body.login {
  background-image: url(../img/top/kv-img-6.jpg);
}

/* wp-core-ui
----------------------------------------------------------- */
.wp-core-ui .button-secondary,
.wp-core-ui .button {
  color: var(--button-color) !important;
}
.wp-core-ui .button-secondary:hover,
.wp-core-ui .button.hover,
.wp-core-ui .button:hover {
  color: var(--button-color) !important;
}
.wp-core-ui .button-primary {
  border-color: var(--base-color) !important;
  background: var(--base-color) !important;
  color: var(--button-color) !important;
}
.wp-core-ui .button-primary.focus,
.wp-core-ui .button-primary.hover,
.wp-core-ui .button-primary:focus,
.wp-core-ui .button-primary:hover {
  border-color: var(--base-color) !important;
  background: var(--base-color) !important;
  color: var(--button-color) !important;
}