@charset "UTF-8";

/* ------------------------------------

 common

------------------------------------ */

:root {
  --key: #A68E6A;
  --key-p: #F5EDE1;
  --bk: #2C2017;
  --btn: #6CC85C;
  --container: calc(100% - 40px);
  --maxwidth: 1300px;
  --gap: 80px;
  --gap-M: 30px;
  --r: 6px;
}

@media screen and (min-width: 768px) {
  :root {
    --container: calc(100% - min(5vw,120px) );
    --gap: 100px;
    --gap-M: 40px;
  }
}
html {
  scroll-behavior: smooth;
}
main {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-style: normal;
  line-height: 2;
  color: var(--bk);
  position: relative;
  font-size: min(4vw,16px);
  text-align: justify;
  padding-top: 140px;
}
main em {
  font-weight: 700;
}
main .container {
  width: var(--container);
  max-width: var(--maxwidth);
  margin: auto;
}
main .e-caution {
  display: block;
  font-size: min(3vw,12px);
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  main {
    padding-top: 100px;
  }
  main .pc {
    display: none;
  }
}
@media screen and (min-width: 768px) {
  main {
    font-size: 16px;
  }
  main a {
    transition: .3s all;
  }
  main a:hover {
    opacity: .8;
  }
  main .e-caution {
    font-size: 12px;
  }
  main a[href^="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
    color: inherit;
  }
  main .sp {
    display: none;
  }
}

/* btn */

.b-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--btn);
  border: 2px solid var(--btn);
  border-radius: 100px;
  color: #fff;
  line-height: 1;
  position: relative;
}
.b-btn::before {
  content: "";
  display: block;
  background: url(../images/btn-arrow-wh.png) center center / contain no-repeat;
  aspect-ratio: 1/1;
  position: absolute;
  z-index: 1;
  top: 50%;
  transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
  .b-btn {
    width: min(40vw,160px);
    height: min(8vw,32px);
  }
  .b-btn::before {
    width: min(3.5vw,14px);
    right: 5px;
  }
  .b-btn .e-txt {
    font-size: min(3.25vw,13px);
  }
}
@media screen and (min-width: 768px) {
  .b-btn {
    width: 220px;
    height: 44px;
  }
  .b-btn::before {
    width: 20px;
    right: 10px;
  }
  .b-btn:hover {
    background: #fff;
    color: var(--btn);
  }
  .b-btn:hover::before {
    background-image: url(../images/btn-arrow-gr.png)
  }
}


/* logo */

@media screen and (min-width: 768px) {
  .e-logo {
    width: 243px;
  }
}

/* mds */
.e-mds {
  text-align: left;
}
.e-mds > span {
  display: inline-block;
}
.e-mds,
.e-projectMds,
.e-eventMds {
  font-weight: 700;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .e-mds,
  .e-eventMds {
    font-size: min(6vw,24px);
  }
  .e-mds,
  .b-intro .e-mds,
  .e-projectMds {
    font-size: min(7vw,28px);
  }
  .b-event .e-mds {
    font-size: min(5vw,20px);
  }
}
@media screen and (min-width: 768px) {
  .e-mds {
    font-size: 32px;
  }
  .b-intro .e-mds,
  .e-projectMds {
    font-size: 36px;
  }
  .b-event .e-mds,
  .e-eventMds {
    font-size: 24px;
  }
}

/* w100 */
@media screen and (max-width: 767px) {
  .m-w100 {
    width: 100dvw;
    margin-left: 50%;
    transform: translateX(-50dvw);
  }
}

/* ------------------------------------

 intro

------------------------------------ */
.b-intro {
  margin-bottom: var(--gap);
}
.b-intro .e-txt {
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  .b-intro {
    /*padding-bottom: var(--gap);
    border-bottom: 1px solid var(--key);*/
  }
  .b-intro .e-mds,
  .b-intro .e-img {
    margin-bottom: var(--gap-M);
  }
}
@media screen and (min-width: 768px) {
  .b-intro .e-mds {
    margin-bottom: 50px;
  }
  .b-intro .container {
    display: flex;
    /*padding-bottom: var(--gap);
    border-bottom: 1px solid var(--key);*/
  }
  .b-intro .e-img {
    width: min(42.3%,550px);
    min-width: min(42.3%,550px);
    margin-left: 50px;
  }
}
@media screen and (min-width: 768px) and (max-width: 935px) {
  .b-intro .container {
    display: block;
  }
  .b-intro .e-img.sp {
    display: block;
    width: 60%;
    margin: 50px auto;
  }
  .b-intro .e-img.pc {
    display: none;
  }
}

