@charset "utf-8";

/* =============================================
  建築資料研究社のページよりコピー
============================================= */
/*-------------
  共通スタイルシート 調整
--------------*/
.content {
  font-size: 1.6em; /* 基本のフォントサイズ1.6em（16px） */
  line-height: 1.8;
  color: #111;
  overflow: hidden;
}
.content p,
.content ul,
.content ol,
.content li,
.content dl,
.content table,
.content blockquote,
.content address,
.content pre,
.content iframe,
.content form,
.content figure {
  font-size: 16px;
}
h1,h2,h3,h4,h5,h6,th{
  color: #111;
}
.sp_only {
  display: none;
}
.tablet_only {
  display: none;
}
.lead-box {
  padding: 0 3.4rem;
  text-align: left;
}
.lead-box__inner {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}
::before,
::after {
  box-sizing: border-box;
  border-style: solid;
  border-width: 0;
}
.nowrap,
.nowrap_pc,
.nowrap_pc_tablet {
  white-space: nowrap;
}
.stus-main{
  padding-bottom: 0;
}

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

content

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

/* 定義 */
:root {
  /* 背景 */
  --bg-pink: #ffe5e5;
  --bg-blue: #def4fc;
  --bg-green: #d9fcdc;
  --bg-white: #fff;
  --bg-gray: #f1f1f1;
  --bg-yellow: #fffb95;
  /* テキストの色 */
  --txt-pink: #ef5151;
  --txt-blue: #0484b3;
  --txt-green: #038a87;
  --txt-black: #242424;
  --txt-white: #fff;
  --txt-red: #e60012;
  /* タイトル・◎の色 */
  --ttl-pink: #ffaaaa;
  --ttl-blue: #9dd7ee;
  --ttl-gray: #f2f2f2;
  /* テキストのサイズ */
  --txt-size1: max(3.6rem, 26px);
  --txt-size2: max(3.2rem, 24px);
  --txt-size3: max(2.8rem, 22px);
  --txt-size4: max(2.4rem, 20px);
  --txt-size5: max(2.2rem, 19px);
  --txt-size6: max(1.8rem, 18px);
  --txt-size7: max(1.6rem, 16px);
  --txt-size8: max(1.5rem, 14px);
}


.lead-box__inner {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}

.content {
  background-color: var(--bg-gray);
}

/* 文字色 */
.txt-pink {
  color: var(--txt-pink);
}

.txt-blue {
  color: var(--txt-blue);
}

.txt-green {
  color: var(--txt-green);
}

.txt-black {
  color: var(--txt-black);
}

.txt-white {
  color: var(--txt-white);
}

.txt-strong {
  font-weight: bold;
}

.lead-wrap p, 
.lead-wrap ul, 
.lead-wrap ol, 
.lead-wrap dl, 
.lead-wrap table, 
.lead-wrap blockquote, 
.lead-wrap address, 
.lead-wrap pre, 
.lead-wrap iframe, 
.lead-wrap form, 
.lead-wrap figure,
.lead-wrap h1, 
.lead-wrap h2, 
.lead-wrap h3, 
.lead-wrap h4, 
.lead-wrap h5, 
.lead-wrap h6 {
  color: var(--txt-black1);
}

.guideline-contents p, 
.guideline-contents ul, 
.guideline-contents ol, 
.guideline-contents dl, 
.guideline-contents table, 
.guideline-contents blockquote, 
.guideline-contents address, 
.guideline-contents pre, 
.guideline-contents iframe, 
.guideline-contents form, 
.guideline-contents figure,
.guideline-contents h1, 
.guideline-contents h2, 
.guideline-contents h3, 
.guideline-contents h4, 
.guideline-contents h5, 
.guideline-contents h6 {
  color: var(--txt-black1);
}

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

visual-box

--------------*/
.visual-box {
  height: auto;
  background: url(../img/guidebook2025-award/lead-box_bg01.svg) no-repeat bottom center,
            url(../img/guidebook2025-award/visual-box_l_bg01.png) no-repeat left center,
            url(../img/guidebook2025-award/visual-box_r_bg01.png) no-repeat right center;
  background-size: 100% auto, auto 100%, auto 100%;
  padding-bottom: 8rem;
}

.visual-box__title {
  text-align: center;
}

.visual-box__title img {
  width: 100%;
  max-width: 820px;
  height: auto;
  padding: 2.4rem 3.2rem 0;
}

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

lead-box

--------------*/
.lead-section {
  background-color: var(--txt-white);
}

.lead-box__inner {
  max-width: 80rem;
}

.lead-box {
  margin: 0;
  padding: 0 2.4rem;
}

