@charset "utf-8";

/* =============================================
  建築資料研究社のページよりコピー
============================================= */
/*-------------
建築資料研究社cmnなど調整
--------------*/
.content {
  font-size: 1.6em; /* 基本のフォントサイズ1.6em（16px） */
  line-height: 1.8;
  color: #111;
}
.content p,
.content ul,
.content ol,
.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;
}

/*============

guidebook-award-2023.css

=============*/

/*============

Layout

=============*/

/*-------------

content

--------------*/

.content {
  padding-bottom: 5em;
	background: url(../img/visual-box_bg01.png) repeat center top 0rem, #faf6e6;
	background-size: 120rem auto;
}

/*-------------

visual-box

--------------*/

.visual-box {
	height: auto;
}

.visual-box__switch-img {
	display: block;
	text-align: center;
}

.visual-box__switch-img img {
	width: 100%;
	max-width: 680px;
	height: 100%;
	object-fit: cover;
	padding: 1.6rem 3.2rem 0;
}


/*-------------

lead-box

--------------*/

.lead-box__wraper {
	position: relative;
	overflow: hidden;
	margin-top: -8rem;
}

.lead-box__wrap {
	background: url(../img/lead_box_shape_bg01.svg) no-repeat center top 16rem;
	background-size: 1040px auto;
	position: relative;
}

.lead-box__wraper:before {
	position: absolute;
	content: "";
	top: 10rem;
	left: -16rem;
	right: -16rem;
	height: calc(100% + 12rem);
	background: url(../img/lead-box_bg01.png) repeat top center;
	transform: rotate(-6deg);
	z-index: 0;
}

.lead-box__inner {
	padding: 20rem 0 16rem;
}

.lead-box__title {
	position: relative;
	font-size: max(3.2rem, 28px);
	font-weight: bold;
	padding-top: 8.8rem;
	text-align: center;
}

.lead-box__title small.nowrap {
    font-size: max(3.0rem, 26px);
}

.lead-box__title::before {
	position: absolute;
	content: "";
	top: 0;
	left: 0;
	background-image: url(../img/lead-box_title_im01.svg);
	background-repeat: no-repeat;
	background-size: auto 7.2rem;
	background-position: top center;
	width: 100%;
	height: 7.2rem;
}

.lead-box__txt {
    text-align: center;
    margin-top: 1rem;
}

.lead-box__title__large-txt {
	position: relative;
	margin-top: 2.4rem;
	font-size: max(5.6rem, 40px);
	font-weight: bold;
	padding-left: 6.6rem;
}

.lead-box__large-txt {
	font-size: max(2.0rem, 20px);
	font-weight: bold;
	text-align: center;
	margin-top: 2.4rem;
}

.lead-box__large-txt + .lead-box__txt {
	margin-top: 2.4rem;
}