/* ------------------------------------

 lead

------------------------------------ */
.b-lead {
  margin-bottom: var(--gap);
}
.b-lead .b-item {
  background: var(--key);
  color:#fff;
  border-radius: var(--r);
}
.b-lead .b-item dt {
  text-align: center;
  margin-bottom: 10px;
}
@media screen and (max-width: 767px) {
  .b-lead .e-mds {
    margin-bottom: 20px;
  }
  .b-lead .b-item {
    margin-top: 20px;
    padding: 20px;
  }
  .b-lead .b-item dt {
    font-size: min(6vw,24px);
  }
}
@media screen and (min-width: 768px) {
  .b-lead .e-mds,
  .b-lead .e-txt {
    text-align: center;
  }
  .b-lead .e-txt {
    margin: 25px 0;
  }
  .b-lead .e-txt span {
    display: inline-block;
  }
  .b-lead .b-3column {
    display: flex;
    justify-content: space-between;
  }
  .b-lead .b-item {
    width: calc( (100% - 35px*2 ) / 3 );
    padding: 25px 20px;
  }
  .b-lead .b-item dt {
    font-size: 24px;
  }
}
@media screen and (min-width: 768px) and (max-width: 935px) {
  .b-lead .b-3column {
    display: block;
  }
  .b-lead .b-item {
    width: calc(100% - 100px);
    margin: 20px auto 0;
    padding: 25px 50px;
  }
}

/* ------------------------------------

 project

------------------------------------ */
.b-project {
  background: var(--key-p);
}
.b-project .inner {
  background: #fff;
  position: relative;
}
.b-project .e-report {
  position: absolute;
  top: 0;
}
.e-projectMds {
  text-align: center;
  color: var(--key);
  border-bottom: 1px solid var(--key);
  padding-bottom: .5em;
}
.e-projectMds span {
  display: inline-block;
}
@media screen and (max-width: 767px) {
  .b-project {
    width: 100dvw;
    margin-left: 50%;
    transform: translateX(-50dvw);
    padding: 20px;
  }
  .b-project .inner {
    padding: 20px;
  }
  .b-project .e-report {
    width: min(15vw,60px);
    left: 10px;
  }
  .e-projectMds {
    margin-bottom: 30px;
  }
}
@media screen and (min-width: 768px) {
  .b-project {
    border-radius: 24px;
    padding: 50px;
  }
  .b-project .inner {
    padding: 100px min(5vw,80px);
  }
  .b-project .e-report {
    width: 20%;
    left: 40px;
  }
  .e-projectMds {
    max-width: 560px;
    margin: 0 auto 115px;
  }
}

/* gallery */

.b-project .inner.m-1st::before {
  content: "";
  display: block;
  aspect-ratio: 560/80;
  background: url(../images/project-clip.svg) center center / contain no-repeat;
  position: absolute;
  top: 0;
  left: 50%;
}
.b-gallery {
  margin-bottom: var(--gap);
}
.b-gallery .e-name {
  color: var(--key);
  line-height: 1.6;
}
.b-gallery li::before {
  content: "・";
}
.b-gallery .b-links {
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
  .b-project .inner.m-1st {
    padding-top: 50px;
  }
  .b-project .inner.m-1st::before {
    width: min(50vw,200px);
    transform: translate(-50%,-10px);
  }
  .b-projectIntro .e-img {
    margin: 30px 0;
  }
  .b-gallery .e-name {
    font-size: 20px;
    margin-bottom: 10px;
  }
  .b-gallery .b-links {
    display: block;
    margin-bottom: .5em;
  }
  .b-gallery .b-btn {
    margin: 20px auto 0;
  }
}
@media screen and (min-width: 768px) {
  .b-project .inner.m-1st {
    padding-top: 137px;
  }
  .b-project .inner.m-1st::before {
    width: 46.66%;
    transform: translate(-50%,-50%);
  }
  .b-projectIntro {
    display: flex;
    justify-content: space-between;
  }
  .b-projectIntro .e-img {
    width: min(48.077%,500px);
    min-width: min(48.077%,500px);
  }
  .b-projectIntro .b-txt {
    border-bottom: 1px solid var(--key);
    padding: 0 40px 30px 0;
  }
  .b-gallery {
    padding-right: 20px;
  }
  .b-gallery .e-name {
    font-size: 24px;
    margin: 5px 0 10px;
  }
  .b-gallery .b-links {
    margin-top: 20px;
  }
  .b-gallery .b-btn {
    margin: 10px;
  }
}
@media screen and (min-width: 768px) and (max-width: 935px) {
  .b-projectIntro .b-txt {
    border-bottom: 0 none;
  }
  .b-projectIntro .e-img.sp {
    display: block;
    width: 60%;
    margin: 50px auto 0;
  }
  .b-projectIntro .e-img.pc {
    display: none;
  }
  .b-gallery .b-links {
    justify-content: center;
  }
  .b-gallery .e-caution {
    text-align: center;
  }
}