.lead-box__title {
  font-size: var(--txt-size3);
  font-weight: bold;
  padding-top: 8rem;
  text-align: center;
  background: url(../img/guidebook2025-award/lead-title_bg01.svg) no-repeat top 1.6rem center;  url(
  ../img/guidebook2025-award/review-box_bg01.svg) no-repeat bottom align-content: center;
  background-size: 64rem auto;
}

.lead-box__title .line-wave {
  position: relative;
  background: url(../img/guidebook2025/line-wave_ic01.svg) repeat-x center bottom;
  background-size: auto 1.0rem;
  display: inline-block;
  padding-bottom: 1.6rem;
  margin-left: 0.4rem;
}

.lead-box__title .times {
  position: relative;
  padding: 0.2rem 0.6rem 0.2rem 1.6rem;
  font-size: var(--txt-size5);
}

.lead-box__title .times::before,
.lead-box__title .times::after {
  position: absolute;
  right: 0;
  height: 4.8rem;
  content: '';
  width: 100%;
}

.lead-box__title .times::before {
  border-left: solid 3px;
  top: 0;
  transform: rotate(110deg);
}

.lead-box__title .times::after {
  border-right: solid 3px;
  bottom: 0;
  transform: rotate(70deg);
}

.lead-box__unit {
  display: flex;
  justify-content: center;
  align-items: center;
}

.lead-box__unit__txt-cont {margin-top: 1.6rem;}

.lead-box__unit__img-cont {
  width: 100%;
  max-width: 16rem;
  margin-left: 4rem;
  margin-top: 3.2rem;
}

.lead-box__unit__img-cont img {
  width: 100%;
  height: auto;
  transform: rotate(4deg);
}

.lead-box__unit__txt-cont__txt {
  margin-top: 1.6rem;
}

.lead-box__unit__txt-cont__txt .txt-strong {
  font-size: var(--txt-size6);
}

.lead-box__unit__txt-cont__txt .txt-pink,
.lead-box__unit__txt-cont__txt .txt-blue {
  font-size: var(--txt-size6);
  font-weight: bold;
}


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

prize-section

--------------*/
.prize-section {
  background: url(../img/guidebook2025-award/review-box_bg01.svg) no-repeat bottom center, var(--txt-white);
  background-size: 100% auto;
  padding-bottom: 12rem;
}

.prize-title {
  padding-top: 8rem;
  text-align: center;
}

.prize-title img {
  width: 100%;
  max-width: 27.2rem;
  height: auto;
}

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

grand-box

--------------*/
.grand-box {
  background: url(../img/guidebook2025-award/grand-box_bg01.svg) no-repeat top center;
  background-size: 160rem auto;
  padding: 0 2.4rem;
  margin-top: -2.4rem;
}

.grand-box__inner {
  width: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 100%;
  max-width: 88rem;
}

.grand-box__title {
  margin-top: 10.4rem;
  z-index: 1;
}

.grand-box__title img {
  width: 100%;
  max-width: 44rem;
  height: auto;
}

.grand-box__present-unit {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  width: 100%;
  margin-bottom: -25.6rem;
}

.grand-box__comment-txt {
  margin-bottom: 0.8rem;
  width: 100%;
  max-width: 36rem;
}

.grand-box__comment-txt img {
  width: 100%;
  height: auto;
}

.grand-box__book-img {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  background: url(../img/guidebook2025-award/grand-book_l_bg01.svg) no-repeat left 40%,
    url(../img/guidebook2025-award/grand-book_r_bg01.svg) no-repeat right bottom 16%;
  background-size: 5.6rem auto, 5.6rem auto;
  width: 100%;
  max-width: 68rem;
}

.grand-box__book-img img {
  width: 100%;
  max-width: 36rem;
  height: auto;
  box-shadow: 0 0.6rem 1.2rem -0.2rem rgba(0, 0, 0, 0.24), 0 0.3rem 0.7rem -0.3rem rgba(0, 0, 0, 0.3);
}

.grand-box__work-name {
  font-size: var(--txt-size4);
  color: var(--txt-pink);
  font-weight: bold;
  text-align: center;
  margin-top: 3.2rem;
  margin-left: 1.8rem;
}

.grand-box__work-name .line-encircle {
  padding: 0.8rem 3.2rem calc(0.8rem + 10px) 0.8rem;
  display: inline-block;
  position: relative;
  background-color: var(--ttl-gray);
}

.grand-box__work-name .line-encircle::before {
  position: absolute;
  top: -7px;
  left: -7px;
  width: 100%;
  height: 100%;
  content: '';
  border: 3px solid var(--txt-black);
}

.grand-box__work-scool {
  text-align: center;
  margin-top: 1.6rem;
}

.grand-box__comment-unit {
  margin-top: 0.8rem;
  max-width: 80rem;
}

.grand-box__comment-unit__comment {
  font-size: var(--txt-size8);
  position: relative;
  width: fit-content;
  padding: 0 18px 4px 18px;
  margin-top: 2.4rem;
}