.lead-box__large-txt__line {
	font-weight: bold;
	background: linear-gradient(transparent 80%, #ffd51e 0%);
}

.lead-box__title + .lead-box__txt {
	margin-top: 2.4rem;
}

.lead-box__img {
    text-align: center;
    margin-top: 1.6rem;
}

.lead-box__img img {
    width: 100%;
    max-width: 32rem;
}

/*-------------

grand-unit

--------------*/

.grand-unit {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	background-color: #fff;
	border: solid 1.6rem #fed953;
	padding: 0 3.2rem 4.8rem;
	width: 100%;
	max-width: 880px;
	margin: 6.4rem auto 0;
	flex-direction: column;
}

.grand-unit__title {
	text-align: center;
	padding: 4.0rem 2.4rem 0;
}

.grand-unit__title img {
    height: auto;
    width: 100%;
    max-width: 34rem;
}



.grand-unit__catch-cont__catch {
	position: relative;
	padding: 0.4rem 3.2rem 0.8rem;
	text-align: center;
	line-height: 1.6;
	color: #7f7f7f;
	font-size: max(1.5rem, 14px);
	margin-top: 2.4rem;
	margin-bottom: 0.8rem;
}

.grand-unit__catch-cont__catch::before {
	position: absolute;
	left: 0;
	top: 0;
	content: "";
	width: 2px;
	height: 100%;
	background: #fed953;
	border-radius: 5px;
	transform: rotate(-35deg);
}

.grand-unit__catch-cont__catch::after {
	position: absolute;
	content: "";
	right: 0;
	top: 0;
	width: 2px;
	height: 100%;
	background-color: #fed953;
	border-radius: 5px;
	transform: rotate(35deg);
}

.grand-unit__prize {
	font-size: max(2.6rem, 22px);
	font-weight: bold;
	margin-top: 2.4rem;
	border-bottom: dashed 2px #fed953;
	padding-bottom: 1.2rem;
	text-align: center;
}

.grand-unit__catch-cont {
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

.grand-unit__catch-cont__mark {
    width: 14rem;
    height: auto;
    margin: -5.6rem 6rem 0 -19rem;
}

.grand-unit__book-img {
	margin-top: 0.8rem;
}

.grand-unit__book-img img {
	box-shadow: 0 0.6rem 1.2rem -0.2rem rgba(50, 50, 93, 0.25), 0 0.3rem 0.7rem -0.3rem rgba(0, 0, 0, 0.3); /* #22 */
	width: 100%;
	max-width: 36rem;
}

.grand-unit__work-title {
	font-size: max(2.8rem, 22px);
	font-weight: bold;
	margin-top: 2.4rem;
}

.grand-unit__work-name {
	font-size: max(2.4rem, 20px);
	font-weight: bold;
	text-align: center;
	line-height: 1.5;
}


.grand-unit__work-name__scool {
	font-size: max(1.8rem, 16px);
	display: block;
}

.grand-unit__concept,
.grand-unit__comment {
	color: #7f7f7f;
	font-weight: bold;
	position: relative;
	margin-top: 2.4rem;
	padding: 0.4rem 0 0 3.0rem;
}

.grand-unit__concept::before,
.grand-unit__comment::before {
	position: absolute;
	content: "";
	top: 0;
	left: 0;
}

.grand-unit__concept::before {
	background: url(../img/grand-flag_ic01.png) no-repeat bottom right;
	background-size: auto 2.4rem;
	width: 2.4rem;
	height: 100%;
}

.grand-unit__comment::before {
	background: url(../img/grand-comment_ic01.png) no-repeat bottom left;
	background-size: 2.2rem auto;
	width: 2.2rem;
	height: 100%;
}

.grand-unit__txt {
	margin-top: 1.2rem;
}

/*-------------

special-unit

--------------*/

.special-unit {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	background-color: #fff;
	border: solid 1.6rem #d1d1d1;
	padding: 0 3.2rem 4.8rem;
	width: 100%;
	max-width: 880px;
	margin: 6.4rem auto 0;
	flex-direction: column;
}

.special-unit__title {
	text-align: center;
	padding: 4.0rem 2.4rem 0;
}

.special-unit__title img {
	height: auto;
	width: 100%;
	max-width: 20rem;
}


.special-unit__catch {
	position: relative;
	padding: 0.4rem 3.2rem 0.8rem;
	text-align: center;
	line-height: 1.6;
	color: #7f7f7f;
	font-size: max(1.5rem, 14px);
	margin-top: 2.4rem;
}

.special-unit__catch::before {
	position: absolute;
	left: 0;
	top: 0;
	content: "";
	width: 2px;
	height: 100%;
	background: #fed953;
	border-radius: 5px;
	transform: rotate(-35deg);
}

.special-unit__catch::after {
	position: absolute;
	content: "";
	right: 0;
	top: 0;
	width: 2px;
	height: 100%;
	background-color: #fed953;
	border-radius: 5px;
	transform: rotate(35deg);
}

.special-unit__prize {
	font-size: max(2.2rem, 20px);
	font-weight: bold;
	margin-top: 2.4rem;
	border-bottom: dashed 2px #d1d1d1;
	padding-bottom: 1.2rem;
	text-align: center;
}

.special-unit__book-img {
	margin-top: 3.2rem;
}

.special-unit__book-img img {
	box-shadow: 0 0.6rem 1.2rem -0.2rem rgba(50, 50, 93, 0.25), 0 0.3rem 0.7rem -0.3rem rgba(0, 0, 0, 0.3); /* #22 */
	width: 100%;
	max-width: 36rem;
}

.special-unit__work-title {
	font-size: max(2.8rem, 22px);
	font-weight: bold;
	margin-top: 2.4rem;
}

.special-unit__work-name {
	font-size: max(2.4rem, 20px);
	font-weight: bold;
	text-align: center;
	line-height: 1.5;
}


.special-unit__work-name__scool {
	font-size: max(1.8rem, 16px);
	display: block;
}

.special-unit__concept,
.special-unit__comment {
	color: #7f7f7f;
	font-weight: bold;
	position: relative;
	margin-top: 2.4rem;
	padding: 0.6rem 0 0 3.0rem;
}

.special-unit__concept::before,
.special-unit__comment::before {
	position: absolute;
	content: "";
	top: 0;
	left: 0;
}

.special-unit__concept::before {
	background: url(../img/special-flag_ic01.png) no-repeat bottom right;
	background-size: auto 2.4rem;
	width: 2.4rem;
	height: 100%;
}

.special-unit__comment::before {
	background: url(../img/special-comment_ic01.png) no-repeat bottom left;
	background-size: 2.2rem auto;
	width: 2.2rem;
	height: 100%;
}

.special-unit__txt {
	margin-top: 1.2rem;
}

/*-------------

category-box

--------------*/

.overview-section {
	position: relative;
	overflow: hidden;
	margin-top: -12rem;
	background: url(../img/overview-section_bg01.svg) no-repeat center top 12rem,
						url(../img/overview-section_bg02.svg) no-repeat center center,
						url(../img/overview-section_bg03.svg) no-repeat center bottom 8rem;
	background-size: 1600px auto;
}

.overview-section .section:before {
	position: absolute;
	top: 0;
	left: 0;
	height: 0;
	content: "";
	border-style: solid;
	border-width: 12rem 0 0 100vw;
	border-color: transparent #faf6e6 transparent;
}

.category-title {
	font-size: max(2.6rem, 22px);
	font-weight: bold;
	text-align: center;
	padding-top: 8rem;
}

.category-title__large-txt {
	font-weight: bold;
	font-size: max(3.2rem, 20px);
	margin-top: 1.6rem;
	background: url(../img/category-title_large-txt_bg01.png) repeat-x center bottom;
	background-size: 2.4rem auto;
	padding: 0 4rem 1.6rem;
	display: inline-block;
}

.content-third-title:before {
	background-color: #faf6e6;
}

.category-box:first-of-type {
	margin-top: 6rem;
}

.tel-link {
	font-size: max(2.2rem, 20px);
}

.tel-link span:before {
	top: 0.5rem;
}

/*-------------

review-unit

--------------*/

.review-unit__title {
	font-size: max(2.6rem, 22px);
	font-weight: bold;
	text-align: center;
	padding-top: 4.8rem;
}

.review-unit__txt {
	margin-top: 1rem;
}

.review-unit__title + .review-unit__txt {
	margin-top: 2.4rem;
}

.review-unit {
	background-color: #fff;
	padding: 0 4.8rem 5.6rem;
	width: 100%;
	max-width: 880px;
	margin: 6.4rem auto 0;
}

.review-unit__name {
	margin-top: 3.2rem;
	text-align: right;
}

/*============

media queries

=============*/

/*-------------

タブレット・スマホ

--------------*/

@media (max-width: 959px) {
	/* lead-box */
	.lead-box__wrap {
		background-size: 100% auto;
	}

	.overview-section {
		background-size: 100% auto;
	}

	.lead-box__txt,
	.lead-box__large-txt {
		text-align: left;
	}
}

/*-------------

スマホ

--------------*/

@media (max-width: 519px) {
  /*-------------
  建築資料研究社cmnなど調整
  --------------*/
  .pc_tablet_only {
    display: none;
  }
  .tablet_only {
    display: none;
  }
  .sp_only {
    display: block;
  }

	.visual-box__switch-img img {
		max-width: 400px;
	}

	.grand-unit__title__img img {
		max-width: none;
	}

	.grand-unit__catch-cont__catch {
		padding: 0.4rem 2.4rem 0.8rem;
	}

	.grand-unit__catch-cont__catch::before {
		transform: rotate(-20deg);
	}

	.grand-unit__catch-cont__catch::after {
		transform: rotate(20deg);
	}

	/* lead-box__title */
	.lead-box__title__large-txt {
		padding-left: 0;
		padding-top: 8.4rem;
	}

	.lead-box__title__large-txt:before {
		left: 0;
		right: 0;
	}

	.review-unit__name {
		text-align: left;
	}

	.grand-unit__catch-cont__mark {
			margin: -1.6rem 2rem 0 -2rem;
	}

	.category-box:first-of-type {
			margin: 6rem -2.4rem 0;
	}

	.review-unit {
		border-left: solid 1.6rem #faf6e6;
		border-right: solid 1.6rem #faf6e6;
		padding: 0 3.2rem 5.6rem;
	}
}