/* shape */
.b-shape .e-mds {
  color: var(--key);
}
@media screen and (max-width: 769px) {
  .b-shape {
    padding-bottom: 80px;
  }
  .b-shape .e-txt {
    margin: 30px 0;
  }
}
@media screen and (min-width: 768px) {
  .b-shape .e-mds,
  .b-shape .e-txt {
    text-align: center;
  }
  .b-shape .e-txt {
    margin: 15px 0;
  }
  .b-shape .b-img {
    max-width: 1000px;
    margin: auto;
  }
}
@media screen and (min-width: 768px) and (max-width: 935px) {
  .b-project {
    container-type: inline-size;
  }
  .b-shape .b-img {
    width: 100cqw;
    margin-left:-5vw;
  }
}

/* event */
.inner.b-event {
  background-image: url(../images/dash.svg);
  background-size: 16px;
  background-repeat: repeat-x;
}
.b-event .e-mds,
.e-eventMds {
  color: var(--key);
}
.e-eventMds span {
  display: inline-block;
}
.b-event .b-item {
  border: 1px solid var(--key);
  border-radius: var(--r);
  position: relative;
}
.b-event .b-item::before {
  content: "";
  display: block;
  aspect-ratio: 40/43;
  background: url(../images/event-flag.svg) top center / contain no-repeat;
  position: absolute;
  z-index: 1;
  top: -1px;
 
}
@media screen and (max-width: 767px) {
  .inner.b-event {
    padding-top: 80px;
  }
  .b-event .b-item {
    margin-top: 30px;
    padding: 20px;
  }
  .b-event .b-item::before {
    width: min(9vw,36px);
    right: 16px;
  }
  .e-eventMds {
    margin-bottom: 10px;
  }
  .b-event figure {
    margin-top: 30px;
  }
}
@media screen and (min-width: 768px) {
  .b-event .b-item {
    margin-top: 35px;
    padding: 30px 30px 45px;
  }
  .b-event .b-item::before {
    width: 48px;
    right: 30px;
  }
  .b-event .b-item:first-of-type {
    margin-top: 50px;
  }
  .e-eventMds {
    margin-bottom: 15px;
  }
  .b-event .b-content,
  .b-event .b-imgs {
    display: flex;
    justify-content: space-between;
  }
  .b-event .b-content {
    container-type: inline-size;
  }
  .b-event .b-txt,
  .b-event figure {
    width: calc( ( 100cqw - 80px ) / 3 );
  }
  .b-event figure {
    margin-left: 40px;
  }
}
@media screen and (min-width: 768px) and (max-width: 935px) {
  .b-event .b-content {
    display: block;
  }
  .b-event .b-txt {
    width: 100%;
    margin-bottom: 30px;
  }
  .b-event figure {
    width: calc( (100% - 30px) / 2 );
    margin: 0;
  }
}

/* ------------------------------------

 bottom

------------------------------------ */
.b-bottom {
  padding: var(--gap) 0;
  position: relative;
}
.b-bottom .b-btn {
  margin: auto;
}

/* pageTop */
.b-pageTop {
  font-size: 10px;
  text-align: center;
  position: absolute;
  line-height: 1;
  right: 20px;
  bottom: 20px;
}
.b-pageTop a::before {
  content: "";
  display: block;
  aspect-ratio: 33/43;
  width: 33px;
  margin: 0 auto 10px;
  background: url(../images/pagetop.png) center center / contain no-repeat;
}

#backToTop.show i {
  margin-bottom: 0;
}
#backToTop.show p {
  margin-top: -6px;
  font-size: 10px;
}
.center {
  margin-top: 40px;
  padding-bottom: 180px;
}

@media screen and (max-width: 767px) {
  #backToTop.show i {
    margin-bottom: 0;
  }
  #backToTop.show p {
    margin-top: -3px;
    font-size: 10px;
  }
  .center {
    margin-top: 20px;
    padding-bottom: 120px;
  }
}

.e-lpTtl {
  width: 100%;
  margin-bottom: 10px;
  padding: 8px 0;
  color: #fff;
  font-size: 30px;
  font-weight: 500;
  background: var(--key);
}
.breadcrumb ol {
  justify-content: start;
}
@media screen and (max-width: 767px) {
  .e-lpTtl {
    font-size: min(5vw,20px);
    text-align: center;
  }
}