.grand-box__comment-unit__comment::before {
  content: "";
  position: absolute;
  bottom: -6px;
  left: 50%;
  width: 100%;
  height: 50%;
  box-sizing: border-box;
  border: 2px solid var(--txt-black);
  border-top: none;
  border-bottom-right-radius: 50px;
  border-bottom-left-radius: 50px;
  translate: -50%;
}

.grand-box__comment-unit__comment::after {
  content: "";
  position: absolute;
  top: calc(100% + 6px);
  left: 32%;
  width: 20px;
  height: 2px;
  box-sizing: border-box;
  background-color: var(--txt-black);
  box-shadow: 0 2px 0 var(--txt-white), 0 -2px 0 var(--txt-white);
  rotate: 50deg;
  translate: -50%;
}

.grand-box__comment-unit__txt {
  margin-top: 2.4rem;
}

.grand-box__present-unit__design-txt {
  display: flex;
  justify-content: space-around;
  align-items: center;
  width: 28rem;
  height: 28rem;
}

.grand-box__present-unit__design-txt .txt-circle {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: solid 4.0rem var(--ttl-pink);
  font-size: var(--txt-size3);
  font-weight: bold;
  text-align: center;
  line-height: 1.6;
}

.grand-box__present-unit__money-txt {
  display: flex;
  justify-content: space-around;
  align-items: center;
  width: 22rem;
  height: 22rem;
  margin-right: 6.4rem;
}

.grand-box__present-unit__money-txt .txt-circle {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: solid 3.8rem var(--ttl-pink);
  font-size: var(--txt-size4);
  font-weight: bold;
  text-align: center;
  line-height: 1.5;
}

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

judge-box

--------------*/
.judge-box {
  background: url(../img/guidebook2025-award/judge-box_bg01.svg) no-repeat top center;
  background-size: 160rem auto;
}

.judge-box__inner {
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 100%;
  max-width: 88rem;
}

.judge-box {
  padding: 0 2.4rem;
  margin-top: 6.4rem;
}

.judge-box__title {
  margin-top: 10.4rem;
  z-index: 1;
}

.judge-box__title img {
  width: 100%;
  max-width: 38rem;
  height: auto;
}

.judge-box__present-unit {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  width: 100%;
  margin-bottom: -19.2rem;
}

.judge-box__comment-txt {
  margin-top: -24rem;
}

.judge-box__book-img {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  background: url(../img/guidebook2025-award/judge-book_l_bg01.svg) no-repeat left 40%,
    url(../img/guidebook2025-award/judge-book_r_bg01.svg) no-repeat right bottom 16%;
  background-size: 5.6rem auto, 5.6rem auto;
  width: 100%;
  max-width: 68rem;
}

.judge-box__book-img img {
  width: 100%;
  max-width: 36rem;
  height: auto;
  box-shadow: 0 0.6rem 1.2rem -0.2rem rgba(0, 0, 0, 0.24), 0 0.3rem 0.7rem -0.3rem rgba(0, 0, 0, 0.3);
}

.judge-box__work-name {
  font-size: var(--txt-size4);
  color: var(--txt-blue);
  font-weight: bold;
  text-align: center;
  margin-top: 3.2rem;
  margin-left: 1.8rem;
}

.judge-box__work-name .line-encircle {
  padding: 0.8rem 3.2rem calc(0.8rem + 10px) 0.8rem;
  display: inline-block;
  position: relative;
  background-color: var(--ttl-gray);
}

.judge-box__work-name .line-encircle::before {
  position: absolute;
  top: -7px;
  left: -7px;
  width: 100%;
  height: 100%;
  content: '';
  border: 3px solid var(--txt-black);
}

.judge-box__work-scool {
  text-align: center;
  margin-top: 1.6rem;
}

.judge-box__comment-unit {
  margin-top: 0.8rem;
  max-width: 80rem;
}

.judge-box__comment-unit__comment {
  font-size: var(--txt-size8);
  position: relative;
  width: fit-content;
  padding: 0 18px 6px 18px;
  margin-top: 3.2rem;
}

.judge-box__comment-unit__comment::before {
  content: "";
  position: absolute;
  bottom: -6px;
  left: 50%;
  width: 100%;
  height: 50%;
  box-sizing: border-box;
  border: 2px solid #333333;
  border-top: none;
  border-bottom-right-radius: 50px;
  border-bottom-left-radius: 50px;
  translate: -50%;
}

.judge-box__comment-unit__comment::after {
  content: "";
  position: absolute;
  top: calc(100% + 6px);
  left: 32%;
  width: 20px;
  height: 2px;
  box-sizing: border-box;
  background-color: #333333;
  box-shadow: 0 2px 0 #ffffff, 0 -2px 0 #ffffff;
  rotate: 50deg;
  translate: -50%;
}

