/* Scss Document */
body, #head {
  background: #FEF2E0; }

body.scrolled #head {
  background: #FEF2E0; }

#global_navi {
  background: #FEF2E0; }

#head {
  border-bottom: 1px solid #E0E0E0; }

img {
  vertical-align: bottom; }

.sec-scroll-point {
  padding-top: 80px !important;
  margin-top: -80px !important; }
  @media (min-width: 960px) {
    .sec-scroll-point {
      padding-top: 120px !important;
      margin-top: -120px !important; } }

.section_navi {
  position: fixed;
  z-index: 1;
  right: 10px;
  top: 120px;
  display: none; }
  .section_navi .navi_list .navi_item:not(fist-child) {
    margin-top: -2px; }
  .section_navi .navi_list .navi_item .a {
    text-decoration: none;
    justify-content: flex-start;
    position: relative;
    padding: 6px 0 6px 1.5em; }
    .section_navi .navi_list .navi_item .a:before {
      content: '';
      display: inline-block;
      width: 4px;
      height: 100%;
      background: #f4d2bb;
      border-radius: 10px;
      position: absolute;
      top: 0;
      left: 0; }
    .section_navi .navi_list .navi_item .a.is-active {
      z-index: 4; }
      .section_navi .navi_list .navi_item .a.is-active:before {
        background: #EA4E19; }
  @media (min-width: 1280px) {
    .section_navi {
      top: 220px;
      right: 60px;
      display: block; } }

.section_title_wrap.border {
  border-bottom: 1px solid #EA4E19;
  margin-bottom: 40px;
  padding-bottom: 30px; }
  @media (min-width: 960px) {
    .section_title_wrap.border {
      padding-bottom: 40px;
      margin-bottom: 60px; } }
.section_title_wrap:not(.border) {
  margin-bottom: 40px; }
  @media (min-width: 960px) {
    .section_title_wrap:not(.border) {
      margin-bottom: 70px; } }
.section_title_wrap .head {
  margin-bottom: 10px;
  color: #EA4E19; }
  .section_title_wrap .head .en {
    font-family: 'Lalezar';
    letter-spacing: 0; }
    @media (min-width: 960px) {
      .section_title_wrap .head .en {
        letter-spacing: 3.4px; } }
  .section_title_wrap .head > div:first-child {
    font-size: 3rem;
    line-height: 1; }
  .section_title_wrap .head .ja {
    font-size: 1rem; }
@media (min-width: 960px) {
  .section_title_wrap .head {
    display: flex;
    align-items: center; }
    .section_title_wrap .head > div:first-child {
      font-size: 4.8rem;
      margin-right: 20px; }
  .section_title_wrap .columns {
    --gap:100px; }
    .section_title_wrap .columns .text_box {
      width: calc(100% - 180px - var(--gap)); }
    .section_title_wrap .columns .link {
      width: 180px; } }
@media (min-width: 1280px) {
  .section_title_wrap .columns {
    --gap:248px; } }

.tags .tag .a {
  border-color: #EA4E19;
  background: none;
  color: #EA4E19; }
  .tags .tag .a:hover {
    background-color: #EA4E19 !important; }

.archives.pickup .archive:not(:last-child):after {
  background: #EA4E19; }
@media (min-width: 960px) {
  .archives.pickup .archive:nth-child(3n):after {
    display: none; } }
.archives .archive > a > .info .name {
  color: #EA4E19; }
  .archives .archive > a > .info .name + .text {
    color: #EA4E19; }
.archives .archive > a > .info .data .date {
  color: #EA4E19; }

.section_title_wrap .to_link {
  justify-content: flex-start;
  margin: 0; }

section[key=main] {
  overflow: hidden;
  padding: 50px 0;
  border-bottom: 1px solid #EA4E19; }
  @media (min-width: 960px) {
    section[key=main] .block {
      display: flex;
      grid-gap: 20px; } }
  section[key=main] .text_box {
    color: #EA4E19;
    padding-top: 40px;
    margin-bottom: 60px; }
    section[key=main] .text_box .head {
      font-size: 1.8rem;
      font-family: "yu-mincho-pr6n", sans-serif;
      line-height: 1.5;
      margin-bottom: 40px;
      margin-left: -3px; }
    section[key=main] .text_box .body .text {
      font-size: 1.08rem; }
      section[key=main] .text_box .body .text span {
        display: inline; }
      section[key=main] .text_box .body .text:not(:last-child) {
        margin-bottom: 25px; }
      section[key=main] .text_box .body .text.notes {
        border: 1px solid #EA4E19;
        font-size: .9rem;
        padding: 20px;
        margin-top: 70px; }
    @media (min-width: 960px) {
      section[key=main] .text_box {
        width: calc(100% - 250px - 140px);
        padding-top: 0; }
        section[key=main] .text_box .head {
          font-size: 3.2rem; }
        section[key=main] .text_box .body .text.notes {
          max-width: 470px; }
          section[key=main] .text_box .body .text.notes span {
            display: inline-block; } }
    @media (min-width: 1180px) {
      section[key=main] .text_box {
        width: calc(100% - 360px - 140px - 60px - 40px);
        margin-left: 60px; } }
  section[key=main] .img_wrap img {
    max-width: none;
    position: relative;
    width: 100%; }
  section[key=main] .img_wrap.img_left .img01 {
    width: 45%; }
    section[key=main] .img_wrap.img_left .img01 img {
      width: calc(100% + var(--cont_margin));
      left: calc(0px - var(--cont_margin)); }
  section[key=main] .img_wrap.img_left .img02 {
    width: 50%;
    margin-left: auto;
    margin-top: -80px; }
  section[key=main] .img_wrap.img_right .img {
    margin-left: auto; }
  section[key=main] .img_wrap.img_right .img01 {
    width: 45%; }
    section[key=main] .img_wrap.img_right .img01 img {
      width: calc(100% + var(--cont_margin));
      right: calc(0 - var(--cont_margin)); }
  section[key=main] .img_wrap.img_right .img02 {
    width: 30%; }
    section[key=main] .img_wrap.img_right .img02 img {
      width: calc(100% + var(--cont_margin));
      right: calc(0 - var(--cont_margin)); }
  @media (min-width: 960px) {
    section[key=main] .img_wrap.img_left {
      width: 250px; }
      section[key=main] .img_wrap.img_left .img01 {
        width: 100%; }
      section[key=main] .img_wrap.img_left .img02 {
        width: 90%;
        margin-top: 30px; }
    section[key=main] .img_wrap.img_right {
      width: 140px;
      height: fit-content;
      margin-top: auto;
      padding-bottom: 100px; }
      section[key=main] .img_wrap.img_right .img01 {
        width: 100%; }
      section[key=main] .img_wrap.img_right .img02 {
        width: 50%;
        margin-top: 20px; } }
  @media (min-width: 1180px) {
    section[key=main] .img_wrap.img_left {
      width: 360px; }
      section[key=main] .img_wrap.img_left .img01 img {
        width: calc(100% + (100vw - 1180px)/2);
        left: calc((1180px - 100vw)/2); }
    section[key=main] .img_wrap.img_right {
      width: 140px; }
      section[key=main] .img_wrap.img_right .img01 img {
        width: calc(100% + (100vw - 1180px)/2); }
      section[key=main] .img_wrap.img_right .img02 img {
        width: calc(100% + (100vw - 1180px)/2); } }
  section[key=main] .bg_logo {
    width: 380px;
    height: 124px;
    position: absolute;
    top: 100px;
    right: 0; }
    section[key=main] .bg_logo .icon {
      background-image: url("../images/sou/logo_bg.png"); }
    @media (min-width: 960px) {
      section[key=main] .bg_logo {
        width: 740px;
        height: 250px;
        top: 210px; } }
  section[key=main] .logo {
    width: 140px;
    height: 60px;
    padding-top: 40px;
    margin-bottom: 40px; }
    section[key=main] .logo .icon {
      background-image: url("../images/common/logo_sou02.svg"); }
    @media (min-width: 960px) {
      section[key=main] .logo {
        width: 268px;
        height: 115px;
        padding-top: 0;
        margin-bottom: 100px; } }
  @media (min-width: 960px) {
    section[key=main] .cont {
      padding-top: 96px; } }
section[key=archives] {
  padding: 80px 0; }
  @media (min-width: 960px) {
    section[key=archives] {
      padding: 160px 0; } }
section[key=contents] {
  padding: 80px 0 0; }
  @media (min-width: 960px) {
    section[key=contents] {
      padding: 180px 0 0; } }
section[key=consultation] {
  padding: 100px 0 80px; }
  section[key=consultation] .section_title_wrap.border {
    margin-bottom: 20px; }
  section[key=consultation] .section_title_wrap .head .bold {
    text-indent: -2px; }
  section[key=consultation] .section_title_wrap .body.text {
    padding-left: 3px;
    color: #EA4E19; }
  @media (min-width: 960px) {
    section[key=consultation] {
      padding: 180px 0 200px; }
      section[key=consultation] .section_title_wrap.border {
        margin-bottom: 40px; }
      section[key=consultation] .section_title_wrap .columns .text_box {
        width: 90%; } }
  section[key=consultation] .headline {
    color: #EA4E19;
    margin-bottom: 30px;
    font-size: 1.56rem; }
    @media (min-width: 960px) {
      section[key=consultation] .headline {
        font-size: 1.9rem; } }
  section[key=consultation] .section_title_wrap .head > div:first-child {
    font-size: 2.8rem;
    line-height: 1.75; }
  section[key=consultation] .calendar {
    margin-bottom: 60px;
    margin-left: auto;
    margin-right: auto;
    width: 100%; }
    section[key=consultation] .calendar .text {
      margin-bottom: 60px;
      color: #EA4E19; }
    section[key=consultation] .calendar .img {
      background: #FFF;
      text-align: center; }
    @media (min-width: 960px) {
      section[key=consultation] .calendar {
        margin-bottom: 70px; }
        section[key=consultation] .calendar .text {
          margin-bottom: 60px; } }
  section[key=consultation] .members {
    margin-bottom: 60px; }
    @media (min-width: 960px) {
      section[key=consultation] .members {
        margin-bottom: 70px;
        transform: translateY(80px); } }
    section[key=consultation] .members .body {
      display: flex;
      flex-wrap: wrap;
      --gap: 40px;
      grid-gap: var(--gap); }
      section[key=consultation] .members .body .member {
        width: calc((100% - var(--gap))/2);
        text-align: center; }
        section[key=consultation] .members .body .member .ph {
          border-radius: 200px;
          overflow: hidden; }
          section[key=consultation] .members .body .member .ph .bg:before {
            content: '';
            display: block;
            padding-top: 100%; }
        section[key=consultation] .members .body .member .name {
          font-size: 1.2rem;
          color: #EA4E19;
          margin: 20px 0; }
        section[key=consultation] .members .body .member .to_link {
          margin: 0; }
          section[key=consultation] .members .body .member .to_link .a {
            border-color: #EA4E19;
            color: #EA4E19;
            height: 34px; }
            section[key=consultation] .members .body .member .to_link .a:hover {
              color: #FFF;
              background: #EA4E19; }
  section[key=consultation] .contactinfo .text, section[key=consultation] .contactinfo .a {
    color: #EA4E19; }
  @media (min-width: 960px) {
    section[key=consultation] .section_title_wrap .head {
      align-items: flex-end; }
      section[key=consultation] .section_title_wrap .head > div:first-child {
        font-size: 4rem; }
      section[key=consultation] .section_title_wrap .head .ja {
        margin-bottom: 16px; }
    section[key=consultation] .members .body {
      --gap:45px; }
      section[key=consultation] .members .body .member {
        width: calc((100% - (var(--gap) * 6))/7); }
        section[key=consultation] .members .body .member .name {
          margin: 10px 0 15px; } }
section[key=about] {
  padding: 60px 0;
  position: relative; }
  section[key=about]:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    opacity: .3;
    width: 100%;
    height: 1px;
    background-color: #EA4E19; }
  section[key=about] .text {
    text-align: center;
    color: #EA4E19; }
    section[key=about] .text span {
      text-align: left;
      display: block;
      margin: 0 auto;
      max-width: 760px; }

@media (min-width: 960px) {
  #contact {
    transform: translateY(160px); } }

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
  z-index: 20;
  display: none; }

.modal_window {
  background: #FEF2E0;
  border: 1px solid #EA4E19;
  border-radius: 10px;
  width: 90%;
  max-width: 580px;
  height: fit-content;
  margin: auto;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 21;
  display: none;
  overflow-y: scroll;
  max-height: calc(100vh - 100px); }
  .modal_window .close {
    width: 26px;
    height: 26px;
    position: absolute;
    transform: rotate(45deg);
    right: 20px;
    top: 20px; }
    .modal_window .close:before, .modal_window .close:after {
      content: '';
      display: block;
      width: 100%;
      height: 1px;
      background: #EA4E19;
      position: absolute;
      top: 0;
      bottom: 0;
      right: 0;
      left: 0;
      margin: auto; }
    .modal_window .close:before {
      transform: rotate(90deg); }
  .modal_window .modal_inner {
    color: #EA4E19; }
    .modal_window .modal_inner .row {
      padding: 30px 36px; }
      .modal_window .modal_inner .row.profile {
        display: flex;
        grid-gap: 20px; }
      .modal_window .modal_inner .row .text_box {
        width: calc(100% - 20px - 148px); }
      .modal_window .modal_inner .row .ph {
        width: 148px;
        height: 148px;
        border-radius: 100px;
        overflow: hidden; }
        .modal_window .modal_inner .row .ph .bg:after {
          content: '';
          display: block;
          padding-top: 100%; }
      .modal_window .modal_inner .row .name_box {
        margin-bottom: 20px; }
        .modal_window .modal_inner .row .name_box .name {
          font-size: 1.7rem; }
        .modal_window .modal_inner .row .name_box .position {
          font-size: 1.07rem;
          font-family: "Poppins", YuGothic, "Yu Gothic", "Noto Sans JP", sans-serif;
          font-weight: 100; }
      .modal_window .modal_inner .row .tag {
        font-size: .8rem; }
        .modal_window .modal_inner .row .tag span:not(:last-child) {
          margin-right: 4px; }
      .modal_window .modal_inner .row.comment {
        line-height: 1.75; }
        .modal_window .modal_inner .row.comment p:not(:last-child) {
          margin-bottom: 10px; }
    .modal_window .modal_inner .border {
      width: 100%;
      height: 1px;
      background: #EA4E19;
      opacity: .2; }
  @media (min-width: 960px) {
    .modal_window .modal_inner .row.profile {
      grid-gap: 30px;
      align-items: center; }
    .modal_window .modal_inner .row .text_box {
      width: calc(100% - 148px - 30px); } }