.judge-box__comment-unit__txt {
  margin-top: 2.4rem;
}

.judge-box__present-unit__design-txt {
  display: flex;
  justify-content: space-around;
  align-items: center;
  width: 28rem;
  height: 28rem;
}

.judge-box__present-unit__design-txt .txt-circle {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: solid 40px var(--ttl-pink);
  font-size: var(--txt-size3);
  font-weight: bold;
  text-align: center;
  line-height: 1.6;
}

.judge-box__present-unit__money-txt {
  display: flex;
  justify-content: space-around;
  align-items: center;
  width: 22rem;
  height: 22rem;
  margin-right: 6.4rem;
}

.judge-box__present-unit__money-txt .txt-circle {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: solid 3.8rem var(--ttl-blue);
  font-size: var(--txt-size4);
  font-weight: bold;
  text-align: center;
  line-height: 1.5;
}

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

review-box

--------------*/
.review-section {
  background-color: var(--bg-green);
}

.review-box {
  padding: 0 2.4rem 5rem;
}

.review-box__inner {
  width: 100%;
  max-width: 88rem;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.review-box__unit {
  background-color: var(--bg-white);
  padding: 2.4rem 4.0rem 4.0rem;
  border-radius: 2.4rem;
  margin-top: 2.4rem;
}

.review-box__title {
  font-size: var(--txt-size3);
  font-weight: bold;
  background: url(../img/guidebook2025-award/review-title_l_bg01.svg) no-repeat left center, url(../img/guidebook2025-award/review-title_r_bg01.svg) no-repeat right center;
  background-size: auto 4.8rem;
  padding: 1.6rem 4.0rem;
  margin-top: 4rem;
}

.review-box__txt {
  margin-top: 1.6rem;
}

.review-box__name {
  margin-top: 3.2rem;
  text-align: right;
}

/*============

media queries

=============*/

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

タブレット・スマホ

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

@media (max-width: 959px) {
  /* visual-box */
    .visual-box {
      padding-bottom: 6.4rem;
  }

  /* lead-box */
  .lead-box__title {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding-top: 5.6rem;
    background-size: 88% auto;
  }

  .lead-box__title .times {
    display: inline-block;
    padding: 0.8rem 2.4rem 0;
    line-height: 1.2;
    margin-bottom: 0.4rem;
  }

  .lead-box__title .times::before, .lead-box__title .times::after {
    position: absolute;
    height: 1.2em;
    content: '';
    width: auto;
    bottom: 0;
  }

  .lead-box__title .times::before {
    transform: rotate(-30deg);
    left: 0;
    top: unset;
    right: unset;
  }

  .lead-box__title .times::after {
    transform: rotate(30deg);
    right: 0;
  }

  .lead-box__title .line-wave {
    background-size: auto 0.8rem;
    margin-left: 0;
  }

  .lead-box__unit {
    flex-direction: column;
  }

  .grand-box__title img {
    max-width: 40rem;
  }

  .judge-box__title img {
    max-width: 34rem;
  }

  .grand-box__present-unit__design-txt {
    width: 24rem;
    height: 24rem;
  }
  
  .grand-box__present-unit__money-txt {
    margin-right: 0;
    width: 20rem;
    height: 20rem;
  }

  .grand-box__present-unit {
    margin-bottom: -23.2rem;
  }

  /* judge-box */
  .judge-box__present-unit__money-txt {
    margin-right: 0;
  }

  /* review-box */
  .review-box__name {
    text-align: left;
  }

}

@media (max-width: 797px) {
  /* grand-box */
  .grand-box__present-unit {
    margin-bottom: -2.4rem;
    margin-top: -1.6rem;
  }

  /* judge-box */
  .judge-box__present-unit {
    margin-bottom: -4.8rem;
    margin-top: -2.4rem;
  }
}



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

スマホ

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

@media (max-width: 519px) {
  .grand-box__present-unit__design-txt {
    width: 44vw;
    height: 44vw;
  }

  .grand-box__present-unit__money-txt,
  .judge-box__present-unit__money-txt {
    width: 40vw;
    height: 40vw;
  }

  /* grand-box
    judge-box */
  .grand-box__book-img,
  .judge-box__book-img {
      background-image: none;
  }

  .grand-box__present-unit__design-txt .txt-circle,
  .grand-box__present-unit__money-txt .txt-circle,
  .judge-box__present-unit__money-txt .txt-circle {
    line-height: 1.4;
    border-width: 6.4vw;
  }

  .grand-box__comment-txt,
  .judge-box__comment-txt {
    max-width: none;
  }

  .grand-box__work-scool,
  .judge-box__work-scool {
    text-align: left;
  }

}