@charset "utf-8";
/*
Theme Name: kanal-paint
Theme URI: https://kanal-paint.jp/
Description: pcbrain
Version: 1.0
Author: pcbrain.co.jp
*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400..900&family=Roboto:wght@700&display=swap');
@import url("css/default.css");
@import url("setting.css");
@import url("css/module.css");

html {
	scroll-padding-top: 145px;
}

body {
	padding-top: 145px;
}

@media (max-width: 1150px) {
	body {
		padding-top: 100px;
	}

	html {
		scroll-padding-top: 100px;
	}
}

/*--------------------
ヘッダー
--------------------*/
header {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
	background: #FFFFFF;
	width: 100%;
}

header .hdrLogo {
	display: flex;
	gap: 20px;
	align-items: center;
	margin-left: 40px;
    display: flex;
    line-height: 1.2;
    max-width: 816px;
}

header .hdrLogo a {
    /* width: 248px; */
    /* height: auto; */
    display: block;
    flex-shrink: 0;
}

header .hdrLogo h1,
header .hdrLogo p {
	font-size: 13px;
	font-size: 1.3rem;
	font-weight: 500;
}

@media (max-width: 1618px) {
	
    header .hdrLogo h1,
    header .hdrLogo p {
        max-width: 400px;
    }
}


header .hdrContact {
	display: flex;
	justify-content: flex-end;
	margin-right: 40px;
	gap: 24px;
}

header .hdrContact .tel {
	line-height: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 3px;
}

header .hdrContact .tel strong {
	font-family: "Roboto", sans-serif;
	font-weight: 700;
	font-size: 30px;
	font-size: 3rem;
	display: flex;
	align-items: center;
	gap: 5px;
}

header .hdrContact .tel strong::before {
	content: '';
	display: block;
	width: 25px;
	height: 25px;
	background: url(./img/ico_fdl_b.png) no-repeat 50%;
	background-size: contain;
}

header .hdrContact .tel .time {
	font-size: 14px;
	font-size: 1.4rem;
}

header .hdrBtnTel,
header .hdrBtnMenu {
	display: none;
}

header .hdrBtn {
	display: flex;
	gap: 10px;
	height: 80px;
}

header .hdrBtn li a,
header .hdrBtn li div {
	width: 140px;
	height: 70px;
	display: flex;
	flex-direction: column;
	align-items: center;
	letter-spacing: .04em;
	font-weight: 700;
	color: #222222;
	border-radius: 0 0 5px 5px;
	padding-top: 15px;
	background-color: #f6ca44;
	position: relative;
	transition: 0.3s ease-out;
}

header .hdrBtn li a:hover {
	height: 80px;
}

header .hdrBtn li a::before {
	content: '';
	width: 20px;
	height: 20px;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 50%;
	display: block;
}

header .hdrBtn li.hdrBtnEvent a::before {
	background-image: url(./img/hdr_ico_event.png);
}

header .hdrBtn li.hdrBtnShowroom a::before {
	background-image: url(./img/hdr_ico_calendar.png);
}

header .hdrBtn li.hdrBtnContact a::before {
	background-image: url(./img/hdr_ico_mail.png);
}

header .hdrBtn li.hdrBtnTel a::before {
	background-image: url(./img/hdr_ico_tel.png);
}

@media (max-width: 1550px) {
	header .hdrLogo {
		margin-left: 20px;
		gap: 20px;
	}

	header .hdrContact {
		margin-right: 20px;
		gap: 20px;
	}

	header .hdrBtn li a,
	header .hdrBtn li div {
		width: 130px;
	}
}

@media (max-width: 1400px) {

	/* header .hdrLogo h1,
	header .hdrLogo p {
		width: 200px;
	} */
}

@media (max-width: 1382px) {

	header .hdrLogo h1,
	header .hdrLogo p {
		display: none;
	}
}

@media (max-width: 1150px) {
	header .hdrLogo {
		width: 170px;
		margin: 0 auto;
		height: 50px;
	}

	header .hdrBtn {
		gap: 1px;
		height: auto;
		width: 100%;
	}

	header .hdrContact {
		margin: 0;
		width: 100%;
	}

	header .hdrBtn li {
		width: calc((100% - 50px - 3px) / 3);
	}

	header .hdrBtn li.hdrBtnMenu {
		width: 50px;
	}

	header .hdrBtn li a::before {
		width: 16px;
		height: 16px;
	}

	header .hdrBtn li a,
	header .hdrBtn li div.spmenuBtn {
		width: 100%;
		height: 50px;
		font-size: 14px;
		font-size: 1.4rem;
		letter-spacing: normal;
		border-radius: 0;
		padding-top: 8px;
	}

	header .hdrBtn li a:hover,
	header .hdrBtn li div.spmenuBtn:hover {
		height: 50px;
	}

	header .hdrBtn li:last-child div.spmenuBtn {
		width: 50px;
		background-color: #222222;
		color: #FFFFFF;
		font-size: 10px;
		line-height: 1;
		padding-top: 9px;
		gap: 5px;
		position: relative;
	}

	header .hdrBtn li:last-child div.spmenuBtn span:nth-child(n+1):nth-child(-n+3) {
		background-color: #FFFFFF;
		display: block;
		height: 3px;
		width: 30px;
	}

	header .hdrBtn li:last-child div.spmenuBtn::before {
		content: none;
	}

	header .hdrContact .tel {
		display: none;
	}

	header .hdrBtnContact {
		display: none;
	}

	header .hdrBtnTel,
	header .hdrBtnMenu {
		display: block;
	}

	header .spmenuBtn span {
		transition: 0.3s ease-out;
	}

	header .spmenuBtn.active span:nth-child(1) {
		transform: translateY(8px) rotate(45deg);
	}

	header .spmenuBtn.active span:nth-child(2) {
		visibility: hidden;
		opacity: 0;
	}

	header .spmenuBtn.active span:nth-child(3) {
		transform: translateY(-8px) rotate(-45deg);
	}

	header .spmenuBtn span:last-child::before {
		content: 'MENU';
	}

	header .spmenuBtn.active span:last-child::before {
		content: 'CLOSE';
	}
}

@media (max-width: 599px) {

	header .hdrLogo h1,
	header .hdrLogo p {
		display: block;
	}
}

/*--------------------
　グローバルナビゲーション（PC）
--------------------*/
header nav {
	width: 100%;
	margin: 15px 0 10px;
}

header nav #gNavSp {
	display: none;
}

header nav #gNav {
	display: flex;
	justify-content: center;
}

header nav #gNav li {
	position: relative;
}

header nav #gNav li a {
	letter-spacing: .04em;
	height: 40px;
	display: block;
	padding: 8px 17px 0;
	position: relative;
	font-weight: 700;
	color: #222222;
	transition: 0.3s ease-out;
}

header nav #gNav>li>a:hover {
	color: #f67644;
}

header nav #gNav>li+li>a::before {
	content: "";
	position: absolute;
	width: 1px;
	height: 40px;
	background: #CCCCCC;
	left: 0;
	top: 0;
}

header nav #gNav>li>ul {
	visibility: hidden;
	opacity: 0;
	transition: 0.3s ease-out;
	position: absolute;
	z-index: 10;
	width: calc(100% - 1px);
	left: 1px;
}

header nav #gNav>li:hover>ul {
	visibility: visible;
	opacity: 1.0;
}

header nav #gNav>li li a {
	padding: 10px 18px 10px;
	color: #FFFFFF;
	background-color: rgba(0, 0, 0, 0.8);
	line-height: 1;
	font-size: 15px;
	font-size: 1.5rem;
}

header nav #gNav>li li a:hover {
	color: #f6ca44;
}

header nav #gNav>li li+li a {
	border-top: solid 1px #bbbbbb;
}

@media (max-width: 1230px) {
	header nav #gNav li a {
		font-size: 1.25vw;
	}
}

@media (max-width: 1150px) {
	header nav #gNav {
		display: none;
	}

	header nav {
		z-index: 10;
		position: absolute;
		top: 100px;
		background-color: #eeeeee;
		margin: 0;
		padding: 0 0 0 0;
		visibility: hidden;
		opacity: 0;
		transition: 0.3s ease-out;
	}

	header nav.active {
		visibility: visible;
		opacity: 1;
	}

	header nav #gNav {
		display: none;
	}

	header nav #gNavSp {
		display: block;
		padding: 20px 20px 20px;
		overflow-y: auto;
		height: calc(100dvh - 100px);
	}

	header nav #gNavSp .tel {
		line-height: 1;
	}

	header nav #gNavSp .tel a {
		display: block;
		color: #FFFFFF !important;
		background: #f67644;
		border: solid 2px #f67644;
		padding: 10px 10px 10px 10px;
		border-radius: 5px;
		box-shadow: 0 4px #dadada;
		position: relative;
		transition: 0.4s ease;
	}

	header nav #gNavSp .tel a strong {
		color: #FFFFFF !important;
	}

	header nav #gNavSp .tel a strong::before {
		background: url(./img/ico_tel_o.png) no-repeat #FFFFFF 50%;
		background-size: 0.5em;
	}

	header nav #gNavSp .tel em.note {
		font-size: 12px;
		font-size: 1.2rem;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	header nav #gNavSp .tel em.note::before,
	header nav #gNavSp .tel em.note::after {
		content: "";
		background-color: #FFFFFF;
		height: 1px;
		width: 15px;
	}

	header nav #gNavSp .tel em.note::before {
		margin-right: 5px;
		transform: rotate(60deg);
	}

	header nav #gNavSp .tel em.note::after {
		margin-left: 5px;
		transform: rotate(-60deg);
	}

	header nav #gNavSp .tel strong {
		font-size: 33px;
		font-size: 3.3rem;
		margin-top: 5px;
	}

	header nav #gNavSp .tel .time {
		font-size: 14px;
		font-size: 1.4rem;
		margin-top: 5px;
		color: #FFFFFF;
	}

	header nav #gNavSp .mainNav ul {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 10px;
		margin-top: 14px;
	}

	header nav #gNavSp .mainNav li.gNavHome {
		grid-column: 1 / 3;
	}

	header nav #gNavSp .mainNav li:nth-last-child(3) {
		grid-row: 5 / 7;
	}

	header nav #gNavSp .mainNav li a {
		text-align: center;
		height: 100%;
		background-color: #FFFFFF;
		color: #222222;
		font-size: 14px;
		font-size: 1.4rem;
		font-weight: 500;
		display: flex;
		flex-flow: column;
		justify-content: center;
		align-items: center;
		padding: 10px 0;
		border-radius: 5px;
		line-height: 1.3;
	}

	header nav #gNavSp .mainNav li.gNavHome a {
		flex-flow: row;
	}

	header nav #gNavSp .mainNav li.gNavBlog a,
	header nav #gNavSp .mainNav li.gNavCorporate a {
		flex-flow: row;
		padding: 5px 0;
	}

	header nav #gNavSp .mainNav li a::before {
		content: '';
		width: 15px;
		height: 15px;
		background-size: contain;
		background-repeat: no-repeat;
		background-position: 50% 50%;
		display: block;
		margin: 0 auto 3px;
	}

	header nav #gNavSp .mainNav li.gNavHome a::before {
		background-image: url(./img/gnav_sp_home.png);
		display: inline-block;
		margin: 0 5px 0 0;
	}

	header nav #gNavSp .mainNav li.gNavReason a::before {
		background-image: url(./img/gnav_sp_reason.png);
	}

	header nav #gNavSp .mainNav li.gNavFirst a::before {
		background-image: url(./img/gnav_sp_first.png);
	}

	header nav #gNavSp .mainNav li.gNavMenu a::before {
		background-image: url(./img/gnav_sp_menu.png);
	}

	header nav #gNavSp .mainNav li.gNavDiagnosis a::before {
		background-image: url(./img/gnav_sp_diagnosis.png);
	}

	header nav #gNavSp .mainNav li.gNavWorks a::before {
		background-image: url(./img/gnav_sp_works.png);
	}

	header nav #gNavSp .mainNav li.gNavVoice a::before {
		background-image: url(./img/gnav_sp_voice.png);
	}

	header nav #gNavSp .mainNav li.gNavShowroom a::before {
		background-image: url(./img/gnav_sp_showroom.png);
	}

	header nav #gNavSp .mainNav li.gNavBlog a::before {
		background-image: url(./img/gnav_sp_blog.png);
		display: inline-block;
		margin: 0 5px 0 0;
	}

	header nav #gNavSp .mainNav li.gNavCorporate a::before {
		background-image: url(./img/gnav_sp_corporate.png);
		display: inline-block;
		margin: 0 5px 0 0;
	}

	header nav #gNavSp .textNav {
		margin-top: 10px;
	}

	header nav #gNavSp .textNav li a {
		color: #222222;
		font-size: 14px;
		font-size: 1.4rem;
		font-weight: 500;
		display: inline-block;
		padding: 0 0 0 20px;
		position: relative;
	}

	header nav #gNavSp .textNav li a::before {
		content: '';
		width: 14px;
		height: 14px;
		border-radius: 50vh;
		background: #222222;
		position: absolute;
		top: 4px;
		left: 0;
	}

	header nav #gNavSp .textNav li a::after {
		content: '';
		width: 6px;
		height: 6px;
		border-top: solid 2px #FFFFFF;
		border-right: solid 2px #FFFFFF;
		transform: rotate(45deg);
		position: absolute;
		top: 8px;
		left: 3px;
	}

	header nav #gNavSp .btnNav {
		margin-top: 10px;
	}

	header nav #gNavSp .btnNav li+li {
		margin-top: 10px;
	}

	header nav #gNavSp .btnNav li img {
		width: 100%;
	}

	header nav #gNavSp .btnNav li.gNavLine a {
		color: #FFFFFF;
		background: #06c755;
		border: solid 2px #06c755;
		border-radius: 5px;
		font-size: 18px;
		font-size: 1.8rem;
		font-weight: 700;
		padding: 3px 10px;
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 10px;
	}

	header nav #gNavSp .btnNav li.gNavLine a::before {
		content: '';
		width: 40px;
		height: 40px;
		background-image: url(./img/ico_line.png);
		background-repeat: no-repeat;
		background-position: 50%;
		background-size: contain;
	}

	header nav #gNavSp .close {
		margin-top: 10px;
		text-align: center;
	}

	header nav #gNavSp .close .closeBtn {
		color: #222222;
		font-size: 26px;
		font-size: 2.6rem;
		font-weight: bold;
		line-height: 1;
		width: 40px;
		margin: 0 auto;
	}

	header nav #gNavSp .close .closeBtn::after {
		content: 'CLOSE';
		display: block;
		font-size: 10px;
		font-size: 1.0rem;
	}
}

@media (max-width: 374px) {
	header nav #gNavSp .mainNav li a {
		font-size: 11.5px;
		font-size: 3.6vmin;
	}
}

/*--------------------
GoogleReview（ヘッダー）
--------------------*/
.hdrReviewBox .reviewBox {
	width: 100%;
	display: flex;
	justify-content: center;
	gap: 40px;
	font-weight: 700;
	padding: 15px 0 20px 0;
}

.hdrReviewBox .grw-slider,
.hdrReviewBox .wp-google-stars,
.hdrReviewBox .wp-google-powered {
	display: none !important;
}

.hdrReviewBox .reviewBox a {
	color: #222222 !important;
}

.hdrReviewBox .reviewBox>ul {
	display: flex;
	justify-content: space-between;
	gap: 40px;
}

.hdrReviewBox .reviewBox>ul li {
	display: flex;
	justify-content: space-between;
	white-space: nowrap;
	gap: 5px;
}

.hdrReviewBox .reviewBox>ul li .wp-google-rating {
	color: #f67644 !important;
	font-size: 16px !important;
	font-size: 1.6rem !important;
	font-family: "Noto Sans JP", sans-serif !important;
}

.hdrReviewBox .reviewBox>ul li .wp-google-rating::before {
	content: '★';
	color: #f67644;
}

.hdrReviewBox .wp-gr,
.reviewBox .wp-gr {
	padding-bottom: 0 !important;
	width: unset !important;
}

.hdrReviewBox .wp-gr .wp-google-right {
	display: unset !important;
}

.hdrReviewBox .reviewBox .gr_logo span:nth-of-type(2) {
	position: relative;
	padding: 0 25px 0 0;
}

.hdrReviewBox .reviewBox .gr_logo span:nth-of-type(2):before {
	content: '';
	width: 20px;
	height: 20px;
	border-radius: 50vh;
	background: #222222;
	position: absolute;
	top: 2px;
	right: 0;
}

.hdrReviewBox .reviewBox .gr_logo span:nth-of-type(2)::after {
	content: '';
	width: 8px;
	height: 8px;
	border-right: solid 2px #FFFFFF;
	border-bottom: solid 2px #FFFFFF;
	transform: rotate(45deg);
	position: absolute;
	top: 7px;
	right: 6px;
}

@media (max-width: 599px) {
	.hdrReviewBox .reviewBox {
		flex-wrap: wrap;
		gap: 5px 10px;
		font-size: 14px !important;
		font-size: 1.4rem !important;
		padding: 10px 0;
		background-color: #f6f6f6;
		margin: 0;
	}

	.hdrReviewBox .reviewBox .gr_logo span:nth-of-type(2) {
		padding: 0 20px 0 0;
	}

	.hdrReviewBox .reviewBox .gr_logo span:nth-of-type(2):before {
		width: 16px;
		height: 16px;
		top: 5px;
	}

	.hdrReviewBox .reviewBox .gr_logo span:nth-of-type(2)::after {
		width: 6px;
		height: 6px;
		top: 9px;
		right: 5px;
	}

	.hdrReviewBox .reviewBox>ul {
		gap: 10px
	}

	.hdrReviewBox .reviewBox>ul li .wp-google-rating {
		font-size: 14px !important;
		font-size: 1.4rem !important;
	}
}

/*--------------------
フッター
--------------------*/
footer {
	/*	background: url(./img/footer_bg.png) repeat #222222;*/
	background: #222222;
	color: #FFFFFF;
	padding: 40px 0 0 0;
	margin-top: 40px;
}

.groupBnr+footer {
	margin-top: 0;
}

footer a {
	color: #FFFFFF;
	transition: 0.4s ease;
}

footer a:hover {
	opacity: 0.7;
}

footer a.exLink::after {
	background: url(./img/ico_exlink_w.png) no-repeat;
	background-size: contain;
}

footer .ftrLogo {
	text-align: center;
}

footer .ftrLogo img {
	height: 40px;
	width: auto;
}

footer .snsBnr {
	font-size: 13px;
	font-size: 1.3rem;
	text-align: center;
	margin: 20px 0 0 0;
}

footer .snsBnr ul {
	display: flex;
	justify-content: center;
	gap: 10px;
	margin-bottom: 10px;
}

footer .snsBnr li {
	width: 55px;
	height: 55px;
	border-radius: 50vh;
	background-color: #FFFFFF;
	padding: 8px;
}

footer nav .ftrNav {
	max-width: 1100px;
	margin: 60px auto 0;
	padding: 0 10px 40px 10px;
	font-size: 14px;
	font-size: 1.4rem;
	display: flex;
	justify-content: space-between;
}

footer nav .ftrNav li>ul>li+li,
footer nav .ftrNav li li>ul {
	margin: 10px 0 0;
}

footer nav .ftrNav>li>ul>li {
	padding: 0 0 0 20px;
	position: relative;
}

footer nav .ftrNav>li>ul>li::before {
	content: '';
	display: block;
	width: 10px;
	height: 1px;
	background-color: #bbbbbb;
	position: absolute;
	top: 1.0rem;
	left: 0;
}

footer nav .ftrNav>li>ul>li>ul>li {
	padding: 0 0 0 20px;
	position: relative;
}

footer nav .ftrNav>li>ul>li>ul>li::before {
	content: '';
	display: block;
	width: 10px;
	height: 1px;
	background-color: #bbbbbb;
	position: absolute;
	top: 1.0rem;
	left: 0;
}

footer nav .ftrNav>li>ul>li>ul>li::after {
	content: '';
	display: block;
	width: 1px;
	height: 1rem;
	background-color: #bbbbbb;
	position: absolute;
	top: 0;
	left: 0;
}

footer .ftrAddress {
	max-width: 1100px;
	margin: 0 auto 0;
	font-size: 13px;
	font-size: 1.3rem;
	border-top: solid 1px #555555;
}

footer .ftrAddress h5 {
	padding: 40px 25px 0;
	font-size: 13px;
	font-size: 1.3rem;
	font-weight: 400;
	text-align: center;
}

footer .shopKanalpaint,
footer .shopLifestyle {
	padding: 40px 25px 40px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 40px 90px;
}

footer .shopLifestyle li {
	width: calc((100% - 60px) / 3);
}

footer .shopLifestyle {
	padding: 40px 25px 80px;
	border-top: solid 1px #555555;
	justify-content: space-between;
	gap: 30px;
}

footer .copyRight {
	text-align: center;
	padding: 15px 0;
	background: #FFFFFF;
	color: #222222;
}

footer .copyRight p {
	font-size: 14px;
	font-size: 1.4rem;
	letter-spacing: .04em;
	font-weight: 500;
}

@media (max-width: 1150px) {
	footer nav .ftrNav {
		font-size: 12px;
		font-size: 1.2rem;
	}
}

@media (max-width: 800px) {
	footer {
		background-size: 9px;
	}

	footer .ftrLogo img {
		height: 30px;
	}

	footer nav .ftrNav {
		width: auto;
		margin: 20px auto 0;
		padding: 0 20px 20px 20px;
		display: block;
	}

	footer nav .ftrNav li+li {
		margin: 10px 0 0;
	}

	footer nav .ftrNav>li>ul>li {
		padding: 10px 10px 0;
		position: relative;
		border-top: solid 1px #bbbbbb;
	}

	footer nav .ftrNav>li:last-child>ul>li:last-child {
		border-bottom: solid 1px #bbbbbb;
		padding-bottom: 10px;
	}

	footer nav .ftrNav>li>ul>li::before {
		content: none;
	}

	footer nav .ftrNav>li>ul>li>ul>li {
		display: none;
	}

	footer nav .ftrNav a {
		display: block;
	}

	footer .ftrAddress {
		width: auto;
		font-size: 12px;
		font-size: 1.2rem;
		border-top: none;
	}

	footer .ftrAddress h5 {
		padding: 20px 20px 0;
		font-size: 12px;
		font-size: 1.2rem;
		font-weight: 400;
		text-align: left;
	}

	footer .shopKanalpaint,
	footer .shopLifestyle {
		padding: 20px 20px 0px;
		display: block;
	}

	footer .shopLifestyle {
		width: auto;
		padding: 20px 20px 40px;
		border-top: none;
		display: block;
	}

	footer .shopLifestyle li {
		width: 100%;
		font-size: 12px;
		font-size: 1.2rem;
	}

	footer .shopLifestyle li+li,
	footer .shopKanalpaint li+li {
		margin-top: 20px;
	}

	footer .copyRight {
		text-align: center;
		padding: 10px 0;
	}

	footer .copyRight p {
		font-size: 1.2px;
		font-size: 1.2rem;
		letter-spacing: .04em;
		font-weight: 500;
	}
}

/*--------------------
フッター固定ボタン
--------------------*/
.ftrScroll {
	display: none;
	position: fixed;
	bottom: 50px;
	right: 30px;
	z-index: 100;
}

.ftrScroll li+li {
	margin-top: 10px;
}

.ftrScroll .goLine a,
.ftrScroll .goTop a {
	width: 80px;
	height: 80px;
	border-radius: 50vh;
	display: block;
	font-weight: 700;
	text-align: center;
	line-height: 1.2;
	margin-left: auto;
}

.ftrScroll .btn-tell a {
	display: block;
	width: 370px;
}

.ftrScroll a[href^="tel:"] {
    pointer-events: none;
    cursor: default;
}

.ftrScroll .goLine a {
	background: #06c755;
	color: #FFFFFF;
	padding: 3px 0 0 0;
}

.ftrScroll .goLine a::before {
	content: '';
	width: 32px;
	height: 32px;
	margin: 0 auto -5px;
	background: url(./img/ico_line.png) no-repeat;
	background-size: contain;
	display: block;
	border-radius: 50vh;
}

.ftrScroll .goTop a {
	color: #222222;
	background-color: #FFFFFF;
	border: solid 3px #222222;
	padding: 3px 0 0 0;
	font-size: 12px;
	font-size: 1.2rem;
}

.ftrScroll .goTop a::before {
	content: '';
	width: 12px;
	height: 12px;
	border-top: solid 2px #222222;
	border-right: solid 2px #222222;
	margin: 10px auto 10px;
	display: block;
	transform: rotate(-45deg);
}

@media (max-width: 599px) {
	.ftrScroll {
		bottom: 16px;
		right: 10px;
	}

	.ftrScroll li+li {
		margin-top: 5px;
	}
	
	.ftrScroll .goLine a,
	.ftrScroll .goTop a {
		width: 55px;
		height: 55px;
	}

	.ftrScroll .btn-tell a {
		width: 260px;
		height: auto;
	}

	.ftrScroll a[href^="tel:"] {
		pointer-events: auto;
	}

	.ftrScroll .goLine a {
		padding: 2px 0 0 0;
		font-size: 13px;
		font-size: 1.3rem;
	}

	.ftrScroll .goLine a::before {
		width: 18px;
		height: 18px;
		margin: 0 auto -2px;
	}

	.ftrScroll .goTop a {
		border: solid 2px #222222;
		font-size: 11px;
		font-size: 1.1rem;
	}

	.ftrScroll .goTop a::before {
		width: 10px;
		height: 10px;
		margin: 5px auto 2px;
	}
}

/*--------------------
 .ftrArchitex
--------------------*/
.ftrArchitex {
	max-width: 1100px;
	margin: 60px auto 0;
}

.ftrArchitex a {
	color: #222222;
	transition: 0.4s ease;
}

.ftrArchitex a:hover {
	opacity: 0.7;
}

.companyInfo,
.ftrArchitex .ftrArchitexText {
	border-bottom: dotted 1px #000000;
}

.companyInfo {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-bottom: 40px;
}

.companyAddress {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 25px;
	font-weight: 500;
}

.ftrArchitexText {
	font-size: 14px;
	font-size: 1.4rem;
	line-height: 2.0;
	font-weight: 500;
	padding-bottom: 40px;
}

.ftrArchitexText p {
	margin-top: 40px;
}

@media (max-width: 1150px) {
	.ftrArchitex {
		margin: 60px 20px 0;
	}
}

@media (max-width: 599px) {
	.ftrArchitex {
		width: auto;
		margin: 40px 20px 0;
	}

	.companyInfo {
		display: block;
		padding-bottom: 20px;
	}

	.companyAddress {
		margin-top: 15px;
		gap: 10px;
		font-size: 12px;
		font-size: 1.2rem;
		line-height: 1.8;
		align-items: flex-start;
	}

	.companyAddress p:nth-of-type(2) {
		min-width: 260px;
	}

	.ftrArchitex .ftrArchitexText {
		font-size: 10px;
		font-size: 1.0rem;
		letter-spacing: -0.04em;
		line-height: 2.0;
		padding-bottom: 20px;
	}

	.ftrArchitex .ftrArchitexText p {
		margin-top: 20px;
	}
}

/*--------------------
 ぱんくず
--------------------*/
#pagePath {
	margin-top: 10px;
}

#pagePath p {
	max-width: 1100px;
	margin: 0 auto;
	padding: 6px 0;
	font-size: 11px;
	font-size: 1.1rem;
	font-weight: 500;
	line-height: 1;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#pagePath p a {
	text-decoration: underline;
	color: #222222;
}

#pagePath p>span {
	margin-right: 5px;
}

@media (max-width: 1150px) {
	#pagePath {
		background-color: #f3f3f3;
		margin: 0;
	}

	#pagePath p {
		font-size: 10px;
		font-size: 1.0rem;
		padding: 10px 10px;
	}
}

/*--------------------
下層ページタイトル
--------------------*/
#pageTitle {
	background-color: #fff6da;
	margin-top: 20px;
}

#pageTitle h1,
#pageTitle p strong {
	display: block;
	text-align: center;
	font-size: 34px;
	font-size: 3.4rem;
	font-weight: 700;
	letter-spacing: 1px;
	padding: 20px 10px 25px;
}

#pageTitle h1.pageMainv {
	padding: 0;
}

#pageTitle h1.pageMainv img {
	width: 100%;
	height: auto;
}

#main .pageMainv {
	max-width: 1100px;
	margin: 0 auto;
	text-align: center;
	display: block;
}

@media (max-width: 1150px) {
	#pageTitle {
		margin-top: 0;
	}

	#pageTitle h1,
	#pageTitle p strong {
		font-size: 23px;
		font-size: 2.3rem;
		letter-spacing: 0;
	}

	#main .pageMainv {
		margin-right: 20px;
		margin-left: 20px;
	}
}

/*----------------------------------------------------
    投稿記事設定
----------------------------------------------------*/
#contents .postTitle,
#contents .archiveTitle {
	font-size: 28px;
	border-bottom: dotted 1px #d3d3d3;
	padding-bottom: 20px;
}

#contents .archiveTitle {
	margin-bottom: 20px;
}

#contents .infoBox {
	margin-top: 20px;
}

#contents .infoBox p+p {
	margin-top: 5px;
}

#contents .infoBox .tax,
#contents .worksData .tax,
#contents .archiveList .tax {
	display: flex;
	gap: 5px;
	flex-wrap: wrap;
}

#contents .worksData .tax {
	margin-top: 0 !important;
}

#contents .infoBox .tax a,
#contents .worksData .tax a,
#contents .archiveList .tax span {
	background: #777777;
	color: #FFFFFF !important;
	text-decoration: none !important;
	padding: 3px 7px;
	line-height: 1;
	border-radius: 5px;
	border: solid 2px #777777;
	font-size: 12px;
	font-size: 1.2rem;
	font-weight: 700;
	transition: 0.4s ease;
}

#contents .infoBox .tax a:hover,
#contents .worksData .tax a:hover {
	color: #777777 !important;
	background: #FFFFFF;
}

#contents .infoBox .time {
	text-align: right;
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: 500;
}

#contents .contentBox {
	line-height: 1.8;
	margin-top: 30px;
}

#contents .contentBox>*:nth-child(1) {
	margin-top: 0;
}

#contents .contentBox a:link,
#contents .contentBox a:visited {
	color: #f67644;
	transition: 0.3s ease-out;
	text-decoration: underline;
}

#contents .contentBox a:hover {
	color: #f69c44;
}

#contents .contentBox a img {
	transition: 0.3s ease-out;
}

#contents .contentBox a:hover img {
	opacity: 0.7;
}

#contents .contentBox p,
#contents .contentBox iframe,
#contents .contentBox ul,
#contents .contentBox ol,
#contents .contentBox blockquote,
#contents #ez-toc-container {
	margin-top: 30px;
}

#contents .contentBox h1,
#contents .contentBox h2,
#contents .contentBox h3,
#contents .contentBox h4,
#contents .contentBox h5,
#contents .contentBox h6,
#contents .contentBox table {
	margin-top: 30px;
	line-height: 1.5;
}

#contents .contentBox h1,
#contents .contentBox h2,
h1.sub-heading,
h2.sub-heading {
	font-size: 26px;
	background: #f6ca44;
	padding: 5px 10px;
}

#contents .contentBox h3,
h3.sub-heading {
	border-top: solid 1px #777777;
	border-bottom: solid 1px #777777;
	font-size: 25px;
	padding: 10px 0;
}

#contents .contentBox h4 {
	font-size: 22px;
	padding: 5px 10px;
	background: #f3f3f3;
}

#contents .contentBox h5 {
	border-bottom: dotted 1px #d3d3d3;
	font-size: 20px;
	padding: 5px 0;
}

#contents .contentBox h6 {
	font-size: 18px;
	padding: 0 0 0 25px;
	position: relative;
}

#contents .contentBox h6::before {
	content: '';
	width: 15px;
	height: 15px;
	background: #f6ca44;
	border-radius: 3px;
	position: absolute;
	top: 0.4em;
	left: 0;
}

#contents .contentBox img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

#contents .contentBox img.alignright {
	padding: 0;
	margin: 0 0 10px 30px;
	display: inline;
}

#contents .contentBox img.alignleft {
	padding: 0;
	margin: 0 30px 10px 0;
	display: inline;
}

#contents .contentBox img.aligncenter {
	display: block;
	margin: 0 auto;
}

#contents .contentBox .alignright {
	float: right;
	margin-left: 10px;
	margin-bottom: 2px;
}

#contents .contentBox .alignleft {
	float: left;
	margin-right: 10px;
	margin-bottom: 2px;
}

#contents .contentBox .nobr br {
	display: none;
}

#contents .contentBox p.wp-caption {
	font-size: 0.8em;
	line-height: 1.2em;
}

#contents .contentBox p.wp-caption img {
	margin-bottom: 5px;
}

#contents .contentBox p.wp-caption .caption-text {
	text-align: left;
}

@media (max-width: 599px) {

	#contents .postTitle,
	#contents .archiveTitle {
		font-size: 20px;
		margin: 20px 20px 0;
	}

	#contents .archiveTitle {
		margin: 20px 20px 20px;
	}

	#contents .infoBox {
		margin: 20px 20px 0;
	}

	#contents .archiveList .tax span {
		font-size: 10px;
		font-size: 1.0rem;
		padding: 3px 3px;
	}

	#contents .contentBox {
		margin: 30px 20px 0;
	}

	#contents .postTitle {
		font-size: 22px;
		font-size: 5.8vmin;
	}

	#contents .contentBox h1,
	#contents .contentBox h2 {
		font-size: 20px;
		font-size: 5.3vmin;
	}

	#contents .contentBox h3 {
		font-size: 18px;
		font-size: 4.9vmin;
	}

	#contents .contentBox h4 {
		font-size: 20px;
		font-size: 5.3vmin;
	}

	#contents .contentBox h5 {
		font-size: 18px;
		font-size: 4.8vmin;
	}

	#contents .contentBox h6 {
		font-size: 18px;
		font-size: 4.8vmin;
	}

	#contents .contentBox h6::before {
		content: '';
		width: 15px;
		height: 15px;
		background: #f6ca44;
		border-radius: 3px;
		position: absolute;
		top: 0.4em;
		left: 0;
	}
}

#contents .contentBox blockquote {
	border: dotted 1px #d3d3d3;
	background: #f3f3f3;
	padding: 15px;
}

#contents .contentBox blockquote>*:first-child {
	margin-top: 0;
}

#contents .contentBox li>ul {
	margin-top: 10px !important;
}

#contents .contentBox ul li {
	padding: 0 0 0 20px;
	position: relative;
}

#contents .contentBox ul li+li {
	margin-top: 10px;
}

#contents .contentBox ul li::before {
	content: '';
	width: 7px;
	height: 7px;
	background: #777777;
	border-radius: 50vh;
	position: absolute;
	top: 0.7em;
	left: 0;
}

#contents .contentBox>ul>li>ul>li::before {
	background: transparent;
	border: solid 1px #777777;
}

#contents .contentBox>ul>li>ul>li>ul>li::before {
	width: 7px;
	height: 2px;
	border-radius: 0;
	background: #777777;
	top: 0.9em;
}

#contents .contentBox ol {
	counter-reset: listnum;
}

#contents .contentBox li>ol {
	margin-top: 10px !important;
}

#contents .contentBox ol>li {
	padding: 0 0 0 25px;
	position: relative;
}

#contents .contentBox ol>li+li {
	margin-top: 10px;
}

#contents .contentBox ol>li::before {
	counter-increment: listnum;
	content: counter(listnum, decimal-leading-zero);
	width: 20px;
	height: 20px;
	background: #777777;
	border-radius: 50vh;
	position: absolute;
	top: 0.4em;
	left: 0;
	line-height: 1;
	font-size: 11px;
	font-size: 1.1rem;
	color: #FFFFFF;
	display: flex;
	justify-content: center;
	align-items: center;
}

#contents .contentBox>ol>li>ol>li::before {
	background: transparent;
	color: #777777;
	border: solid 1px #777777;
}

#contents .contentBox>ol>li>ol>li>ol>li::before {
	background: transparent;
	color: #777777;
	border: none;
	content: counter(listnum, upper-roman);
}

#contents .contentBox table {
	width: 100%;
}

#contents .contentBox table th,
#contents .contentBox table td {
	border: solid 1px #777777;
	padding: 5px 10px;
	vertical-align: top;
}

#contents .contentBox table th {
	background: #f3f3f3;
	text-align: left;
}

/*--------------------
メインビジュアル
--------------------*/
#mainv {
	max-width: 1600px;
	width: 100%;
	margin: 0 auto;
}

/*--------------------
下層メインカラム
--------------------*/
#blog #contents,
#works #contents,
#staff #contents {
	max-width: 1100px;
}

#contents {
	margin: 30px auto 60px;
	display: flex;
	gap: 60px;
}

#contents #main .inner {
	max-width: 1100px;
	margin-right: auto;
	margin-left: auto;
}

#contents #main {
	flex: 1;
}

#contents #side {
	width: 250px;
}

@media (max-width: 1150px) {
	#blog #contents #main {
		margin: 0 20px;
	}

	#contents {
		display: block;
		margin: 30px auto 30px;
	}

	#contents article {
		padding: 0 0;
	}

	#contents #main article .inner {
		margin-right: 20px;
		margin-left: 20px;
	}

	#contents .pagenavi {
		padding: 0 20px;
		margin-top: 40px;
	}

	#contents #side {
		width: 100%;
		margin-top: 40px;
		padding: 0 20px;
	}
}

@media (max-width: 599px) {
	#blog #contents #main {
		margin: 0 0;
	}
}

/*--------------------
記事設定
--------------------*/
#contents .contentBox {
	word-wrap: break-word;
	word-break: break-all;
	overflow-wrap: break-word;
}

#contents .contentBox img,
#contents .contentBox iframe {
	max-width: 100%;
}

.pagenavi {
	margin-top: 50px;
}

.pagenavi ul {
	display: flex;
	justify-content: space-between;
}

.pagenavi li {
	min-width: 15%;
}

.pagenavi li a {
	display: block;
	text-align: center;
	background: #f67644;
	color: #FFFFFF;
	padding: 2px 5px;
	border: solid 2px #f67644;
	border-radius: 5px;
	font-weight: 500;
	transition: 0.4s ease;
}

.pagenavi li a:hover {
	color: #f67644;
	background: #FFFFFF;
}

.pagenavi li span {
	display: block;
	text-align: center;
	background: #CECECE;
	color: #FFFFFF;
	padding: 2px 5px;
	border: solid 2px #CECECE;
	border-radius: 5px;
	font-weight: 500;
}

/*--------------------
投稿系サイドバー
--------------------*/
#side .side_title {
	font-weight: 500;
	border: solid 1px #777777;
	border-radius: 5px;
	padding: 5px 10px;
	margin-top: 40px;
}

#side .side_title:first-child {
	margin-top: 0;
}

#side .taxList,
#side .blogYearlyList {
	margin-top: 15px;
}

#side a {
	color: #222222;
	transition: 0.3s ease-out;
}

#side a:hover {
	color: #f67644;
}

@media (max-width: 960px) {
	#side .side_title {
		cursor: pointer;
		margin-top: 0;
		padding: 10px;
		position: relative;
		transition: 0.3s ease;
	}

	#side .side_title::before {
		content: '';
		width: 20px;
		height: 20px;
		background: #777777;
		border-radius: 50vh;
		position: absolute;
		top: calc(50% - 10px);
		right: 10px;
	}

	#side .side_title::after {
		content: '';
		width: 8px;
		height: 8px;
		border-bottom: solid 2px #FFFFFF;
		border-right: solid 2px #FFFFFF;
		transform: rotate(45deg);
		position: absolute;
		top: calc(50% - 5px);
		right: 16px;
	}

	#side .side_title.open::after {
		transform: rotate(-135deg);
		top: calc(50% - 3px);
	}

	.taxList,
	.blogYearlyList {
		visibility: hidden;
		opacity: 0;
		height: 1px;
		transition: 0.3s ease;
		overflow: hidden;
	}

	.taxList.open,
	.blogYearlyList.open {
		visibility: visible;
		height: 100%;
		opacity: 1;
		margin-bottom: 20px;
	}
}

/*--------------------
タクソノミーアーカイブ
--------------------*/
.taxList li {
	position: relative;
	padding-left: 20px;
	line-height: 1.8;
}

.taxList li::before {
	content: '';
	width: 7px;
	height: 7px;
	background: #CCCCCC;
	border-radius: 50vh;
	position: absolute;
	top: 0.6em;
	left: 0;
}

/*--------------------
年月アーカイブ
--------------------*/

#side .blogYearlyList ul {
	visibility: hidden;
	opacity: 0;
	height: 1px;
	transition: 0.3s ease;
	overflow: hidden;
}

#side .blogYearlyList ul.open {
	visibility: visible;
	height: 100%;
	opacity: 1;
	margin-bottom: 10px;
}

#side .blogYearlyList ul li {
	padding: 0 0 0 25px;
}

#side .blogYearlyList h4 {
	position: relative;
	padding-left: 20px;
	line-height: 1.8;
	transition: 0.3s ease;
	cursor: pointer;
}

#side .blogYearlyList h4::before {
	content: '＋';
	color: #CCCCCC;
	position: absolute;
	top: 0;
	left: 0;
}

#side .blogYearlyList h4.open::before {
	content: '－';
}

/*--------------------
目次設定
--------------------*/
div#ez-toc-container {
	width: 100%;
	padding: 10px;
}

.ez-toc-title-container {
	padding: 0 0 0 0;
}

#ez-toc-container label {
	float: right;
	position: relative;
	left: 3px;
	font-size: 16px;
	background: #222222;
	padding: 0px 4px 2px 5px;
	border: 1px solid #222222;
	border-radius: 5px;
	cursor: pointer;
}

#ez-toc-container label i {
	color: #FFFFFF;
}

#contents .contentBox #ez-toc-container>nav>ul {
	margin-top: 10px !important;
	padding-top: 10px !important;
	border-top: dotted 1px #d3d3d3;
	display: block;
}

#contents .contentBox #ez-toc-container ul,
#contents .contentBox #ez-toc-container li {
	padding: 0 !important;
	margin: 0 !important;
	line-height: 1;
}

#contents .contentBox #ez-toc-container li::before {
	content: none !important;
}

#contents .contentBox #ez-toc-container li a {
	font-size: 15px;
	font-size: 1.5rem;
	text-decoration: none;
	line-height: 2.0;
	padding-left: 20px;
	display: block;
}

#contents .contentBox #ez-toc-container nav li.ez-toc-heading-level-1>a::before,
#contents .contentBox #ez-toc-container nav li.ez-toc-heading-level-2>a::before {
	content: '';
	width: 7px;
	height: 7px;
	background: #777777;
	border-radius: 50vh;
	position: absolute;
	top: 0.7em;
	left: 0;
}

#contents .contentBox #ez-toc-container nav li.ez-toc-heading-level-3>a {
	margin-left: 20px;
}

#contents .contentBox #ez-toc-container nav li.ez-toc-heading-level-3>a::before {
	content: '';
	width: 7px;
	height: 7px;
	border: solid 1px #777777;
	border-radius: 50vh;
	position: absolute;
	top: 0.7em;
	left: 20px;
}

#contents .contentBox #ez-toc-container nav li.ez-toc-heading-level-4>a {
	margin-left: 40px;
}

#contents .contentBox #ez-toc-container nav li.ez-toc-heading-level-4>a::before {
	content: '';
	width: 7px;
	height: 7px;
	background: #777777;
	position: absolute;
	top: 0.7em;
	left: 40px;
}

#contents .contentBox #ez-toc-container nav li.ez-toc-heading-level-5>a {
	margin-left: 60px;
}

#contents .contentBox #ez-toc-container nav li.ez-toc-heading-level-5>a::before {
	content: '';
	width: 7px;
	height: 7px;
	border: solid 1px #777777;
	position: absolute;
	top: 0.7em;
	left: 60px;
}

#contents .contentBox #ez-toc-container nav li.ez-toc-heading-level-6>a {
	margin-left: 80px;
}

#contents .contentBox #ez-toc-container nav li.ez-toc-heading-level-6>a::before {
	content: '';
	width: 7px;
	height: 2px;
	background: #777777;
	position: absolute;
	top: 0.9em;
	left: 80px;
}

/*----------------------------------------
 トップページ
----------------------------------------*/
/*--------------------
 topCatch
--------------------*/
.topCatch {
	text-align: center;
}

.topCatch .topCatchNo1 {
	display: flex;
	gap: 15px;
	line-height: 1;
	justify-content: center;
	align-items: center;
	padding: 25px 0;
}

.topCatch .topCatchNo1>span:nth-child(1) {
	font-size: 52px;
	color: #555555;
	font-weight: 900;
}

.topCatch .topCatchNo1>span:nth-child(2) {
	font-size: 74px;
	color: #f6ca44;
	font-weight: 700;
	font-family: "Roboto", sans-serif;
}

.topCatch .topCatchNo1>span:nth-child(3) {
	font-size: 74px;
	color: #222222;
	font-weight: 900;
	margin-bottom: 13px;
}

.topCatch .topCatchSelected {
	/*	background: url(./img/contact01_catch.png) repeat #555555;*/
	background: #555555;
	padding: 35px 0 40px;
}

.topCatch .topCatchSelected p:nth-child(1) {
	font-size: 26px;
	font-weight: 700;
	display: inline-block;
	color: #FFFFFF;
	position: relative;
}

.topCatch .topCatchSelected p:nth-child(1)::before,
.topCatch .topCatchSelected p:nth-child(1)::after {
	position: absolute;
	content: '';
	height: 54px;
	width: 28px;
	top: 0;
}

.topCatch .topCatchSelected p:nth-child(1)::before {
	background: url(./img/ico_tri02_left.png) 50% / contain no-repeat;
	left: -50px;
}

.topCatch .topCatchSelected p:nth-child(1)::after {
	background: url(./img/ico_tri02_right.png) 50% / contain no-repeat;
	right: -50px;
}

.topCatch .topCatchSelected p strong {
	color: #f6ca44;
}

.topCatch .topCatchSelected p.btnC {
	margin-top: 20px;
}

@media (max-width: 800px) {
	.topCatch .topCatchNo1 {
		flex-wrap: wrap;
		gap: 10px;
	}

	.topCatch .topCatchSelected p:nth-child(1) {
		font-size: 20px;
	}
}

@media (max-width: 599px) {
	.topCatch .topCatchNo1 {
		padding: 15px 0 10px;
		flex-wrap: wrap;
		gap: 10px;
	}

	.topCatch .topCatchNo1>span:nth-child(1) {
		width: 100%;
		font-size: 40px;
		font-size: 9.8vmin;
	}

	.topCatch .topCatchNo1>span:nth-child(2) {
		font-size: 55px;
		font-size: 13.5vmin;
	}

	.topCatch .topCatchNo1>span:nth-child(3) {
		font-size: 55px;
		font-size: 13.5vmin;
	}

	.topCatch .topCatchSelected {
		padding: 25px 0 25px;
	}

	.topCatch .topCatchSelected p:nth-child(1) {
		font-size: 22px;
		font-size: 5.3vmin;
	}

	.topCatch .topCatchSelected p:nth-child(1)::before,
	.topCatch .topCatchSelected p:nth-child(1)::after {
		top: 5px;
	}

	.topCatch .topCatchSelected p:nth-child(1)::before {
		left: -40px;
	}

	.topCatch .topCatchSelected p:nth-child(1)::after {
		right: -40px;
	}

	.topCatch .topCatchSelected p.btnC a {
		width: 80%;
	}
}

/*--------------------
 topInformation
--------------------*/
.topInformation {
	padding: 50px 0;
	background: url(./img/bg_dot_wh.png) repeat;
}

.topInformationBnr {
	max-width: 750px;
	margin: 40px auto 0;
	text-align: center
}

.topInformationBnr img {
	max-width: 100%;
	height: auto;
}

.topInformationBox {
	margin: 40px auto 0;
	max-width: 750px;
}

.topInformationBox .date {
	font-weight: 700;
	color: #f67644;
}

.topInformationBox a {
	color: #222222;
}

@media (max-width: 599px) {
	.topInformation {
		padding: 40px 20px;
	}

	.topInformationBox {
		margin: 30px auto 0;
	}
}

/*--------------------
 topReasonList
--------------------*/

.topReasonList {
	background-color: #fff6da;
	padding: 50px 0;
}

.reasonMsg {
	max-width: 1100px;
	margin: 40px auto 0;
	display: flex;
	gap: 40px;
	line-height: 2.0;
	font-weight: 500;
}

.reasonMsg p {
	margin-top: 15px;
}

.reasonList {
	display: flex;
	max-width: 1100px;
	margin: 80px auto 0;
	gap: 60px 40px;
	flex-wrap: wrap;
}

.reasonList li.reasonnum-reset {
	counter-reset: reasonnum 0;
}

.reasonList li {
	width: calc((100% - 80px)/3);
	border: solid 3px #555555;
	background-color: #FFFFFF;
	position: relative;
}

.reasonList li a {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 40px 28px 30px;
	color: #222222;
}

.reasonList li a::before {
	position: absolute;
	counter-increment: reasonnum 1;
	content: counter(reasonnum);
	width: 60px;
	height: 60px;
	background: #f67644;
	border-radius: 5px;
	line-height: 1;
	font-size: 20px;
	font-size: 2.0rem;
	font-weight: 500;
	color: #FFFFFF;
	display: flex;
	justify-content: center;
	align-items: center;
	top: -35px;
}

.reasonList li a::after {
	width: 114px;
	height: 69px;
	content: '';
	display: block;
	position: absolute;
	background: url(./img/reason_en.png) 50% /contain no-repeat;
	top: -45px;
	left: 10px;
}

.reasonListTtl {
	width: 100%;
	margin-top: 20px;
	text-align: center;
}

.reasonListTtl h4 {
	background: #555555;
	color: #FFFFFF;
	padding: 5px 10px;
}

.reasonListTtl p {
	margin-top: 15px;
	font-size: 15px;
	font-size: 1.5rem;
	font-weight: 500;
	line-height: 1.8;
}

.topReasonList .btnC {
	margin-top: 40px;
}

@media (max-width: 1150px) {
	.topReasonList {
		padding: 50px 20px;
	}

	.reasonImg {
		width: 40%;
	}

	.reasonMsg p {
		flex: 1;
	}
}

@media (max-width: 800px) {
	.reasonMsg {
		flex-direction: column;
		margin: 20px 20px 0;
		gap: 0;
	}

	.reasonImg {
		width: 100%;
		text-align: center;
	}

	.reasonList li {
		width: calc((100% - 40px)/2);
	}
}

@media (max-width: 599px) {
	.topReasonList {
		padding: 40px 0;
	}

	.reasonMsg p {
		font-size: 15px;
		font-size: 4vmin;
	}

	.reasonList {
		margin-top: 10px;
	}

	#topReasonSlide .slick-track {
		display: flex;
	}

	#topReasonSlide .slick-list {
		padding-top: 45px;
	}

	#topReasonSlide .slick-slide {
		height: auto !important;
		box-sizing: border-box;
		margin: 10px 20px;
	}

	#topReasonSlide .slick-dots li {
		border: none;
		background-color: transparent;
	}

	.topReasonList .btnC {
		margin-top: 50px;
	}

	.topReasonList .btnC a {
		width: 80%;
	}
}

/*--------------------
 topWorksTaxList
--------------------*/

.topWorksTaxList {
	max-width: 1100px;
	margin: 70px auto 0;
	display: flex;
	gap: 20px 40px;
	flex-wrap: wrap;
}

.topWorksTaxList .toggleBtn {
	width: calc((100% - 40px)/2);
	border: solid 3px #f67644;
	color: #FFFFFF;
	font-size: 18px;
	font-size: 1.8rem;
	letter-spacing: .04em;
	font-weight: 700;
	padding: 17px 20px 17px 20px;
	text-align: center;
	border-radius: 10px;
	position: relative;
	transition: 0.3s ease-out;
}

.topWorksTaxList .toggleBtn::before {
	content: '';
	position: absolute;
	width: 20px;
	height: 20px;
	background: #FFFFFF;
	border-radius: 50vh;
	top: calc(50% - 10px);
	right: 20px;
}

.topWorksTaxList .toggleBtn::after {
	content: '';
	position: absolute;
	width: 8px;
	height: 8px;
	border-top: solid 3px #f67644;
	border-right: solid 3px #f67644;
	transform: rotate(45deg);
	background: transparent;
	margin: 0 0 0 0;
	top: calc(50% - 4px);
	right: 27px;
}

.topWorksTaxList .toggleBtn.open::before {
	background: #f67644;
}

.topWorksTaxList .toggleBtn.open::after {
	border-top: solid 3px #FFFFFF;
	border-right: solid 3px #FFFFFF;
	transform: rotate(135deg);
	top: calc(50% - 5px);
	right: 26px;
}

.topWorksTaxList .toggleBtn:nth-of-type(1) {
	background: url(./img/ico_workstax_home.png) 30px center no-repeat #f67644;
}

.topWorksTaxList .toggleBtn:nth-of-type(2) {
	background: url(./img/ico_workstax_map.png) 30px center no-repeat #f67644;
}

.topWorksTaxList .toggleBtn:nth-of-type(3) {
	background: url(./img/ico_workstax_paint.png) 30px center no-repeat #f67644;
}

.topWorksTaxList .toggleBtn:nth-of-type(4) {
	background: url(./img/ico_workstax_price.png) 30px center no-repeat #f67644;
}

.topWorksTaxList .toggleBtn.open:nth-of-type(1) {
	background: url(./img/ico_workstax_home_on.png) 30px center no-repeat #FFFFFF;
	color: #f67644;
}

.topWorksTaxList .toggleBtn.open:nth-of-type(2) {
	background: url(./img/ico_workstax_map_on.png) 30px center no-repeat #FFFFFF;
	color: #f67644;
}

.topWorksTaxList .toggleBtn.open:nth-of-type(3) {
	background: url(./img/ico_workstax_paint_on.png) 30px center no-repeat #FFFFFF;
	color: #f67644;
}

.topWorksTaxList .toggleBtn.open:nth-of-type(4) {
	background: url(./img/ico_workstax_price_on.png) 30px center no-repeat #FFFFFF;
	color: #f67644;
}

.topWorksTaxList .taxList {
	display: none;
	opacity: 0;
}

.topWorksTaxList .taxList.open {
	width: 100%;
	display: block;
	animation-name: taxList-open;
	animation-fill-mode: forwards;
	animation-duration: 0.3s;
}

@keyframes taxList-open {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

.topWorksTaxList .taxList li {
	display: inline-block;
	padding-left: 15px;
}

.topWorksTaxList .taxList li+li {
	margin-left: 20px;
}

.topWorksTaxList .taxList li a {
	color: #222222;
	transition: 0.3s ease-out;
	font-weight: 500;
}

.topWorksTaxList .taxList li a:hover {
	color: #f67644;
}

@media (max-width: 1150px) {
	.topWorksTaxList {
		margin: 70px 20px 0;
	}
}

@media (max-width: 599px) {
	.topWorksTaxList {
		margin: 50px 20px 0;
		display: flex;
		gap: 15px;
	}

	.topWorksTaxList .toggleBtn {
		width: 100%;
		padding: 10px 10px;
		font-size: 16px;
		font-size: 4.2vmin;
		border-radius: 5px;
		background-size: 20px auto !important;
		background-position: 10px center !important;
	}

	.topWorksTaxList .toggleBtn::before {
		right: 10px;
	}

	.topWorksTaxList .toggleBtn::after {
		right: 17px;
	}

	.topWorksTaxList .toggleBtn.open::after {
		right: 16px;
	}

	.topWorksTaxList .taxList li+li {
		margin-left: unset;
	}

	.topWorksTaxList .taxList li {
		margin-right: 15px;
	}
}

/*--------------------
 topReformMenu
--------------------*/

.topReformMenu .titleWrap,
#menu .menuTitleWrap {
	background: url(./img/top_menu_bg.jpg) 50% / cover no-repeat;
	padding: 80px 0;
}

.topReformMenu .titleWrap h2,
#menu .menuTitleWrap h1 {
	/*	background: url(./img/bg_dline_dg07.png) repeat;*/
	background: rgba(0, 0, 0, 0.6);
	padding: 40px 0;
}

.topReformMenu .titleWrap h2.heading,
#menu .menuTitleWrap h1.heading {
	gap: 15px;
}

.topReformMenu .titleWrap h2.heading .en,
.topReformMenu .titleWrap h2.heading .title,
#menu .menuTitleWrap h1.heading .en,
#menu .menuTitleWrap h1.heading .title {
	color: #FFFFFF;
}

.topReformMenu .titleWrap h2.heading .title,
#menu .menuTitleWrap h1.heading .title {
	border-left: solid 2px #FFFFFF;
	border-right: solid 2px #FFFFFF;
	padding: 0 50px;
}

.topReformMenu .titleWrap h2.heading .catch,
#menu .menuTitleWrap h1.heading .catch {
	background-color: #f6ca44;
	padding: 10px 20px;
	border-radius: 5px;
}

.menuList {
	max-width: 1100px;
	margin: 40px auto 0;
	display: flex;
	flex-wrap: wrap;
	gap: 40px;
}

.menuList li {
	width: calc((100% - 40px)/2);
}

.menuList li a.menuItem {
	display: grid;
	color: #222222;
	grid-template-rows: 95px 1fr 60px;
	grid-template-columns: 220px 1fr;
}

.menuList li a.menuItem .menuPhoto {
	border-radius: 10px 0 0 0;
	border-top: solid 3px #555555;
	border-left: solid 3px #555555;
	grid-row: 1 / 3;
	grid-column: 1 / 2;
	overflow: hidden;
}

.menuList li a.menuItem .menuPhoto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: 0.3s ease-out;
}

.menuList li a.menuItem:hover .menuPhoto img {
	transform: scale(1.1);
}

.menuList li a.menuItem .menuPrice {
	border-radius: 0 0 0 10px;
	border-bottom: solid 3px #555555;
	border-left: solid 3px #555555;
	grid-row: 3 / 4;
	grid-column: 1 / 2;
	background-color: #555555;
	color: #FFFFFF;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 700;
	font-size: 26px;
	font-size: 2.6rem;
}

.menuList li a.menuItem .menuPrice span {
	font-family: "Roboto", sans-serif;
	font-size: 40px;
	font-size: 4.0rem;
}

.menuList li a.menuItem .menuName {
	border-radius: 0 10px 0 0;
	border-top: solid 3px #555555;
	border-right: solid 3px #555555;
	grid-row: 1 / 2;
	grid-column: 2 / 3;
	background-color: #f67644;
	color: #FFFFFF;
	border-left: solid 3px #555555;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 24px;
	font-size: 2.4rem;
	font-weight: 700;
	line-height: 1.2;
	padding-right: 20px;
	position: relative;
}

.menuList li a.menuItem .menuName::before {
	content: '';
	display: block;
	position: absolute;
	width: 20px;
	height: 20px;
	background: #FFFFFF;
	border-radius: 50vh;
	top: calc(50% - 10px);
	right: 10px;
}

.menuList li a.menuItem .menuName::after {
	content: '';
	display: block;
	position: absolute;
	width: 8px;
	height: 8px;
	border-top: solid 3px #f67644;
	border-right: solid 3px #f67644;
	transform: rotate(45deg);
	background: transparent;
	margin: 0 0 0 0;
	top: calc(50% - 4px);
	right: 17px;
}

.menuList li a.menuItem .menuExplan {
	border-radius: 0 0 10px 0;
	border: solid 3px #555555;
	grid-row: 2 / 4;
	grid-column: 2 / 3;
	padding: 20px;
	line-height: 1.8;
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: 500;
}

.topReformMenu .btnC {
	margin-top: 40px;
}

@media (max-width: 1150px) {
	.menuList {
		margin: 40px 20px 0;
	}

	.menuList li {
		width: 100%;
	}
}

@media (max-width: 599px) {

	.topReformMenu .titleWrap,
	#menu .menuTitleWrap {
		padding: 40px 0;
	}

	.topReformMenu .titleWrap h2,
	#menu .menuTitleWrap h1.heading {
		padding: 20px 0;
	}

	.topReformMenu .titleWrap h2.heading .title,
	#menu .menuTitleWrap h1.heading .title {
		padding: 0 30px;
	}

	.menuList {
		margin: 30px 20px 0;
		gap: 30px;
	}

	.menuList li {
		width: auto;
	}

	.menuList li a.menuItem {
		grid-template-rows: 50px 1fr 40px;
		grid-template-columns: 35% 1fr;
	}

	.menuList li a.menuItem .menuPrice {
		font-size: 16px;
		font-size: 3.8vmin;
	}

	.menuList li a.menuItem .menuPrice span {
		font-size: 22px;
		font-size: 5.5vmin;
	}

	.menuList li a.menuItem .menuName {
		font-size: 18px;
		font-size: 4.3vmin;
		line-height: 1.2;
	}

	.menuList li a.menuItem .menuName br {
		display: none;
	}

	.menuList li a.menuItem .menuName::before {
		width: 16px;
		height: 16px;
		top: calc(50% - 8px);
		right: 5px;
	}

	.menuList li a.menuItem .menuName::after {
		width: 6px;
		height: 6px;
		top: calc(50% - 3px);
		right: 10px;
	}

	.menuList li a.menuItem .menuExplan {
		padding: 15px;
		font-size: 14px;
		font-size: 3.4vmin;
	}

	.topReformMenu .btnC {
		margin-top: 30px;
	}

	.topReformMenu .btnC a {
		width: 80%;
	}
}


/*--------------------
 reviewBox
--------------------*/

#main .reviewBox {
	background: url(./img/bg_dot_ly.png) repeat;
	padding: 40px 0 50px;
	margin-top: 50px;
}

#main .reviewBox .summary {
	background: #555555;
	margin-top: 30px;
	padding: 20px;
	color: #FFFFFF;
	font-weight: 500;
	font-size: 20px;
	text-align: center;
}

.reviewBox .summaryData span+span {
	margin-left: 20px;
}

#main .summary .gr_logo {
	display: none;
}

#main .summary .reviewBox {
	background: none;
	padding: 0;
	margin: 0;
}

#main .summary .reviewBox ul {
	display: flex;
	justify-content: center;
	gap: 30px;
	margin-top: 10px;
}

#main .summary .reviewBox ul li {
	max-width: unset !important;
	margin: 0 !important;
	display: flex;
	align-items: center;
	gap: 10px;
}

#main .summary .reviewBox ul li .wp-google-place {
	background: none !important;
}

#main .summary .reviewBox ul li .gr_shopname {
	display: inline;
}

#main .summary .reviewBox ul li .wp-google-place {
	padding: 0 !important;
}

#main .summary .reviewBox ul li .wp-google-place img {
	display: none;
}

#main .summary .reviewBox .wp-google-powered,
#main .summary .reviewBox .wp-google-stars {
	display: none !important;
}

#main .summary .reviewBox>ul li .wp-google-rating::before {
	content: '★';
	color: #fb8e28;
}

#main .reviewBox .listView {
	max-width: 1100px;
	margin: 0 auto 0;
	padding: 0 100px;
}

#main .reviewBox ul li {
	max-width: 1100px;
	margin: 40px auto 0;
}

#main .reviewBox ul li .gr_shopname {
	display: none;
}

#main .reviewBox ul li .wp-google-place {
	background: #eeeeee !important;
	padding: 15px 20px 15px 20px !important;
	display: flex;
}

#main .reviewBox ul li .wp-gr.wpac .wp-google-place .wp-google-left img {
	width: 70px !important;
	height: 70px !important;
}

#main .reviewBox ul li .wp-google-content-inner {
	background-color: #FFFFFF !important;
	padding: 20px 30px !important;
	overflow-y: scroll;
	height: 300px;
}

#main .reviewBox ul li .wp-gr.wpac .wp-google-place .wp-google-right {
	display: flex !important;
	gap: 20px;
	align-items: center;
	width: auto !important;
}

#main .reviewBox ul li .wp-gr.wpac .wp-google-place .wp-google-powered {
	margin-top: 0 !important;
	display: flex;
	align-items: center;
}

@media (max-width: 1150px) {
	#main .reviewBox ul li {
		margin: 30px 20px 0;
	}

	#main .reviewBox ul li .wp-gr.wpac .wp-google-place .wp-google-left img {
		width: 50px !important;
		height: 50px !important;
	}

	#main .reviewBox ul li .wp-gr.wpac .wp-google-place .wp-google-right {
		flex-wrap: wrap;
		gap: 0 10px;
		flex: 1;
	}

	#contents #main .summary.inner {
		margin-right: 20px;
		margin-left: 20px;
	}

	#main .reviewBox .listView {
		max-width: 1100px;
		margin: 0 auto 0;
		padding: 0;
	}
}

@media (max-width: 599px) {
	#main .reviewBox .summary {
		font-size: 14px !important;
		padding: 10px;
	}

	#main .reviewBox .summary img {
		width: 120px;
	}

	#main .summary .reviewBox ul {
		gap: 5px !important;
	}

	#main .summary .reviewBox ul li {
		gap: 5px !important;
	}

	#main .reviewBox .summary .wp-gr .wp-google-rating {
		font-size: 14px !important;
		margin-right: 0;
	}

	#main .reviewBox {
		margin-top: 30px;
	}

	#main .reviewBox ul li {
		margin: 30px 20px 0;
	}

	#main .reviewBox ul li .wp-google-content-inner {
		padding: 0 15px !important;
	}

	#main .reviewBox ul li .wp-google-place {
		padding: 15px 10px !important;
	}

	#main .reviewBox ul li .wp-gr.wpac .wp-google-place .wp-google-left img {
		width: 50px !important;
		height: 50px !important;
	}

	#main .reviewBox ul li .wp-gr.wpac .wp-google-place .wp-google-right {
		flex-wrap: wrap;
		gap: 0 10px;
		flex: 1;
	}

	#main .reviewBox ul li .wp-google-content-inner {
		height: 200px;
	}
}

/*--------------------
 topAbout
--------------------*/
.topAbout {
	margin-top: 60px;
}

.topAbout h2.heading img {
	margin: 0 0 10px 0;
}

.topAbout .aboutItem {
	margin-top: 60px;
	display: flex;
	align-items: flex-start;
	gap: 40px;
}

.topAbout .aboutPhoto {
	flex: 1;
	position: relative;
}

.topAbout .aboutPhoto::before {
	content: '';
	position: absolute;
	width: 100%;
	height: 50%;
	display: block;
	/*	background: url(./img/bg_dline_lg.png) repeat #e4e4e4;*/
	background: #e4e4e4;
	bottom: 0;
	z-index: 1;
}

.topAbout .aboutPhoto .inner {
	width: 470px;
	position: relative;
	z-index: 2;
}

.topAbout .aboutItem:nth-of-type(1) .aboutPhoto .inner {
	margin: 0 40px 40px auto !important;
}

.topAbout .aboutItem:nth-of-type(2) .aboutPhoto .inner {
	margin: 0 auto 40px 40px !important;
}

.topAbout .aboutPhoto span {
	position: absolute;
	bottom: -20px;
	right: 0;
	z-index: 3;
}

.topAbout .aboutItem:nth-of-type(2) .aboutPhoto .inner span {
	background: #777777;
	color: #FFFFFF;
	padding: 20px;
	font-weight: 500;
	bottom: -100px;
	right: 20px;
}

.topAbout .aboutText {
	width: 550px;
}

.topAbout .aboutText h3 {
	background: #555555;
	color: #FFFFFF;
	font-size: 30px;
	font-size: 3.0rem;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	padding: 15px;
	position: relative;
}

.topAbout .aboutText h3::after {
	content: '';
	height: 2px;
	width: 100px;
	background: #444444;
	top: 20px;
	left: -30px;
	position: absolute;
	transform: rotate(-45deg);
}

.topAbout .aboutText h3 strong {
	font-size: 40px;
	font-size: 4.0rem;
	color: #f6ca44;
}

.topAbout .aboutText h4 {
	font-size: 30px;
	font-size: 3.0rem;
	line-height: 1.4;
	margin-top: 30px;
}

.topAbout .aboutText p {
	margin-top: 30px;
	font-weight: 500;
	line-height: 1.8;
}

.topAbout .aboutItem:nth-of-type(1) {
	margin-right: calc((100% - 1100px) / 2);
}

.topAbout .aboutItem:nth-of-type(2) {
	margin-left: calc((100% - 1100px) / 2);
	flex-direction: row-reverse;
}

@media (max-width: 1150px) {
	.topAbout .aboutText {
		width: calc((100% - 40px) / 2);
	}

	.topAbout .aboutItem:nth-of-type(1) .aboutPhoto .inner {
		width: auto;
		margin: 0 20px 20px auto !important;
	}

	.topAbout .aboutItem:nth-of-type(1) .aboutPhoto span {
		width: 30%;
	}

	.topAbout .aboutItem:nth-of-type(1) {
		margin-right: 20px;
	}

	.topAbout .aboutItem:nth-of-type(2) {
		margin-left: 20px;
	}

	.topAbout .aboutItem:nth-of-type(2) .aboutPhoto .inner {
		width: auto;
		margin: 0 auto 20px 20px !important;
	}

	.topAbout .aboutText h3 {
		font-size: 25px;
		font-size: 2.5rem;
	}

	.topAbout .aboutText h3 strong {
		font-size: 25px;
		font-size: 2.5rem;
	}

	.topAbout .aboutText h4 {
		font-size: 22px;
		font-size: 2.2rem;
	}
}

@media (max-width: 800px) {
	.topAbout {
		margin-top: 30px;
	}

	.topAbout h2.heading img {
		width: 250px;
		height: auto;
	}

	.topAbout .aboutItem {
		flex-direction: column;
		gap: 30px;
	}

	.topAbout .aboutItem:nth-of-type(1) {
		margin: 30px 0 0 0;
	}

	.topAbout .aboutItem:nth-of-type(1) .aboutPhoto {
		margin-left: 20px;
		width: calc(100% - 20px);
	}

	.topAbout .aboutItem:nth-of-type(1) .aboutPhoto .inner {
		padding: 0 20px 20px;
		margin: 0 !important;
		width: auto;
	}

	.topAbout .aboutItem:nth-of-type(1) .aboutPhoto span {
		width: 40%;
	}

	.topAbout .aboutText {
		width: auto;
	}

	.topAbout .aboutText {
		margin: 0 40px;
	}

	.topAbout .aboutText h3 {
		font-size: 20px;
		font-size: 2.0rem;
		padding: 10px;
	}

	.topAbout .aboutText h3 strong {
		font-size: 28px;
		font-size: 2.8rem;
	}

	.topAbout .aboutText h3::after {
		width: 80px;
		top: 10px;
	}

	.topAbout .aboutText h4 {
		font-size: 20px;
		font-size: 2.0rem;
		margin-top: 20px;
	}

	.topAbout .aboutText p {
		margin-top: 20px;
	}

	.topAbout .aboutText p.btnR,
	.topAbout .aboutText p.btnL {
		text-align: center;
	}

	.topAbout .aboutText p.btnR a,
	.topAbout .aboutText p.btnL a {
		width: 90%;
		max-width: unset;
	}

	.topAbout .aboutItem:nth-of-type(2) {
		flex-direction: column;
		margin: 30px 0 0 0;
	}

	.topAbout .aboutItem:nth-of-type(2) .aboutPhoto {
		margin-right: 20px;
		width: calc(100% - 20px);
	}

	.topAbout .aboutItem:nth-of-type(2) .aboutPhoto .inner {
		padding: 0 20px 20px;
		margin: 0 !important;
		text-align: right;
		width: auto;
	}

	.topAbout .aboutItem:nth-of-type(2) .aboutPhoto .inner span {
		font-size: 12px;
		font-size: 1.2rem;
		padding: 10px;
		bottom: 10px;
		right: 10px;
	}
}

/*--------------------
 topFirst
--------------------*/
.topFirst {
	background: #fff6da;
	padding: 50px 0;
	margin-top: 50px;
}

.topFirst h2 .catch {
	border-radius: 5px;
	border: solid 3px #333333;
	padding: 15px 40px;
}

.topFirst h2 .title {
	padding: 0 170px;
}

.topFirst .firstPhoto {
	margin-top: 40px;
	margin-left: calc((100vw - 1100px) / 2);
	position: relative;
	padding-bottom: 40px;
}

.topFirst .firstPhoto .inner {
	margin: 0 !important;
	text-align: center;
	position: relative;
	z-index: 2;
}

.topFirst .firstPhoto::before {
	content: '';
	position: absolute;
	width: 100%;
	height: 65%;
	display: block;
	/*	background: url(./img/bg_dline_ly.png) repeat #ffe699;*/
	background: #ffe699;
	bottom: 0;
	z-index: 1;
}

.topFirst .firstText {
	max-width: 1100px;
	margin: 30px auto 0;
}

.topFirst .firstText h3 {
	font-size: 30px;
	font-size: 3.0rem;
	font-weight: 700;
}

.topFirst .firstText h3+p {
	margin-top: 20px;
}

.topFirst .firstText p {
	margin-top: 40px;
	font-weight: 500;
}

@media (max-width: 1150px) {
	.topFirst h2 .catch {
		padding: 15px 20px;
	}

	.topFirst .firstPhoto {
		margin-top: 30px;
		margin-left: 20px;
		position: relative;
		padding-bottom: 20px;
	}

	.topFirst .firstPhoto .inner {
		z-index: 2;
		padding: 0 20px;
	}

	.topFirst .firstText {
		max-width: 1100px;
		margin: 20px 40px 0;
	}
}

@media (max-width: 800px) {
	.topFirst h2 .catch {

		font-size: 30px;
		font-size: 3.5vw;
	}
}

@media (max-width: 599px) {
	.topFirst {
		padding: 40px 0;
	}

	.topFirst h2 .catch {
		padding: 15px 20px;
	}

	.topFirst h2 .title {
		padding: 0 40px;
		font-size: 30px;
		font-size: 3.0rem;
	}

	.topFirst .firstText h3 {
		font-size: 20px;
		font-size: 2.0rem;
		font-weight: 700;
	}

	.topFirst .firstText h3+p {
		margin-top: 10px;
	}

	.topFirst .firstText p {
		margin-top: 20px;
	}

	.topFirst .firstText .btnC a {
		width: 100%;
	}
}

/*--------------------
 topArea
--------------------*/
.topArea {
	padding: 50px 50px 0;
	max-width: 1300px;
	min-height: 800px;
	margin: 0 auto;
	background: url(./img/area_map01.png) left bottom no-repeat;
}

.topArea.newMap {
	background: url(./img/new_area_map01.png) left bottom no-repeat;
	/* background-size: 140%; */
}

.topArea .areaCatch ul {
	margin-top: 50px;
	display: flex;
	gap: 30px;
	justify-content: center;
	align-items: center;
}

.topArea .areaCatch ul li {
	font-size: 28px;
	font-size: 2.8rem;
	font-weight: 700;
	line-height: 1;
	display: flex;
	gap: 10px;
	justify-content: center;
	align-items: center;
}

.topArea .areaCatch ul li:nth-child(1) {
	border-radius: 5px;
	border: solid 3px #333333;
	background-color: #FFFFFF;
	padding: 10px 15px;
}

.topArea .areaCatch ul li .num {
	display: inline-block;
	/*	background: url(./img/bg_dline_dg.png) repeat #555555;*/
	background: #555555;
	font-size: 48px;
	font-size: 4.8rem;
	color: #f6ca44;
	padding: 5px 15px 11px 15px;
}

.topArea .areaText {
	width: 590px;
	margin: 150px 0 0 auto;
}

.topArea .areaText h3 {
	font-size: 30px;
	font-size: 3.0rem;
}

.topArea .areaText p {
	margin-top: 40px;
	font-weight: 500;
}

@media (max-width: 1150px) {
	.topArea {
		background: url(./img/area_map01.png) center 140px no-repeat;
	}

	.topArea .areaText {
		width: auto;
		margin: 450px auto 0;
	}

	.topArea .areaText p {
		margin-top: 20px;
		font-weight: 500;
	}
}

@media (max-width: 599px) {
	.topArea.newMap {
		padding: 30px 20px 0;
		min-height: unset;
		margin: 0 auto;
		background: url(./img/area_map01.png) center 180px / 120% no-repeat;
	}

	.topArea .areaCatch ul {
		margin-top: 30px;
		gap: 10px;
	}

	.topArea .areaCatch ul li {
		font-size: 18px;
		font-size: 1.8rem;
		gap: 5px;
	}

	.topArea .areaCatch ul li:nth-child(1) {
		border-radius: 5px;
		border: solid 3px #333333;
		background-color: #FFFFFF;
		padding: 5px 5px;
	}

	.topArea .areaCatch ul li .num {
		font-size: 24px;
		font-size: 2.4rem;
		padding: 5px 5px 11px 5px;
	}

	.topArea .areaText {
		width: auto;
		margin: 0 auto;
	}

	.topArea .areaText h3 {
		font-size: 20px;
		font-size: 2.0rem;
		text-align: center;
		margin-top: 15px;
	}

	.topArea .areaText p {
		font-size: 14px;
		font-size: 1.4rem;
		margin-top: 400px;
		font-weight: 500;
	}

	.topArea .areaText p+p {
		margin-top: 10px;
	}
}

/*--------------------
 topFlow
--------------------*/
.topFlow {
	background: #fff6da;
	padding: 50px 0;
	margin-top: 50px;
}

.topFlow ol {
	max-width: 1100px;
	margin: 40px auto 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 40px;
}

.topFlow ol li {
	width: calc((100% - 80px)/3);
	background: #FFFFFF;
	box-shadow: 0 0 10px #e8e0c6;
	border-radius: 10px;
	padding: 30px;
	position: relative;
}

.topFlow ol li.flownum-reset {
	counter-reset: flownum 0;
}

.topFlow ol li h4 {
	font-size: 20px;
	font-size: 2.0rem;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	gap: 10px;
}

.topFlow ol li h4::before {
	counter-increment: flownum 1;
	content: counter(flownum, decimal-leading-zero);
	width: 32px;
	height: 32px;
	background: #f67644;
	border-radius: 50vh;
	line-height: 1;
	font-size: 20px;
	font-size: 2.0rem;
	font-weight: 500;
	color: #FFFFFF;
	display: flex;
	justify-content: center;
	align-items: center;
}

.topFlow ol li img {
	margin-top: 10px;
}

.topFlow ol li p {
	margin-top: 20px;
}

.topFlow ol li::after {
	content: '';
	width: 15px;
	height: 20px;
	background: url(./img/ico_tri01.png) no-repeat;
	background-size: contain;
	position: absolute;
	right: -28px;
	top: calc(50% - 10px);
}

.topFlow ol li:nth-child(3n)::after {
	content: none;
}

@media (max-width: 1150px) {
	.topFlow {
		padding: 50px 20px;
	}

	.topFlow ol li {
		padding: 10px;
	}

	.topFlow ol li h4 {
		font-size: 16px;
		font-size: 1.6rem;
		display: block;
		text-align: center;
	}

	.topFlow ol li h4::before {
		margin: 0 auto;
		font-size: 12px;
		font-size: 1.2rem;
	}
}

@media (max-width: 599px) {
	.topFlow {
		padding: 30px 0;
	}

	.topFlow ol {
		margin-top: 20px;
	}

	.topFlow ol li {
		padding: 30px;
	}

	.topFlow ol li h4 {
		font-size: 20px;
		font-size: 2.0rem;
		display: flex;
		text-align: unset;
	}

	.topFlow ol li h4::before {
		margin: unset;
		font-size: 20px;
		font-size: 2.0rem;
	}

	#topFlowSlide .slick-track {
		display: flex;
	}

	#topFlowSlide .slick-slide {
		height: auto !important;
		box-sizing: border-box;
		margin: 10px 20px;
	}

	.topFlow ol li::after {
		content: none;
	}

	.topFlow ol .slick-dots li {
		width: unset;
		background: unset;
		box-shadow: none;
		border-radius: unset;
		padding: 0;
	}

	#topFlowSlide {
		position: relative;
	}
}

/*--------------------
 topLine
--------------------*/

.topLine {
	max-width: 1100px;
	margin: 50px auto 0;
	background: #ededed;
	border: solid 3px #555555;
	border-radius: 10px;
	transition: 0.3s ease-out;
}

.topLine:hover {
	background: #fff6da;
}

.topLine a {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 20px 40px;
	width: 100%;
	height: 100%;
	padding: 40px;
	text-decoration: none;
	color: #222222 !important;
}

.topLine a .lineBtn {
	text-align: center;
	padding-top: 20px;
}

.formContact .topLine {
	background: #FFFFFF !important;
}

.formContact .topLine:hover {
	background: #fff6da;
}

@media (max-width: 1150px) {
	.topLine {
		margin: 50px 20px 0;
	}
}

@media (max-width: 599px) {
	.topLine {
		margin: 40px 20px 0;
	}

	.topLine a {
		padding: 20px;
		gap: 15px;
	}

	.topLine a .lineBtn {
		padding-top: 0;
	}
}

/*--------------------
 topOtherLink
--------------------*/
.topOtherLink {
	margin-top: 40px;
}

.topOtherLink ul {
	display: flex;
	justify-content: center;
	gap: 40px;
}

.topOtherLink ul li {
	display: block;
	width: 340px;
	border: solid 3px #555555;
	border-radius: 10px;
	transition: 0.3s ease-out;
}

.topOtherLink ul li a {
	color: #222222;
	display: block;
	padding: 30px;
	height: 100%;
}

.topOtherLink ul li:hover {
	background-color: #fff6da;
}

.topOtherLink ul li .otherTitle {
	text-align: center;
	font-size: 20px;
	font-size: 2.0rem;
	font-weight: 700;
	padding-top: 10px;
}

.topOtherLink ul li .otherExplan {
	border-top: dotted 2px #d3d3d3;
	padding-top: 10px;
	font-weight: 500;
	margin-top: 10px;
}

@media (max-width: 1150px) {
	.topOtherLink {
		margin: 40px 20px 0;
	}
}

@media (max-width: 599px) {
	.topOtherLink {
		margin: 20px 20px 0;
	}

	.topOtherLink ul {
		flex-direction: column;
		gap: 20px;
	}

	.topOtherLink ul li {
		width: 100%;
	}

	.topOtherLink ul li a {
		display: flex;
		flex-direction: row-reverse;
		align-items: center;
		padding: 0 0 0 10px;
		gap: 10px;
	}

	.topOtherLink ul li a .othePhoto {
		width: 160px;
		height: 160px;
		flex-shrink: 0;
	}

	.topOtherLink ul li a .othePhoto img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		border-radius: 0 7px 7px 0;
	}

	.topOtherLink ul li a .otheText {
		flex: 1;
	}

	.topOtherLink ul li .otherTitle {
		font-size: 18px;
		font-size: 4.5vmin;
		text-align: left;
		padding-top: 0;
	}

	.topOtherLink ul li .otherExplan {
		font-size: 13px;
		font-size: 3.5vmin;
	}
}

/*--------------------
 Instagram
--------------------*/
.instagram_feed h2 {
	/*	background: url(./img/bg_dline_dg.png) repeat #555555;*/
	background: #555555;
	color: #FFFFFF;
	text-align: center;
	font-size: 40px;
	font-size: 4.0rem;
	font-weight: 500;
	line-height: 1;
	padding: 25px 0;
	margin-top: 80px;
}

#sb_instagram {
	margin-top: 20px;
}

.sb_instagram_header {
	display: none;
}

.sbi_load_btn,
#sb_instagram .sbi_follow_btn a {
	min-width: 300px;
	background: #777777 !important;
	border: solid 2px #777777 !important;
	font-size: 20px !important;
	font-size: 2.0rem !important;
	font-weight: 500;
	margin-top: 15px !important;
	padding: 10px 0 !important;
	border-radius: 10px !important;
	transition: 0.3s ease-out;
}

#sb_instagram .sbi_follow_btn a {
	background: #FFFFFF !important;
	color: #777777 !important;
}

#sb_instagram .sbi_follow_btn a span::before {
	content: '';
	width: 30px;
	height: 30px;
	background-image: url(./img/bnr_instagram.png);
	background-repeat: no-repeat;
	background-size: contain;
	display: inline-block;
	vertical-align: middle;
	margin-right: 10px;
}

.sbi_load_btn:hover,
.sbi_load_btn:active,
.sbi_load_btn:focus,
#sb_instagram .sbi_follow_btn a:hover,
#sb_instagram .sbi_follow_btn a:active,
#sb_instagram .sbi_follow_btn a:focus {
	box-shadow: none !important;
}

.sbi_load_btn:active,
.sbi_load_btn:focus {
	color: #FFFFFF !important;
	background: #777777 !important;
}

.sbi_load_btn:hover {
	background: #FFFFFF !important;
	color: #777777 !important;
}

#sb_instagram .sbi_follow_btn a:hover {
	color: #FFFFFF !important;
	background: #777777 !important;
}

#sb_instagram .sbi_follow_btn a:active,
#sb_instagram .sbi_follow_btn a:focus {
	background: #FFFFFF !important;
	color: #777777 !important;
}

.sbi_follow_btn a svg {
	display: none !important;
}

@media (max-width: 599px) {
	.instagram_feed h2 {
		font-size: 23px;
		font-size: 6.5vmin;
		margin-top: 40px;
	}

	.sbi_load_btn,
	#sb_instagram .sbi_follow_btn a {
		font-size: 18px !important;
		font-size: 4.8vmin !important;
	}

	.sbi_load_btn {
		padding: 5px 0 !important;
	}

	#sb_instagram .sbi_follow_btn a {
		min-width: 200px !important;
	}
}

/*----------------------------------------
 ブログスタイル設定
----------------------------------------*/
.archiveList {
	display: flex;
	flex-wrap: wrap;
	gap: 60px 40px;
}

#blog .archiveList article {
	max-width: calc((100% - 40px)/2);
}

#blog .archiveList article a {
	color: #222222;
}

#blog .archiveList article a .mainThumb {
	overflow: hidden;
	border-radius: 5px;
}

#blog .archiveList article a .mainThumb img {
	width: 100%;
	height: 250px;
	object-fit: cover;
	transition: 0.3s ease-out;
}

#blog .archiveList article a:hover .mainThumb img {
	transform: scale(1.1);
}

#blog .archiveList .tax {
	margin-top: 10px;
}

#blog .archiveList h3 {
	margin-top: 10px;
	font-size: 20px;
	font-size: 2.0rem;
	line-height: 1.5;
	display: block;
	height: 3.2em;
}

#blog .archiveList p.explan {
	margin-top: 5px;
	font-size: 14px;
	font-size: 1.4rem;
}

#blog .archiveList p.time {
	text-align: right;
	font-size: 13px;
	font-size: 1.3rem;
	font-weight: 500;
}

@media (max-width: 599px) {
	.archiveList {
		gap: 30px;
	}

	#main .archiveList {
		margin: 0 20px;
	}

	#blog .archiveList article {
		max-width: unset;
		width: 100%;
	}

	#blog .archiveList article a {
		display: flex;
		align-items: flex-start;
		gap: 15px;
	}

	#blog .archiveList article a .mainThumb {
		width: 40%;
	}

	#blog .archiveList article a section {
		flex: 1;
	}

	#blog .archiveList article a .mainThumb img {
		width: 100%;
		height: 120px;
	}

	#blog .archiveList .tax,
	#blog .archiveList h3 {
		margin-top: 0 !important;
	}

	#blog .archiveList .tax+h3 {
		margin-top: 5px !important;
	}

	#blog .archiveList h3 {
		font-size: 15px;
		font-size: 1.5rem;
	}

	#blog .archiveList p.explan {
		display: none;
	}

	#blog .archiveList p.time {
		font-size: 12px;
		font-size: 1.2rem;
	}
}

/*----------------------------------------
 選ばれる理由
----------------------------------------*/
#reason #contents {
	margin: 40px 0 0;
}

#reason .reasonMsg p {
	font-size: 18px;
}

#reason .reasonList {
	margin-top: 40px;
	gap: 40px;
}

#reason .reasonList li {
	background: #555555;
	padding-bottom: 30px;
	position: relative;
}

#reason .reasonList li::before,
#reason .reasonList li::after {
	content: '';
	position: absolute;
	display: block;
}

#reason .reasonList li::before {
	width: 20px;
	height: 20px;
	background: #FFFFFF;
	border-radius: 50vh;
	bottom: 4px;
	right: calc(50% - 10px);
}

#reason .reasonList li::after {
	width: 8px;
	height: 8px;
	border-top: solid 3px #555555;
	border-right: solid 3px #555555;
	transform: rotate(135deg);
	background: transparent;
	margin: 0 0 0 0;
	bottom: 11px;
	right: calc(50% - 4px);
}

#reason .reasonList li a::before,
#reason .reasonList li a::after {
	content: none;
}

#reason .reasonList li a {
	padding: 20px;
	background-color: #FFFFFF;
	transition: 0.3s ease-out;
	height: 100%;
}

#reason .reasonList .reasonnum {
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	text-align: center;
	color: #777777;
	line-height: 1.2;
}

#reason .reasonList .reasonnum span {
	display: block;
	color: #222222;
	font-size: 30px;
	font-size: 3.0rem;
}

#reason .reasonListTtl {
	margin-top: 10px;
}

#reason .reasonList .reasonListTtl h4 {
	background: #fff6da;
	color: #222222;
	padding: 2px 2px;
	font-size: 24px;
	transition: 0.3s ease-out
}

#reason .reasonList .reasonListTtl p {
	margin-top: 5px;
	font-size: 18px;
	font-weight: 700;
}

#reason .reasonList .reasonListTtl p strong {
	color: #f67644;
}

#reason .reasonList li a:hover {
	background-color: #fff6da;
}

#reason .reasonList li a:hover .reasonListTtl h4 {
	background: #777777;
	color: #FFFFFF;
}

#reason #contents .contentBox,
#reason #contents .contentBox+.contentBox {
	clear: both;
}

#reason #contents .contentBox h2.reasonTitle {
	background: transparent;
	font-size: 40px;
	padding: 0 0 15px;
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1.2;
	gap: 10px;
	border-bottom: dotted 2px #d3d3d3;
}

#reason #contents .contentBox h2.reasonTitle .num {
	font-family: 'Roboto', sans-serif;
	font-size: 22px;
	background-color: #f6ca44;
	border-radius: 5px;
	width: 40px;
	height: 40px;
	text-align: center;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}

#reason #contents .contentBox h2.reasonTitle .num::before {
	width: 114px;
	height: 69px;
	content: '';
	display: block;
	position: absolute;
	background: url(./img/reason_en.png) 50% / contain no-repeat;
	top: -5px;
	left: -140px;
}

#reason #contents .contentBox p.reasonCatch {
	text-align: center;
	font-size: 35px;
	font-size: 3.5rem;
	font-weight: 700;
	line-height: 1.2;
}

.reasonCatch br {
	display: none;
}

.reasonCatch strong {
	color: #f67644;
}

.reasonFindingMsg {
	border: solid 1px #555555;
	border-radius: 10px;
	max-width: 600px;
	margin: 40px auto;
	padding: 30px;
	text-align: left;
	display: flex;
	gap: 40px;
	background-color: #FFFFFF;
}

.reasonFindingMsg strong {
	color: #f67644;
}

#contents .contentBox .reasonFindingMsg p {
	margin-top: 0;
	font-weight: 500;
}

#reason h3 {
	text-align: center;
}

#reason h3 strong {
	color: #f67644;
}

#reason h3 br {
	display: none;
}

@media (max-width: 599px) {

	#reason br,
	#reason h3 br {
		display: block;
	}

	#reason #contents .contentBox p.reasonCatch {
		font-size: 24px;
		font-size: 6.4vmin;
	}

	.reasonFindingMsg {
		margin: 30px 20px 0;
		gap: 20px;
		padding: 20px;
		font-size: 12px;
		font-size: 3.2vmin;
	}

	.inner .reasonFindingMsg {
		margin: 30px 0 0;
	}

	#reason #contents .contentBox .reasonFindingMsg p.reasonCatch {
		font-size: 20px;
		font-size: 5.4vmin;
	}
}

/*-- reason01 --*/
#reason #contents .contentBox.reasonQuality {
	margin-top: 80px;
}

.reasonRealize {
	margin-top: 40px;
	display: grid;
	gap: 40px;
	grid-template-columns: calc(50% - 20px) calc(50% - 20px);
	grid-template-rows: 1fr 1fr;
}

.reasonRealize .reasonRealize01 {
	grid-column: 1 / 2;
	grid-row: 1 / 3;
}

.reasonRealize .reasonRealize02 {
	grid-column: 2 / 3;
	grid-row: 1 / 2;
}

.reasonRealize .reasonRealize03 {
	grid-column: 2 / 3;
	grid-row: 2 / 3;
}

.reasonRealize .reasonRealize01,
.reasonRealize .reasonRealize02,
.reasonRealize .reasonRealize03 {
	border: solid 3px #555555;
	background-color: #FFFFFF;
	padding: 30px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
}

.reasonRealize .tit {
	font-weight: 700;
	font-size: 20px;
	text-align: center;
	line-height: 1.3;
	background: url(./img/ico_check01.png) left center / 40px no-repeat;
	width: 100%;
	margin-top: 0 !important;
}

.reasonRealize .tit strong {
	font-weight: 700;
	font-size: 30px;
	color: #f67644;
	display: block;
}

.reasonRealize .reasonRealize01 p.textCenter {
	margin-top: 15px !important;
}

.reasonRealize .reasonRealize01 img {
	width: 80%;
}

.reasonArea {
	margin-top: 60px;
	text-align: center;
}

/*-- reason02 --*/
#reason #contents .contentBox.reasonWarranty {
	background: #fff6da;
	margin-top: 60px;
	padding: 40px 0 60px;
}

.reasonWarranty ul.col2 li img {
	height: auto;
}

.reasonWarrantyWrap {
	display: flex;
	gap: 40px;
}

.reasonWarranty .reasonFindingMsg {
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background: #FFFFFF;
}

.reasonWarranty .reasonFindingMsg .reasonCatch br {
	display: block;
}

.reasonWarrantyActionText+.sub-heading05 {
	margin-top: 50px !important;
}

.reasonWarrantyActionText {
	display: flex;
	gap: 40px;
}

.reasonWarrantyActionText p {
	width: calc((100% - 40px)/2);
}

/*-- reason03 --*/
#reason #contents .contentBox.reasonExpert {
	margin-top: 60px;
}

#reason .reasonExpertAction h3 {
	text-align: left;
}

#reason .reasonExpertAction h3 .num {
	display: inline-block;
	font-family: 'Roboto', sans-serif;
	background: #ffe9a7;
	text-align: center;
	width: 35px;
	border-radius: 5px;
	margin-right: 10px;
}

.reasonExpertActionText+h3 {
	margin-top: 50px !important;
}

.reasonExpertActionText {
	display: flex;
	gap: 40px;
}

.reasonExpertActionText p {
	width: calc((100% - 40px)/2);
}

/*-- reason04 --*/
#reason #contents .contentBox.reasonSystem {
	background: #fff6da;
	margin-top: 60px;
	padding: 40px 0 60px;
}

#reason #contents .contentBox.reasonSystem p strong {
	color: #f67644;
}

.reasonSystemKanri {
	display: flex;
	gap: 40px;
}

.reasonSystemKanri .img,
.reasonSystemKanri ul {
	width: calc((100% - 40px)/2);
}

.reasonSystemKanri .label02 {
	margin-top: 0 !important;
}

.reasonSystemKanri ul li+li {
	margin-top: 10px !important;
}

.reasonSystemKanri ul li {
	padding: 10px 30px !important;
	border-radius: 5px !important;
}

.reasonSystemKanri ul li::before,
.reasonSystemKanri ul li::after {
	content: none !important;
}

.reasonSystemKanri ul li p:nth-child(2) {
	margin-top: 5px !important;
}

.reasonSystemKanri ul li:nth-child(1) {
	background: #f9c698;
}

.reasonSystemKanri ul li:nth-child(2) {
	background: #ffe699;
}

.reasonSystemKanri ul li:nth-child(3) {
	background: #aed9d4;
}

.reasonSystemAction h3 {
	position: relative;
	margin-top: 50px !important;
}

.reasonSystemAction h3 .balloon {
	background: #f67644;
	color: #FFFF;
	display: inline-block;
	font-size: 18px;
	padding: 10px 15px;
	line-height: 1;
	border-radius: 50vh;
	left: calc(50% - 13em);
	position: absolute;
	margin-right: 20px;
	top: -8px;
}

.reasonSystemAction h3 span.balloon::after {
	content: '';
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	position: absolute;
	border-top: 0.5rem solid #f67644;
	border-left: 1rem solid transparent;
	border-bottom: 0.5rem solid transparent;
	border-right: 1rem solid #f67644;
}

.reasonSystemActionText {
	display: flex;
	gap: 40px;
}

.reasonSystemActionText p {
	width: calc((100% - 40px)/2);
}

/*-- reason05 --*/
#reason #contents .contentBox.reasonDesign {
	margin-top: 60px;
}

.reasonDesignActionText {
	display: flex;
	gap: 40px;
}

.reasonDesignActionText p {
	width: calc((100% - 40px)/2);
}

/*-- reason06 --*/
#reason #contents .contentBox.reasonTotal {
	background: #fff6da;
	margin-top: 60px;
	padding: 40px 0 60px;
}

.reasonTotalReform .logo {
	text-align: center;
	font-weight: 700;
}

.reasonTotalReform p strong {
	color: #f67644;
}

#reason #contents .contentBox.reasonTotal .reasonFindingMsg {
	flex-direction: column;
}

#reason #contents .contentBox.reasonTotal .reasonCatch small {
	font-size: 60%;
}

#reason #contents .contentBox.reasonTotal .reasonCatch small br {
	display: block;
}

#reason #contents .contentBox.reasonTotal .note {
	display: block;
	max-width: 600px;
	margin: 20px auto 0;
}

@media (max-width: 1150px) {
	#reason .sub-heading01 {
		margin: 40px 20px 0;
	}

	#reason .reasonImg img {
		margin: 0 auto;
	}

	#reason .reasonMsg {
		text-align: center;
	}

	#reason .reasonList {
		margin: 20px 20px 0;
		gap: 40px;
	}
}

@media (max-width: 800px) {
	#reason .reasonMsg p {
		font-size: 18px;
		font-weight: 700;
	}

	#reason .reasonList {
		gap: 20px;
	}

	.reasonList li {
		width: calc((100% - 40px) / 2);
	}

	#reason .reasonList li a {
		padding: 10px;
		background-color: #FFFFFF;
		transition: 0.3s ease-out;
	}

	#reason .reasonListTtl {
		margin-top: 5px;
	}

	#reason .reasonList .reasonListTtl h4 {
		font-size: 20px;
	}

	#reason .reasonList .reasonListTtl p {
		font-size: 16px;
		line-height: 1.5;
	}

	.reasonRealize {
		gap: 20px;
		grid-template-columns: calc(50% - 10px) calc(50% - 10px);
	}

	.reasonRealize .reasonRealize01,
	.reasonRealize .reasonRealize02,
	.reasonRealize .reasonRealize03 {
		padding: 10px;
	}

	.reasonRealize .tit {
		font-size: 18px;
		font-size: 4.8vmin;
		padding: 0 0 0 30px;
		background: url(./img/ico_check01.png) left center / 25px no-repeat;
	}

	.reasonSystemKanri ul li {
		padding: 10px !important;
		font-size: 13px !important;
	}
}

@media (max-width: 599px) {
	#reason .reasonMsg p {
		font-size: 4.2vw;
	}

	#reason .reasonList .reasonListTtl p {
		font-size: 3.8vw;
	}

	#reason #contents .contentBox h2.reasonTitle {
		font-size: 28px;
		font-size: 7.5vmin;
	}

	#reason #contents .contentBox h2.reasonTitle .num::before {
		left: -120px;
	}

	#reason #contents .contentBox {
		margin: 30px 0 0;
	}

	/*-- reason01 --*/
	.reasonRealize {
		margin-top: 20px;
		display: flex;
		flex-direction: column;
		gap: 20px;
	}

	.reasonRealize .reasonRealize01,
	.reasonRealize .reasonRealize02,
	.reasonRealize .reasonRealize03 {
		padding: 15px;
		border-radius: 5px;
	}

	.reasonRealize .tit {
		font-size: 18px;
		font-size: 4.8vmin;
		padding: 0 0 0 30px;
		background: url(./img/ico_check01.png) left center / 25px no-repeat;
	}

	.reasonRealize .tit strong {
		font-size: 25px;
		font-size: 6.7vmin;
	}

	.reasonAreaMap {
		margin-top: 0 !important;
		overflow: hidden;
	}

	.reasonAreaMap+p {
		margin: 0 20px;
		text-align: left;
	}

	.reasonQuality .btnC a {
		width: 80%;
	}

	/*-- reason02 --*/
	#reason #contents .contentBox.reasonWarranty {
		margin-top: 40px;
		padding: 20px 0 40px;
	}

	.reasonWarranty .reasonCatch+.textCenter {
		text-align: left !important;
	}

	#contents .contentBox .label01 {
		margin-top: 0;
	}

	.reasonWarrantyWrap {
		flex-direction: column;
		gap: 20px;
	}

	.reasonWarrantyWrap p.img {
		margin-top: 0 !important;
		text-align: center;
	}

	.reasonWarrantyWrap p.img img {
		width: 70%;
	}

	.reasonWarrantyActionText {
		flex-direction: column;
		gap: 20px;
	}

	.reasonWarrantyActionText p {
		width: 100%;
	}

	.reasonWarrantyActionText p+p {
		margin-top: 0 !important;
	}

	/*-- reason03 --*/
	#reason #contents .contentBox.reasonExpert {
		margin-top: 40px;
	}

	#reason .reasonExpertAction h3 {
		font-size: 18px;
		font-size: 4.7vmin;
	}

	#reason .reasonExpertAction h3 .num {
		width: 25px;
	}

	.reasonExpertActionText {
		flex-direction: column;
		gap: 20px;
	}

	.reasonExpertActionText p {
		width: 100%;
	}

	.reasonExpertActionText p+p {
		margin-top: 0 !important;
	}

	/*-- reason04 --*/
	#reason #contents .contentBox.reasonSystem {
		margin-top: 40px;
		padding: 20px 0 40px;
	}

	.reasonSystemKanri {
		flex-direction: column;
		gap: 20px;
	}

	.reasonSystemKanri .img,
	.reasonSystemKanri ul {
		width: 100%;
	}

	.reasonSystemKanri ul {
		display: flex;
		gap: 10px;
		margin-top: 10px !important;
	}

	.reasonSystemKanri ul li {
		margin-top: 0 !important;
		width: calc((100% - 20px)/3) !important;
		padding: 10px !important;
		font-size: 12px !important;
	}

	.reasonSystemKanri ul li+li {
		margin: 0 !important;
	}

	.reasonSystemAction h3 .balloon {
		font-size: 12px;
		left: 0;
		padding: 10px 10px;
	}

	.reasonSystemActionText {
		flex-direction: column;
		gap: 20px;
	}

	.reasonSystemActionText p {
		width: 100%;
	}

	.reasonSystemActionText p+p {
		margin-top: 0 !important;
	}

	/*-- reason05 --*/
	#reason .bnrColorsimulation {
		margin: 20px 0 0;
		padding: 0;
	}

	.reasonDesign .bnrColorsimulation+.reasonCatch {
		text-align: left !important;
	}

	.reasonDesignActionText {
		flex-direction: column;
		gap: 20px;
	}

	.reasonDesignActionText p {
		width: 100%;
	}

	.reasonDesignActionText p+p {
		margin-top: 0 !important;
	}

	/*-- reason06 --*/
	#reason #contents .contentBox.reasonTotal {
		margin-top: 40px;
		padding: 20px 0 40px;
	}

	.reasonTotalReform .logo img {
		width: 70%;
		margin: 0 auto;
	}

	.reasonTotal .reasonFindingMsg .imgC {
		max-width: 40% !important;
	}

	#reason #contents .contentBox.reasonTotal .note {
		font-size: 12px;
		font-size: 3.2vmin;
		margin: 20px 20px 0;
	}
}

/*----------------------------------------
 スタッフ紹介
----------------------------------------*/
#staff .staffList {
	display: flex;
	gap: 60px 40px;
	flex-wrap: wrap;
}

#staff .staffList li {
	width: calc((100% - 80px)/3);
}

#staff .staffList li a {
	width: 100%;
	height: 100%;
	display: block;
	text-align: center;
	color: #222222;
	font-weight: 700;
}

#staff .staffList li .mainThumb {
	width: 100%;
	height: 300px;
	overflow: hidden;
	border-radius: 5px;
}

#staff .staffList li .mainThumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: 0.3s ease-out;
}

#staff .staffList li a:hover .mainThumb img {
	transform: scale(1.1);
}

#staff .staffList .staffTextPosition,
.staffTextPosition {
	margin-top: 10px;
	display: inline-block;
	background: #777777;
	color: #FFFFFF;
	padding: 5px 10px;
	line-height: 1;
	border-radius: 5px;
	font-size: 12px;
	font-size: 1.2rem;
}

#staff .staffList .staffTextName,
.staffTextName {
	font-size: 20px;
	font-size: 2.0rem;
}

/*-- singleウインドウ --*/
#staff.staffCbox {
	padding-top: 0;
}

#staff.staffCbox #contents {
	margin: 0 auto;
}

#staff.staffCbox #contents #main {
	padding: 30px;
}

.staffProf {
	display: flex;
	gap: 40px;
}

.staffProf .staffPict {
	width: 30%;
}

.staffProf .staffPict li,
.staffProf .staffPict .mainpic {
	width: 100%;
	height: 300px;
}

.staffProf .staffPict li img,
.staffProf .staffPict .mainpic img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.staffProf .profileDetail {
	flex: 1;
}

#staff.staffCbox .positionTxt span {
	display: inline-block;
	background: #777777;
	color: #FFFFFF;
	padding: 5px 10px;
	line-height: 1;
	border-radius: 5px;
	font-size: 12px;
	font-size: 1.2rem;
	font-weight: 700;
}

#staff.staffCbox .positionTxt span+span {
	margin-left: 10px;
}

#staff.staffCbox .positionTxt span:last-child {
	background: #f6ca44;
	color: #222222;
}

#staff.staffCbox .staffName,
.staffName {
	font-size: 24px;
	font-weight: 700;
	margin: 10px 0;
}

#staff.staffCbox .staffName .en {
	margin-left: 10px;
	font-size: 18px;
	color: #999999;
}

.staffProf .profileDetail dl dt {
	background: #fff6da;
	font-size: 15px;
	font-weight: 700;
	display: block;
	padding: 3px 10px;
	margin: 15px 0 10px;
}

#staff.staffCbox #contents #main .btnC {
	margin-top: 30px;
}

#staff.staffCbox #contents #main .btnC a {
	max-width: 200px;
}

#staff.staffCbox #contents #main .btnC a span {
	padding: 15px 50px 15px 20px;
}

@media (max-width: 1150px) {
	#staff #contents #main {
		padding: 0 20px;
	}

	.staffProf .staffPict li,
	.staffProf .staffPict .mainpic {
		width: 100%;
		height: 250px;
	}
}

@media (max-width: 800px) {
	#staff .staffList {
		display: flex;
		gap: 40px 30px;
		flex-wrap: wrap;
	}

	#staff .staffList li {
		width: calc((100% - 30px)/2);
	}
}

@media (max-width: 599px) {
	#staff .staffList li {
		width: 100%;
	}

	#staff .staffList li .mainThumb {
		height: 90vw;
	}

	.staffProf {
		flex-direction: column;
	}

	.staffProf .staffPict {
		width: 100%;

	}

	.staffProf .staffPict li,
	.staffProf .staffPict .mainpic {
		width: 100%;
		height: 90vw;
	}
}

/*----------------------------------------
 お問い合わせ
----------------------------------------*/
#contact #contents {
	margin: 30px auto 0;
}

.contentBox.contactMsg {
	display: flex;
	gap: 40px;
	flex-direction: row-reverse;
	margin-bottom: 60px;
}

.contentBox.contactMsg .msgPhoto {
	width: 35%;
}

.contentBox.contactMsg .msgPhoto img {
	width: 100%;
}

.contentBox.contactMsg .overflowH {
	flex: 1;
}

.contentBox.contactMsg .overflowH>p:nth-of-type(1) {
	margin-top: 0 !important;
}

.contentBox.contactMsg .ctaTel {
	text-align: left;
	margin-top: 10px !important;
}

.contactMsg .catchTxt {
	line-height: 1.4;
	font-size: 18px;
}

.contactMsg .catchTxt span {
	display: inline-block;
	background-color: #444444;
	border-radius: 4px;
	padding: 7px 10px;
	margin-right: 5px;
	font-weight: 700;
	color: #FFF;
}

.contactMsg .catchTxt strong {
	color: #de431f;
	font-weight: 700;
}

@media (max-width: 800px) {

	#contact .contentBox.contactMsg,
	.contactMsg {
		flex-direction: column !important;
		display: flex !important;
		gap: 40px !important;
		margin-bottom: 30px !important;
	}

	#contact .contentBox.contactMsg .msgPhoto,
	.contactMsg .msgPhoto {
		width: 100% !important;
		text-align: center !important;
	}

	#contact .contentBox.contactMsg .ctaTel,
	.contentBox.contactMsg .ctaTel {
		text-align: center !important;
		margin-top: 20px !important;
		line-height: 1 !important;
	}
}

/*----------------------------------------
 会社概要
----------------------------------------*/
.pholosophyBox {
	font-family: fot-tsukuaoldmin-pr6n, "Hiragino Mincho ProN", "游明朝", "游明朝体", YuMincho, "Yu Mincho", "Times New Roman", "メイリオ", Meiryo, serif;
	font-style: normal;
	font-weight: 300;
	max-width: 1100px;
	margin: 60px auto;
	text-align: center;
	font-feature-settings: "palt";
}

.pholosophyBox h3 {
	font-size: 30px;
	font-weight: 300;
}

.pholosophyBox p {
	margin-top: 15px;
	line-height: 1.8;
}

.pholosophyBox p:nth-of-type(1) {
	margin-top: 40px;
}

.pholosophyBox .img {
	margin-top: 30px;
}

.pholosophyBox img {
	max-width: 600px;
}

#contents .contentBox.outline table th,
#contents .contentBox.outline table td {
	border-width: 1px 0 !important;
	padding: 20px;
	font-size: 15px;
	font-size: 1.5rem;
}

.outline table {
	width: unset !important;
	max-width: 1000px;
	margin: 0 auto;
}

#contents .contentBox.lifeStyleCenter {
	margin-top: 60px !important;
	padding: 40px 0 60px 0;
	background: #fff6da;
}

#contents #main .lifeStyleCenter .inner {
	max-width: 1000px;
}

#contents #main .lifeStyleCenter h3 {
	text-align: center;
	padding: 0 0 15px;
	line-height: 1.2;
	border-top: none;
	border-bottom: dotted 2px #d3d3d3;
}

#contents #main .lifeStyleCenter li {
	border-radius: 5px;
	background-color: #FFFFFF;
	box-shadow: 0 0 10px #e8e0c6;
	overflow: hidden;
}

#contents #main .lifeStyleCenter li div {
	padding: 20px;
}

#contents .contentBox.lifeStyleCenter h4 {
	font-size: 20px;
	margin-top: 0;
	text-align: center;
	padding: 10px;
}

#contents .contentBox.lifeStyleCenter .centerExplan p {
	margin-top: 0;
}

#contents .contentBox.lifeStyleCenter .centerExplan p.add {
	margin-bottom: 10px;
}

#contents .contentBox.lifeStyleCenter .time {
	background: url(./img/ico_time.png) no-repeat left center;
	background-size: 18px;
	margin-right: 10px;
	padding-left: 20px;
}

#main .contentBox.lifeStyleCenter .date {
	font-size: 12px;
}

#main .contentBox.lifeStyleCenter .parking {
	background: url(./img/ico_parking.png) no-repeat left center;
	background-size: 18px;
	margin-right: 15px;
	padding-left: 20px;
}

#main .contentBox.lifeStyleCenter .note {
	background: url(./img/ico_kids.png) no-repeat left center;
	background-size: 18px;
	padding-left: 20px;
}

#corporate .companyInfo {
	border-bottom: none;
	margin: 40px auto 0;
	padding: 0;
	max-width: 1100px;
}

#corporate .companyInfo a {
	color: #222222;
}

@media (max-width: 1150px) {
	.pholosophyBox {
		padding: 0 20px;
	}

	#corporate .companyInfo {
		padding: 0 20px;
	}
}

@media (max-width: 1000px) {
	.pholosophyBox img {
		max-width: 90%;
	}

	#contents .contentBox.outline table th,
	#contents .contentBox.outline table td {
		display: block;
		width: 100%;
		padding: 10px;
		font-size: 15px;
		font-size: 1.5rem;
		border-bottom: 0;
	}

	#contents .contentBox.outline table td {
		border-top: 0;
	}

	#contents .contentBox.lifeStyleCenter {
		padding: 30px 20px 40px;
	}

	#contents .contentBox.lifeStyleCenter h4 {
		font-size: 16px;
	}

	#contents #main .lifeStyleCenter li div {
		padding: 15px;
	}

	#main .contentBox.lifeStyleCenter .date {
		display: block;
	}
}

@media (max-width: 599px) {
	.pholosophyBox h3 {
		font-size: 24px;
		font-size: 6.0vmin;
	}

	.pholosophyBox p {
		font-size: 12px;
		font-size: 3.0vmin;
	}

	#contents .contentBox.lifeStyleCenter {
		margin: 30px 0 !important;
	}
}


/*----------------------------------------
 施工事例
----------------------------------------*/
/*-- archive --*/
#works .topWorksTaxList {
	margin-top: 40px;
}

#works .contentBox.contactMsg {
	margin-top: 80px;
	margin-bottom: 0;
}

#works .archiveList {
	margin-top: 60px;
}

#works .archiveList ul {
	display: flex;
	gap: 40px;
	flex-wrap: wrap;
}

#works .archiveList ul li {
	width: calc((100% - 80px)/3);
}

#works .archiveList li a {
	color: #222222;
}

#works .archiveList li .mainThumb {
	overflow: hidden;
	border-radius: 5px;
}

#works .archiveList li .mainThumb img {
	width: 100%;
	height: 240px;
	object-fit: cover;
	transition: 0.3s ease-out;
}

#works .archiveList li a:hover .mainThumb img {
	transform: scale(1.1);
}

#works .archiveList li p.tax {
	margin-top: 10px;
	overflow: hidden;
	height: 1.5em;
}

#works .archiveList li .customer {
	margin: 10px 0 0;
	font-weight: 700;
}

#works .archiveList li h3 {
	margin: 5px 0 0;
	font-size: 14px;
	font-weight: 400;
	display: block;
	height: 3.5em;
	overflow: hidden;
}

#works .archiveList li .price {
	margin: 5px 0 0;
	font-weight: 500;
	display: inline-block;
	border: solid 1px #777777;
	line-height: 1;
	padding: 5px 10px 6px;
}

#works .archiveList li .time {
	margin: 5px 0 0;
	text-align: right;
	font-size: 14px;
	font-size: 1.4rem;
	color: #999999;
	font-weight: 500;
}

/*-- single --*/
.infoBox+.picBox {
	margin-top: 30px;
}

.picBox {
	display: flex;
	gap: 20px;
}

.picBox+.picBox {
	margin-top: 40px;
	padding-top: 40px;
	border-top: solid 1px #CCCCCC;
}

.picBox img {
	width: 100%;
}

.othePhoto {
	margin-top: 40px;
}

.picBox a {
	display: block;
}

.picBox .btmPhoto {
	width: 35%;
	position: relative;
}

.picBox .photo {
	flex: 1;
	position: relative;
}

.picBox .btmPhoto a {
	width: 100%;
	height: 300px;
	overflow: hidden;
}

.picBox .photo a {
	width: 100%;
	height: 500px;
	overflow: hidden;
}

.picBox .btmPhoto a img,
.picBox .photo a img {
	object-fit: cover;
	transition: 0.3s ease-out;
	width: 100%;
	height: 100%;
}

.picBox span.before,
.picBox span.after {
	display: inline-block;
	position: absolute;
	background: #555555;
	color: #FFFFFF;
	font-weight: 700;
	padding: 2px 10px;
	border-radius: 5px;
	top: 5px;
	left: 5px;
}

.picBox span.after {
	background: #f6ca44;
	color: #222222;
}

.picBox span.before span,
.picBox span.after span {
	color: #CCCCCC;
	margin-left: 5px;
}

.picBox span.after span {
	color: #FFFFFF;
}

.worksData table th,
.worksData table td {
	border-width: 1px 0 !important;
	padding: 20px !important;
}

.worksData table th {
	width: 20%;
}

#works .staffProf {
	margin-top: 40px;
}

#works .staffCom {
	line-height: 1.8;
	flex: 1;
}

#works .staffText {
	text-align: center;
	line-height: 1.2;
}

#works .staffProf .staffPict .mainpic a {
	overflow: hidden;
	display: block;
	border-radius: 5px;
	height: 250px;
	height: 100%;
}

#works .staffProf .staffPict .mainpic img {
	width: 100%;
	object-fit: cover;
	transition: 0.3s ease-out;
}

#works .staffProf .staffPict .mainpic a:hover img {
	transform: scale(1.1);
}

@media (max-width: 1150px) {
	#works #contents #main {
		margin: 0 20px;
	}

	#works .topWorksTaxList {
		margin: 40px 0 0 !important;
	}

	#works .archiveList ul li {
		width: calc((100% - 40px) / 2);
	}

	.picBox .btmPhoto a {
		height: 250px;
	}

	.picBox .photo a {
		height: 400px;
	}
}

@media (max-width: 599px) {
	#works #contents #main {
		margin: 0 0;
	}

	#works .topWorksTaxList {
		margin: 20px 20px 0 !important;
	}

	#works .archiveList ul li {
		width: 100%;
	}

	#works .archiveList li h3 {
		height: auto;
	}

	#works .sub-heading02 {
		margin-left: 20px;
		margin-right: 20px;
		font-size: 24px;
	}

	#works .sub-heading03 {
		margin-left: 20px;
		margin-right: 20px;
	}

	#contents .contentBox.worksData table th,
	#contents .contentBox.worksData table td {
		display: block;
		width: 100%;
		font-size: 15px;
		font-size: 1.5rem;
		border-bottom: 0;
		padding: 10px !important;
	}

	#contents .contentBox.worksData table td {
		border-top: 0;
	}

	.picBox {
		margin: 0 20px;
		flex-direction: column-reverse;
	}

	.picBox .photo {
		width: 100%;
	}

	.picBox .btmPhoto {
		width: 70%;
		margin: 0 auto;
	}

	.picBox .photo a {
		height: calc((100vw - 40px) * 0.7);
	}

	.picBox .btmPhoto a {
		height: calc((100vw - 40px) * 0.7 * 0.7);
	}

	#works .staffProf {
		margin: 30px 20px;
	}
}

/*----------------------------------------
 お客様の声
----------------------------------------*/
#voice #contents {
	margin: 30px 0 0;
}

/*-- archive --*/
#voice .contentBox.contactMsg {
	margin-top: 80px;
	margin-bottom: 0;
}

#voice .archiveList {
	margin-top: 40px;
}

#voice .archiveList ul {
	display: flex;
	gap: 40px;
	flex-wrap: wrap;
}

#voice .archiveList ul li {
	width: calc((100% - 80px)/3);
}

#voice .archiveList li a {
	color: #222222;
}

#voice .archiveList li .mainThumb {
	overflow: hidden;
	border-radius: 5px;
}

#voice .archiveList li .mainThumb img {
	width: 100%;
	height: 240px;
	object-fit: cover;
	transition: 0.3s ease-out;
	overflow: hidden;
}

#voice .archiveList li a:hover .mainThumb img {
	transform: scale(1.1);
}

#voice .archiveList li p.tax {
	margin-top: 10px;
	overflow: hidden;
	height: 1.5em;
}

#voice .archiveList li h3 {
	margin: 5px 0 0;
	font-size: 16px;
	font-weight: 700;
	display: block;
	height: 3.5em;
	overflow: hidden;
}

#voice .archiveList li .time {
	margin: 5px 0 0;
	text-align: right;
	font-size: 14px;
	font-size: 1.4rem;
	color: #999999;
	font-weight: 500;
}

/*-- single --*/
.voicephotList {
	margin-top: 30px;
	display: flex;
	gap: 40px;
	justify-content: center;
}

.voicephotList li {
	width: calc((100% - 40px)/2);
}

.voicephotList li a {
	display: block;
	height: calc((100% -40px) /2 * 0.7);
	overflow: hidden;
}

.voicephotList li img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: 0.3s ease-out;
}

.voicephotList li a:hover img {
	transform: scale(1.1);
}

#voice .qa h4::before {
	content: 'Q';
	display: inline-block;
	color: #FFFFFF;
	font-family: 'Roboto', sans-serif;
	background: #f67644;
	text-align: center;
	width: 30px;
	border-radius: 5px;
	margin-right: 10px;
}

.voiceData table th,
.voiceData table td {
	border-width: 1px 0 !important;
	padding: 20px !important;
}

.voiceData table th {
	width: 20%;
}

@media (max-width: 1150px) {
	#voice #contents #main>.inner {
		margin: 0 20px;
	}

	#voice .archiveList ul li {
		width: calc((100% - 40px) / 2);
	}

	.voicephotList li a {
		height: calc((100vw - 40px) /2 * 0.7);
	}
}

@media (max-width: 599px) {
	#voice #contents #main .inner {
		margin: 0 0;
	}

	#voice #contents #main .contactMsg {
		margin: 80px 20px 0;
	}

	#voice .archiveList ul li {
		width: 100%;
	}

	#voice .archiveList li h3 {
		height: auto;
	}

	.voicephotList {
		flex-direction: column;
		margin: 30px 20px;
	}

	.voicephotList li {
		width: 100%;
	}

	.voicephotList li a {
		height: calc(100vw * 0.7);
	}

	#voice .sub-heading02 {
		margin-left: 20px;
		margin-right: 20px;
		font-size: 24px;
	}

	#voice .sub-heading03 {
		margin-left: 20px;
		margin-right: 20px;
	}

	#contents .contentBox.voiceData table th,
	#contents .contentBox.voiceData table td {
		display: block;
		width: 100%;
		font-size: 15px;
		font-size: 1.5rem;
		border-bottom: 0;
		padding: 10px !important;
	}

	#contents .contentBox.voiceData table td {
		border-top: 0;
	}

	#voice .qa h4 {
		font-size: 18px;
		font-size: 4.5vmin;
	}
}

/*----------------------------------------
 イベント情報
----------------------------------------*/
#event #contents {
	margin: 30px 0 0;
}

/*-- archive --*/
#event .contentBox.contactMsg {
	margin-top: 80px;
	margin-bottom: 0;
}

#event .archiveList {
	margin-top: 40px;
}

#event .archiveList ul {
	display: flex;
	gap: 40px;
	flex-wrap: wrap;
}

#event .archiveList ul li {
	width: calc((100% - 80px)/3);
}

#event .archiveList li a {
	color: #222222;
}

#event .archiveList li .mainThumb {
	overflow: hidden;
	border-radius: 5px;
	position: relative;
	background-color: #222222;
}

#event .archiveList li .mainThumb img {
	width: 100%;
	height: 240px;
	object-fit: cover;
	transition: 0.3s ease-out;
	overflow: hidden;
}

#event .archiveList li a:hover .mainThumb img {
	transform: scale(1.1);
}

#event .archiveList li .mainThumb.mainThumb02 img {
	opacity: 0.2;
}

#event .archiveList li .mainThumb span {
	position: absolute;
	top: 5px;
	left: 5px;
	color: #FFFFFF;
	padding: 10px 10px;
	font-weight: 700;
	line-height: 1;
	border-radius: 5px;
}

#event .archiveList li .mainThumb span.color-gray {
	top: calc(50% - 18px);
	left: calc(50% - 42px);
}

#event .archiveList li p.tax {
	margin-top: 10px;
	overflow: hidden;
	height: 1.5em;
}

#event .archiveList li h3 {
	margin: 5px 0 0;
	font-size: 16px;
	font-weight: 700;
	display: block;
	height: 3.5em;
	overflow: hidden;
}

#event .archiveList li p {
	padding-left: 25px;
	font-size: 15px;
}

#event .archiveList li .date {
	background: url(./img/ico_calendar.png) left center / 18px no-repeat;
}

#event .archiveList li .time {
	background: url(./img/ico_time.png) left center / 18px no-repeat;
}

/*-- single --*/
#event article .dateText {
	display: block;
	padding-left: 30px;
	background: url(./img/ico_calendar.png) left center / 20px no-repeat;
	font-size: 24px;
}

#event article .infoBox {
	display: flex;
	justify-content: space-between;
}

#event article .infoBox span.color {
	background: #777777;
	color: #FFFFFF !important;
	text-decoration: none !important;
	padding: 3px 7px;
	line-height: 1;
	border-radius: 5px;
	border: solid 2px #777777;
	font-size: 12px;
	font-size: 1.2rem;
	font-weight: 700;
	transition: 0.4s ease;
}

#event article .event_flie {
	margin-top: 20px;
}

#event article .contentBox .eventTable {
	margin-top: 40px;
}

#event article .contentBox .eventTable th,
#event article .contentBox .eventTable td {
	border-width: 1px 0;
	padding: 20px;
}

#event article .contentBox .eventTable td ul,
#event article .contentBox .eventTable td p {
	margin-top: 0;
}

#event article .contentBox .eventTable td p.date {
	padding-left: 25px;
	background: url(./img/ico_calendar.png) left center / 18px no-repeat;
}

#event article .contentBox .eventTable td p.time {
	padding-left: 25px;
	background: url(./img/ico_time.png) left center / 18px no-repeat;
}

#event article .contentBox .eventTable td .mapLink {
	display: inline-block;
	margin-left: 10px;
}

#event article .contentBox.eventBtn,
#event article .contentBox.freeText,
#event article .contentBox.access {
	margin-top: 40px !important;
}

#event article .contentBox.eventBtn .btnC a span::after {
	transform: rotate(135deg);
	top: calc(50% - 5px);
	right: 26px;
}

#event article .contentBox.access {
	margin-bottom: 50px;
}

#event article .contentBox.access iframe {
	margin-top: 10px !important;
}

#event .formContact .contactTel {
	text-align: center;
	margin-top: 50px;
}

#event .formContact .contactTel h4 {
	/*    background: url(./img/contact01_catch.png) repeat #555555;*/
	background: #555555;
	color: #FFFFFF;
	font-size: 20px;
	font-size: 2.0rem;
	font-weight: 700;
	padding: 5px 0;
	max-width: 500px;
	margin: 0 auto;
}

#event .formContact .contactTel .ctaTel {
	margin-top: 20px;
}

@media (max-width: 1150px) {
	#event #contents #main>.inner {
		margin: 0 20px;
	}

	#event .archiveList ul li {
		width: calc((100% - 40px) / 2);
	}
}

@media (max-width: 800px) {
	#event #contents #main .inner.contactTel {
		margin: 30px 20px 0;
	}
}

@media (max-width: 599px) {
	#event #contents #main .inner {
		margin: 0 0;
	}

	#event #contents #main .contactMsg {
		margin: 80px 20px 0;
	}

	#event .archiveList ul li {
		width: 100%;
	}

	#event .archiveList li h3 {
		height: auto;
	}

	#contents .contentBox table.eventTable th,
	#contents .contentBox table.eventTable td {
		display: block;
		width: 100%;
		font-size: 15px;
		font-size: 1.5rem;
		border-bottom: 0;
		padding: 10px !important;
	}

	#contents .contentBox table.eventTable td {
		border-top: 0;
	}

	#event article .contentBox.eventBtn .btnC a span::after {
		right: 16px;
	}

	#event article .contentBox.access h4 {
		font-size: 18px;
		font-size: 4.3vmin;
		margin-top: 20px;
	}

	#event .formContact .contactTel h4 {
		font-size: 18px;
		font-size: 4.3vmin;
	}

	#event .formContact .formBox {
		margin-top: 20px;
	}
}

/*----------------------------------------
 ショールーム
----------------------------------------*/
#showroom #contents {
	margin: 30px auto 0;
}

.featureBox {
	max-width: 1100px;
	margin: 50px auto 0;
	display: flex;
	gap: 10px;
	/*	background: url(./img/bg_dline_dg.png) repeat #555555;*/
	background: #555555;
}

.featureBox p {
	width: calc((100% - 10px)/2);
}

.featureBox p img {
	object-fit: cover;
	display: block;
	height: 100%;
}

.featureBox ul {
	flex: 1;
	padding: 10px 10px 10px 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.featureBox li {
	display: flex;
	height: calc((100% - 20px)/3);
	background-color: #FFFFFF;
	border-radius: 5px;
	gap: 10px;
	padding: 10px;
}

.featureBox li h4 {
	background: #f6ca44;
	width: 100px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 20px;
	font-weight: 700;
}

.featureBox li p {
	flex: 1;
	display: flex;
	align-items: center;
}

#showroom #main .sub-heading02 {
	margin: 40px auto 0;
	max-width: 1100px;
}

.showroomDetail {
	display: flex;
	gap: 40px;
	flex-wrap: wrap;
}

#contents .contentBox ul.showroomDetail li {
	margin: 0;
	padding: 0;
	width: calc((100% - 40px)/2)
}

#contents .contentBox ul.showroomDetail li::before,
#contents .contentBox ul.showroomDetail li::after {
	content: none;
}

#contents .contentBox ul.showroomDetail li img {
	width: 100%;
	height: 330px;
	object-fit: cover;
	margin-bottom: 8px;
}

.shopAccess {
	margin: 60px 0 0 0 !important;
}

#contents .contentBox .shopAccess ul li::before,
#contents .contentBox .shopAccess ul li::after {
	content: none;
}

#contents .contentBox .shopAccess ul li {
	margin: 0;
	padding: 0;
}

#contents .contentBox .shopAccess ul li .col2 {
	margin: 20px 0 0 0 !important;
}

#contents .contentBox .shopAccess table td.telno p,
#contents .contentBox .shopSummeryText .telno p {
	margin-top: 0;
	display: inline-block;
}

#contents .contentBox .shopAccess table td.telno p+p,
#contents .contentBox .shopSummeryText .telno p+p {
	margin-left: 20px;
}

#contents .contentBox .shopAccess h5 {
	margin-top: 5px !important;
}

#contents .contentBox .shopAccess h5+p {
	margin-top: 10px !important;
}

#contents .contentBox .shopSummery .map iframe {
	width: 100%;
	height: 350px;
	margin-top: 20px;
}

#contents .contentBox .shopSummeryText {
	margin-top: 10px;
}

#contents .contentBox .shopSummeryText p {
	margin: 0;
}

.flowShowroom {
	margin-top: 60px;
}

.flowShowroom ol.showroomStep {
	padding: 0;
	margin: 30px 0 0 0;
	display: flex;
}

.flowShowroom ol.showroomStep li {
	width: calc(100% / 5);
	margin: 0;
}

.flowShowroom ol.showroomStep li:first-child,
.flowShowroom ol.showroomStep li:last-child {
	width: calc(100% / 5 - 19px);
}

.flowShowroom ol.showroomStep li h4 {
	background: linear-gradient(90deg, #777777 0%, #CCCCCC 100%);
	margin: 0 50px 10px 0 !important;
	color: #fff !important;
	padding: 5px 10px 0 50px;
	position: relative;
	height: 38px;
	width: 100%;
	font-weight: 700;
}

.flowShowroom ol.showroomStep li:first-child h4 {
	padding-left: 10px;
}

.flowShowroom ol.showroomStep li:last-child h4 {
	background: #f67644;
}

.flowShowroom ol.showroomStep li h4:before {
	display: none;
}

.flowShowroom ol.showroomStep li h4:after {
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 38px 0 0 38px;
	border-color: transparent transparent transparent #CCCCCC;
	content: '';
	z-index: 10;
	position: absolute;
	left: 100%;
	bottom: 0;
	top: inherit;
	border-radius: 0;
	background: none;
}

.flowShowroom ol.showroomStep li:last-child h4:after {
	border-color: transparent transparent transparent #f67644;
}

.flowShowroom ol.showroomStep li p {
	display: flex;
	align-items: center;
	font-size: 15px;
	font-weight: 500;
}

.flowShowroom ol.showroomStep li span {
	/*	background: url(./img/bg_dline_dg.png) repeat #555555;*/
	background: #555555;
	border-radius: 50%;
	width: 67px;
	height: 67px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 10px;
}

.flowShowroom ol.showroomStep li span img {
	height: 30px;
	width: auto;
}

.flowShowroom .note {
	margin: 30px 0 0 0;
	font-size: 15px;
}

.flowShowroom .note li {
	padding: 0 0 0 20px;
	position: relative;
}

.flowShowroom .note li+li {
	margin-top: 5px;
}

.flowShowroom .note li::before {
	content: '';
	width: 7px;
	height: 7px;
	background: #777777;
	border-radius: 50vh;
	position: absolute;
	top: 0.7em;
	left: 0;
}

.showroomMerit {
	max-width: 1100px;
	margin: 20px auto 0;
}

.showroomMerit>h5 {
	font-size: 22px;
	padding: 5px 10px;
	background: #f3f3f3;
}

.showroomMerit ol {
	display: flex;
	gap: 40px;
	margin: 20px 0 0 0;
}

.showroomMerit ol li {
	width: calc((100% - 80px) / 3);
	overflow: hidden;
}

.showroomMerit ol li br {
	display: none;
}

.showroomMerit ol li img {
	float: right;
}

.showroomMerit ol li h5 {
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	background: none;
	border-bottom: dotted 1px #d3d3d3;
	font-size: 20px;
	padding: 0 0 5px 0;
	color: #f67644;
}

.showroomMerit ol li p {
	overflow: hidden;
	padding: 5px 5px 0 0;
	font-size: 15px;
	font-weight: 500;
}

#showroom .formContact {
	margin: 60px 0 0 0;
}

@media (max-width: 1150px) {
	.featureBox {
		margin: 40px 20px 0;
	}

	#showroom #main .sub-heading02 {
		margin: 40px 20px 0;
	}

	#showroom #main .inner .sub-heading02 {
		margin: 40px 0 0;
	}

	#contents .contentBox ul.showroomDetail li img {
		height: calc((100vw - 40px) /2 * 0.7);
	}

	.flowShowroom ol.showroomStep li p br {
		display: none;
	}

	.flowShowroom ol.showroomStep li p {
		font-size: 14px;
	}

	.showroomMerit>h5 {
		font-size: 20px;
		padding: 5px 10px;
		background: #f3f3f3;
		margin: 0 20px;
	}

	.showroomMerit ol {
		flex-direction: column;
		margin: 20px 20px 0;
		gap: 20px;
	}

	.showroomMerit ol li {
		width: 100%;
	}
}

@media (max-width: 1000px) {
	#showroom #contents #main article .lifeStyleCenter .inner {
		margin-right: auto;
		margin-left: auto;
	}
}

@media (max-width: 800px) {
	.featureBox {
		flex-direction: column;
	}

	.featureBox>p {
		width: 100%;
	}

	.featureBox ul {
		flex: none;
		padding: 0 10px 10px;
	}

	#contents .contentBox .shopAccess ul li .col2 {
		gap: 20px;
	}

	#contents .contentBox .shopAccess table th,
	#contents .contentBox .shopAccess table td {
		display: block;
	}

	#contents .contentBox .shopAccess table th {
		border-bottom: none;
	}

	#contents .contentBox .shopAccess table td {
		border-bottom: none;
		border-top: none;
	}

	#contents .contentBox .shopAccess table {
		border-bottom: solid 1px #777777;
	}

	#contents .contentBox .shopAccess table td.telno p {
		display: block;
	}

	#contents .contentBox .shopAccess table td.telno p+p {
		margin: 0;
	}

	.flowShowroom ol.showroomStep li h4 {
		font-size: 14px;
		padding: 5px 0 0 10px;
		text-align: center;
	}

	.flowShowroom ol.showroomStep li p {
		flex-direction: column;
		text-align: center;
	}

	.flowShowroom ol.showroomStep li p span {
		margin: 0;
	}

	.flowShowroom ol.showroomStep li p br {
		display: block;
	}
}

@media (max-width: 599px) {
	#contents .contentBox ul.showroomDetail {
		flex-direction: column;
	}

	#contents .contentBox ul.showroomDetail li {
		width: 100%;
	}

	#contents .contentBox ul.showroomDetail li img {
		height: calc(100vw * 0.6);
	}

	.flowShowroom ol.showroomStep {
		flex-direction: column;
	}

	.flowShowroom ol.showroomStep li {
		width: 100% !important;
	}

	.flowShowroom ol.showroomStep li+li {
		margin-top: 10px;
	}

	.flowShowroom ol.showroomStep li h4::after {
		content: none;
	}

	.flowShowroom ol.showroomStep li p {
		flex-direction: row;
		text-align: left;
		justify-content: flex-start;
		gap: 10px;
	}

	.flowShowroom ol.showroomStep li p br {
		display: none;
	}

	.showroomMerit>h5 {
		font-size: 16px;
		font-size: 4.5vmin;
	}
}

/*----------------------------------------
 初めての方へ
----------------------------------------*/
#first #contents {
	margin: 30px auto 0;
}

.leadText {
	margin-top: 20px;
}

.leadText+.contact01 {
	margin-top: 60px;
}

.firstSecret {
	margin-top: 50px;
}

#contents .firstSecret .contentBox h3.secretTitle {
	border: none;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	font-size: 30px;
	padding: 0;
}

#contents .firstSecret .contentBox h3.secretTitle span {
	display: inline-block;
	font-size: 22px;
	font-weight: 700;
	border-radius: 5px;
	background: #f67644;
	color: #FFFFFF;
	line-height: 1;
	padding: 5px 20px;
}

#contents .firstSecret .contentBox h3.secretTitle span em {
	font-family: 'Roboto', sans-serif;
	font-size: 34px;
	margin-right: 10px;
}

#contents #main .firstSecret .contentBox {
	margin-top: 60px;
}

#contents #main .firstSecret .contentBox:nth-of-type(2n+1) .col2 {
	flex-direction: row-reverse;
}

/*-- point01 --*/
ul.secretSelectList {
	display: flex;
	justify-content: space-between;
	gap: 15px;
}

.secretSelectList li:before,
.secretSelectList li:after {
	display: none !important;
}

.secretSelectList li {
	padding: 0 !important;
	box-shadow: 0 0 10px #dadada;
	border-radius: 5px;
	width: calc((100% - 75px) / 6);
	background: #f6f6f6;
	overflow: hidden;
	text-align: center;
	display: flex;
	flex-flow: column;
}

#contents .contentBox ul.secretSelectList li+li {
	margin: 0;
}

#contents .contentBox .secretSelectList li h5 {
	font-size: 14px;
	border: none;
	margin: 0 0 0 0;
	padding: 10px 5px;
}

.firstFindingMsg {
	background-color: #fff6da;
	padding: 40px 0;
	margin-top: 60px;
}

.firstFindingMsg .sub-heading02 {
	text-align: center;
}

@media (max-width: 1150px) {

	#first .sub-heading01,
	#first .bnrQuo {
		margin-left: 20px;
		margin-right: 20px;
	}
}

@media (max-width: 800px) {
	#contents .firstSecret .contentBox h3.secretTitle {
		font-size: 27px;
	}

	#contents .firstSecret .contentBox h4 {
		font-size: 20px;
	}

	.firstFindingMsg .inner .inner {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
}

@media (max-width: 599px) {
	ul.secretSelectList {
		flex-wrap: wrap;
	}

	.secretSelectList li {
		width: calc((100% - 15px) / 2);
	}

	#contents #main .firstSecret .contentBox {
		margin-top: 40px;
	}

	#contents .firstSecret .contentBox h3.secretTitle span,
	#contents .firstSecret .contentBox h3.secretTitle span em {
		font-size: 18px;
		font-size: 4.6vmin;
	}

	#contents .firstSecret .contentBox h3.secretTitle {
		font-size: 24px;
		font-size: 6.4vmin;
	}

	#contents .firstSecret .contentBox h4 {
		font-size: 18px;
		font-size: 4.6vmin;
	}
}


/*----------------------------------------
 最適塗料診断
----------------------------------------*/
.yesno_q {
	border: solid 5px #dadada;
	margin-top: 10px;
	font-size: 1.8rem;
	font-weight: 500;
}

.yesno_q dt span {
	background-color: #f6ca44;
	color: #222222;
	font-family: "Roboto", sans-serif;
	font-weight: 700;
}

#contents .contentBox ul#choices li {
	padding: 0;
}

#contents .contentBox ul#choices li::before {
	content: none;
}

ul#choices li button {
	font-size: 2.0rem;
	font-weight: 500;
	border: solid 2px #f67644;
	background: #f67644;
	color: #ffffff;
	box-shadow: inset 1px 1px 0px 0px #FFFFFF;
	transition: 0.3s ease-out;
	cursor: pointer;
}

ul#choices li button:hover {
	background: #FFFFFF;
	color: #f67644;
	box-shadow: inset 1px 1px 0px 0px #FFFFFF;
}

ul#choices li button:active {
	color: #FFFFFF;
	background: #f67644;
	box-shadow: inset -1px -1px 0px 0px #FFFFFF;
}

/*-- 診断結果ページ --*/

.resultDetailsCont {
	margin-top: 50px;
	display: flex;
	gap: 40px;
}

.resultDetailsMain {
	flex: 1;
}

.resultDetailsMain>h3 {
	margin-top: 0;
}

.resultDetailsMain .imgWrap {
	margin-top: 20px;
	position: relative;
	border-radius: 10px;
	overflow: hidden;
	height: 420px;
}

.resultDetailsMain .imgWrap .wallImg {
	object-fit: cover;
	width: 100%;
	height: 100%;
}

.resultDetailsMain .imgWrap .itemImg {
	position: absolute;
	bottom: 20px;
	left: 20px;
}

.resultDetailsInfo {
	width: 270px;
}

.resultDetailsInfoList li {
	border: solid 3px #555555;
	padding: 10px 20px;
	font-size: 18px;
	font-weight: 500;
}

.resultDetailsInfoList li+li {
	margin-top: 10px;
}

.resultDetailsInfo .imgWrap {
	position: relative;
	margin-top: 20px;
	padding-top: 60px;
}

.resultDetailsInfo .imgWrap .comments {
	position: absolute;
	right: 180px;
	top: 0;
	padding: 10px 20px;
	border: 2px solid #CCCCCC;
	background: #f3f3f3;
	border-radius: 5px;
	width: 340px;
	text-align: justify;
	margin-bottom: 0 !important;
}

.resultDetailsInfo .imgWrap .comments::before {
	position: absolute;
	content: "";
	right: -15px;
	top: 70%;
	transform: translateY(-50%);
	border-left: 15px solid #ccc;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
}

.resultDetailsInfo .imgWrap .comments span {
	font-size: 18px;
	font-weight: 700;
}

.resultDetailsBtn {
	display: flex;
	justify-content: space-between;
	gap: 30px;
	margin-top: 30px;
}

.resultDetailsBtn li {
	flex: 1;
}

@media (max-width: 800px) {
	.resultDetailsCont {
		flex-direction: column;
		gap: 20px;
	}

	.resultDetailsMain>h3 {
		margin: 0;
	}

	.resultDetailsInfo {
		width: 100%;
	}

	.resultDetailsInfoList {
		display: flex;
		gap: 10px;
	}

	.resultDetailsInfoList li {
		flex: 1;
		margin: 0 !important;
		text-align: center;
	}

	.resultDetailsInfo .imgWrap {
		padding: 0;
		text-align: right;
	}

	.resultDetailsInfo .imgWrap img {
		width: 40%;
	}

	.resultDetailsInfo .imgWrap .comments {
		left: 0;
		top: 20px;
		width: 55%;
	}

	.resultDetailsInfo .imgWrap .comments::before {
		top: 50%;
	}

	.resultDetailsBtn {
		flex-direction: column;
		gap: 0;
	}
}

/*----------------------------------------
 メニュー（一覧）
----------------------------------------*/
#menu #contents {
	margin: 30px auto 0;
}

#menu .menuTitleWrap h1.heading {
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1.0;
	letter-spacing: 0;
}

#menu .menuTitleWrap h1.heading .en {
	font-size: 18px;
	font-size: 1.8rem;
	letter-spacing: 0.2em;
}

#menu .menuTitleWrap h1.heading .title {
	font-size: 40px;
	font-size: 4.0rem;
}

.bnrCompare {
	margin-top: 40px;
}

.bnrCompare a {
	display: flex;
	transition: 0.3s ease-out;
}

.bnrCompare a:hover {
	opacity: 0.7;
}

.packList {
	margin-top: 80px;
}

.serviceMenu+h2.heading {
	margin-top: 80px;
}

.serviceMenuWrap {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 40px;
	margin-top: 50px;
}

.serviceMenuWrap article {
	width: calc((100% - 40px)/2);
	overflow: hidden;
	border-radius: 10px;
	box-shadow: 0 0 10px #dadada;
}

.serviceMenuWrap article .packImg {
	overflow: hidden;
	height: 220px;
}

.serviceMenuWrap article .packImg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: 0.3s ease-out;
}

.serviceMenuWrap article a {
	transition: 0.3s ease-out;
	color: #222222;
	display: block;
	height: 100%;
	padding-bottom: 15px;
}

.serviceMenuWrap article a:hover {
	background: #fff6da;
	display: block;
}

.serviceMenuWrap article a:hover .packImg img {
	transform: scale(1.1);
}

.serviceMenuWrap article .packsummary {
	margin: 10px 15px 0;
	line-height: 1.2;
}

.serviceMenuWrap article .packsummary h4 {
	font-size: 32px;
	font-weight: 900;
}

.serviceMenuWrap article .packsummary .priceWrap {
	display: flex;
	align-items: center;
	gap: 15px;
}

.serviceMenuWrap article .packsummary .priceWrap ul {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.serviceMenuWrap article .packsummary .priceWrap ul li {
	text-align: center;
	border: solid 3px #dadada;
	background-color: #ededed;
	padding: 5px 5px;
	border-radius: 5px;
	font-weight: 700;
	font-size: 15px;
}

.serviceMenuWrap article .packsummary .priceTxt {
	color: #de431f;
	font-family: "Roboto", "Noto Sans JP", sans-serif;
	font-weight: 700;
	font-size: 110px;
	letter-spacing: -.05em;
	line-height: 1;
}

.serviceMenuWrap article .packsummary .priceTxt span {
	font-size: 100px;
}

.serviceMenuWrap article .packsummary .priceTxt .unitText {
	font-weight: 900;
	font-size: 38px;
	display: inline-block;
	width: 1em;
	margin-left: 5px;
}

.serviceMenuWrap article .packsummary .txts {
	font-size: 12px;
}

.serviceMenuWrap article .packRecommend {
	margin-top: 10px;
	/*	background: url(./img/bg_dline_dy.png) repeat;*/
	background: #f6ca44;
	border-radius: 5px;
	padding: 5px;
}

.serviceMenuWrap article .packRecommend dl {
	display: flex;
	line-height: 1.4;
}

.serviceMenuWrap article .packRecommend dl dt {
	padding: 5px 10px;
	text-align: center;
	font-weight: 700;
	display: flex;
	align-items: center;
}

.serviceMenuWrap article .packRecommend dl dd {
	background-color: #FFFFFF;
	flex: 1;
	padding: 5px 10px;
	font-size: 15px;
	font-weight: 500;
}

.serviceMenuWrap article .menu-list {
	margin-top: 10px;
	display: flex;
}

.serviceMenuWrap article .menu-list li {
	text-align: center;
	padding: 5px 10px;
	width: calc((100% - 2px)/3);
}

.serviceMenuWrap article .menu-list li h5 {
	margin-bottom: 5px;
}

.serviceMenuWrap article .menu-list li+li {
	border-left: solid 1px #CCCCCC;
}

.serviceMenuWrap article .menu-list li img {
	width: calc((100% - 30px)/5);
}

.serviceMenuWrap article .basicC {
	margin-top: 10px;
	font-weight: 700;
	line-height: 1.4;
}

.serviceMenuWrap article .basicC span {
	margin-right: 18px;
	display: inline-block;
	position: relative;
	padding: 4px 2px 0;
}

.serviceMenuWrap article .basicC span::after {
	content: "+";
	color: #fff;
	background-color: #f67644;
	border-radius: 50%;
	width: 16px;
	height: 16px;
	top: calc(50% - 5px);
	left: 101%;
	text-align: center;
	margin: auto;
	position: absolute;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	display: inline-table;
	vertical-align: middle;
	box-sizing: border-box;
}

.repairMenu {
	margin-top: 60px;
}

.repairMenu .repairMenuListPickUp {
	display: flex;
	flex-wrap: wrap;
	gap: 40px;
	margin-top: 50px;
}

.repairMenu .repairMenuListPickUp li {
	width: calc((100% - 40px) / 2);
}

.repairMenu .repairMenuList {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	margin-top: 50px;
}

.repairMenu .repairMenuList li {
	width: calc((100% - 120px) / 5);
	position: relative;
}

.repairMenu .repairMenuList li p.menuName {
	position: absolute;
	display: block;
	top: 5px;
	left: 10px;
	font-weight: 900;
	font-size: 24px;
	line-height: 1.2;
}

.repairMenu .repairMenuList li div.menuPrice {
	position: absolute;
	right: 10px;
	bottom: 5px;
	text-align: right;
}

.repairMenu .repairMenuList li div.menuPrice>span {
	background: #de431f;
	color: #FFFFFF;
	display: inline-block;
	line-height: 1;
	font-size: 11px;
	padding: 3px 5px;
	font-weight: 700;
}

.repairMenu .repairMenuList li div.menuPrice>p {
	display: flex;
	align-items: center;
	gap: 2px;
	color: #de431f;
	line-height: 1
}

.repairMenu .repairMenuList li div.menuPrice>p span:nth-of-type(1) {
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	font-size: 36px;
	letter-spacing: -0.02em;
}

.repairMenu .repairMenuList li div.menuPrice>p span:nth-of-type(2) {
	font-weight: 900;
	font-size: 12px;
}

.repairMenu .repairMenuList li p.menuName,
.repairMenu .repairMenuList li div.menuPrice>p span {
	text-shadow: rgb(255, 255, 255) 2px 0px 0px, rgb(255, 255, 255) 1.75517px 0.958851px 0px, rgb(255, 255, 255) 1.0806px 1.68294px 0px, rgb(255, 255, 255) 0.141474px 1.99499px 0px, rgb(255, 255, 255) -0.832294px 1.81859px 0px, rgb(255, 255, 255) -1.60229px 1.19694px 0px, rgb(255, 255, 255) -1.97998px 0.28224px 0px, rgb(255, 255, 255) -1.87291px -0.701566px 0px, rgb(255, 255, 255) -1.30729px -1.5136px 0px, rgb(255, 255, 255) -0.421592px -1.95506px 0px, rgb(255, 255, 255) 0.567324px -1.91785px 0px, rgb(255, 255, 255) 1.41734px -1.41108px 0px, rgb(255, 255, 255) 1.92034px -0.558831px 0px;
}

.repairMenu .btnC {
	margin-top: 40px;
}

.repairMenu .btnC a {
	max-width: 450px;
}

#menu #contents .contentBox {
	margin-top: 50px;
}

@media (max-width: 1150px) {
	#menu #contents #main .inner {
		margin-right: 20px;
		margin-left: 20px;
	}

	.serviceMenuWrap {
		gap: 20px;
	}

	.serviceMenuWrap article {
		width: calc((100% - 20px) / 2);
	}

	.serviceMenuWrap article .packsummary h4 {
		font-size: 24px;
	}

	.serviceMenuWrap article .packsummary .priceTxt {
		font-size: 100px;
	}

	.serviceMenuWrap article .packsummary .priceTxt span {
		font-size: 70px;
	}

	.serviceMenuWrap article .packsummary .priceTxt .unitText {
		font-size: 25px;
	}

	.serviceMenuWrap article .packsummary .priceWrap ul li span {
		display: block;
	}
}

@media (max-width: 900px) {
	.repairMenu .repairMenuList {
		gap: 20px;
	}

	.repairMenu .repairMenuList li {
		width: calc((100% - 60px) / 4);
	}
}

@media (max-width: 800px) {
	.serviceMenuWrap {
		flex-direction: column;
		align-items: center;
		gap: 40px;
	}

	.serviceMenuWrap article {
		width: 100%;
		max-width: 550px;
	}

	.serviceMenuWrap article .packsummary h4 {
		font-size: 32px;
	}

	.serviceMenuWrap article .packsummary .priceTxt {
		font-size: 110px;
	}

	.serviceMenuWrap article .packsummary .priceTxt span {
		font-size: 90px;
	}

	.serviceMenuWrap article .packsummary .priceTxt .unitText {
		font-size: 38px;
	}

	.serviceMenuWrap article .packsummary .priceWrap ul li span {
		display: inline;
	}

}

@media (max-width: 700px) {
	.bnrCompare {
		width: 80%;
		margin-right: auto !important;
		margin-left: auto !important;
	}

	.bnrCompare a {
		flex-direction: column;
	}

	.repairMenu .repairMenuListPickUp li {
		width: 100%;
	}

	.repairMenu .repairMenuListPickUp li img {
		width: 100%;
	}

	.repairMenu .repairMenuList li {
		width: calc((100% - 40px) / 3);
	}
}

@media (max-width: 599px) {
	.repairMenu .repairMenuList li {
		width: calc((100% - 20px) / 2);
	}

	.serviceMenuWrap article .packsummary h4 {
		font-size: 6.0vw;
		text-align: center;
	}

	.serviceMenuWrap article .packsummary .priceWrap {
		flex-direction: column;
	}

	.serviceMenuWrap article .packsummary .priceWrap ul {
		width: 100%;
		flex: auto;
	}

	.serviceMenuWrap article .packsummary .priceTxt {
		font-size: 26.0vw;
	}

	.serviceMenuWrap article .packsummary .priceTxt span {
		font-size: 18.0vw;
	}

	.serviceMenuWrap article .packsummary .priceTxt .unitText {
		font-size: 9.0vw;
	}

	.serviceMenuWrap article .packsummary .txts {
		margin-top: 5px;
	}

	.serviceMenuWrap article .menu-list li {
		padding: 5px 0;
	}
}

/*----------------------------------------
 メニュー（詳細）
----------------------------------------*/
.menuSingleMainv {
	position: relative;
	overflow: hidden;
	height: 600px;
}

.menuSingleMainv>img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.menuSingleMainv .menuTypeText {
	position: absolute;
	top: 30px;
	left: 30px;
	z-index: 10;
	display: flex;
	gap: 5px;
}

.menuSingleMainv .menuTypeText span {
	display: block;
	width: 150px;
	height: 150px;
	background: #e4e4e4;
	border-radius: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 900;
	font-size: 120px;
	line-height: 1;
	padding-bottom: 10px;
}

.menuSingleMainv .menuTypeText span:nth-of-type(1),
.menuSingleMainv .menuTypeText span:nth-of-type(2) {
	background: #f6ca44;
}

.menuSingleMainv.packRoof .menuTypeText span:nth-of-type(1),
.menuSingleMainv.packRoof .menuTypeText span:nth-of-type(2),
.menuSingleMainv.packRcover .menuTypeText span:nth-of-type(1),
.menuSingleMainv.packRcover .menuTypeText span:nth-of-type(2) {
	background: #f67644;
}

.menuSingleMainv.packReform .menuTypeText span:nth-of-type(1),
.menuSingleMainv.packReform .menuTypeText span:nth-of-type(2),
.menuSingleMainv.packApartment .menuTypeText span:nth-of-type(1),
.menuSingleMainv.packApartment .menuTypeText span:nth-of-type(2),
.menuSingleMainv.packPaint .menuTypeText span:nth-of-type(1),
.menuSingleMainv.packPaint .menuTypeText span:nth-of-type(2) {
	background: #f67644;
}

.menuSingleMainv.packReform .menuTypeText span:nth-of-type(3),
.menuSingleMainv.packReform .menuTypeText span:nth-of-type(4),
.menuSingleMainv.packApartment .menuTypeText span:nth-of-type(3),
.menuSingleMainv.packApartment .menuTypeText span:nth-of-type(4),
.menuSingleMainv.packPaint .menuTypeText span:nth-of-type(3),
.menuSingleMainv.packPaint .menuTypeText span:nth-of-type(4) {
	background: #f6ca44;
}

.menuSingleMainv.packRcover .menuTypeText span:nth-of-type(3),
.menuSingleMainv.packRcover .menuTypeText span:nth-of-type(4),
.menuSingleMainv.packRcover .menuTypeText span:nth-of-type(5) {
	width: 110px;
	height: 110px;
	font-size: 100px;
}

.menuSingleMainv .menuName {
	position: absolute;
	font-feature-settings: "palt";
	top: 185px;
	left: 30px;
	font-weight: 900;
	font-size: 66px;
	line-height: 1.2;
	text-shadow: rgb(255, 255, 255) 3px 0px 0px, rgb(255, 255, 255) 2.83487px 0.981584px 0px, rgb(255, 255, 255) 2.35766px 1.85511px 0px, rgb(255, 255, 255) 1.62091px 2.52441px 0px, rgb(255, 255, 255) 0.705713px 2.91581px 0px, rgb(255, 255, 255) -0.287171px 2.98622px 0px, rgb(255, 255, 255) -1.24844px 2.72789px 0px, rgb(255, 255, 255) -2.07227px 2.16926px 0px, rgb(255, 255, 255) -2.66798px 1.37182px 0px, rgb(255, 255, 255) -2.96998px 0.42336px 0px, rgb(255, 255, 255) -2.94502px -0.571704px 0px, rgb(255, 255, 255) -2.59586px -1.50383px 0px, rgb(255, 255, 255) -1.96093px -2.27041px 0px, rgb(255, 255, 255) -1.11013px -2.78704px 0px, rgb(255, 255, 255) -0.137119px -2.99686px 0px, rgb(255, 255, 255) 0.850987px -2.87677px 0px, rgb(255, 255, 255) 1.74541px -2.43999px 0px, rgb(255, 255, 255) 2.44769px -1.73459px 0px, rgb(255, 255, 255) 2.88051px -0.838247px 0px;
}

.menuSingleMainv .menuPriceArea {
	position: absolute;
	display: flex;
	bottom: 50px;
	left: 30px;
	align-items: center;
	font-weight: 700;
	line-height: 1;
	gap: 10px;
}

.menuSingleMainv .menuPriceArea>span:nth-of-type(1) {
	font-size: 22px;
	padding: 10px 20px;
	color: #FFFFFF;
	display: inline-block;
	background: #222222;
}

.menuSingleMainv .menuPriceArea .menuPrice {
	color: #de431f;
	text-shadow: rgb(255, 255, 255) 5px 0px 0px, rgb(255, 255, 255) 4.90033px 0.993347px 0px, rgb(255, 255, 255) 4.60531px 1.94709px 0px, rgb(255, 255, 255) 4.12668px 2.82321px 0px, rgb(255, 255, 255) 3.48353px 3.58678px 0px, rgb(255, 255, 255) 2.70151px 4.20736px 0px, rgb(255, 255, 255) 1.81179px 4.6602px 0px, rgb(255, 255, 255) 0.849836px 4.92725px 0px, rgb(255, 255, 255) -0.145998px 4.99787px 0px, rgb(255, 255, 255) -1.13601px 4.86924px 0px, rgb(255, 255, 255) -2.08073px 4.54649px 0px, rgb(255, 255, 255) -2.94251px 4.04248px 0px, rgb(255, 255, 255) -3.68697px 3.37732px 0px, rgb(255, 255, 255) -4.28444px 2.57751px 0px, rgb(255, 255, 255) -4.71111px 1.67494px 0px, rgb(255, 255, 255) -4.94996px 0.7056px 0px, rgb(255, 255, 255) -4.99147px -0.291871px 0px, rgb(255, 255, 255) -4.83399px -1.27771px 0px, rgb(255, 255, 255) -4.48379px -2.2126px 0px, rgb(255, 255, 255) -3.95484px -3.05929px 0px, rgb(255, 255, 255) -3.26822px -3.78401px 0px, rgb(255, 255, 255) -2.4513px -4.35788px 0px, rgb(255, 255, 255) -1.53666px -4.75801px 0px, rgb(255, 255, 255) -0.560763px -4.96845px 0px, rgb(255, 255, 255) 0.437495px -4.98082px 0px, rgb(255, 255, 255) 1.41831px -4.79462px 0px, rgb(255, 255, 255) 2.34258px -4.41727px 0px, rgb(255, 255, 255) 3.17346px -3.86382px 0px, rgb(255, 255, 255) 3.87783px -3.15633px 0px, rgb(255, 255, 255) 4.4276px -2.32301px 0px, rgb(255, 255, 255) 4.80085px -1.39708px 0px, rgb(255, 255, 255) 4.98271px -0.415447px 0px;
}

.menuSingleMainv .menuPriceArea .menuPrice span:nth-of-type(1),
.menuSingleMainv .menuPriceArea .menuPrice span:nth-of-type(2),
.menuSingleMainv .menuPriceArea .menuPrice span:nth-of-type(3) {
	font-family: 'Roboto', sans-serif;
}

.menuSingleMainv .menuPriceArea .menuPrice span:nth-of-type(1) {
	font-size: 200px;
	letter-spacing: -.03em;
}

.menuSingleMainv .menuPriceArea .menuPrice span:nth-of-type(2),
.menuSingleMainv .menuPriceArea .menuPrice span:nth-of-type(3) {
	font-size: 120px;
	letter-spacing: -.03em;
}

.menuSingleMainv .menuPriceArea .menuPrice span:nth-of-type(4),
.menuSingleMainv .menuPriceArea .menuPrice span:nth-of-type(5) {
	font-size: 70px;
	font-weight: 900;
}

.menuSingleMainv .menuPriceMedal {
	position: absolute;
	bottom: 50px;
	right: 10px;
}

.menuSingleMainv .packRecommend {
	position: absolute;
	background-color: #FFFFFF;
	top: 30px;
	right: 30px;
	width: calc(100% - 60px - 600px - 15px - 50px);
	border-radius: 10px;
	border: solid 3px #f6ca44;
}

.menuSingleMainv .packRecommend dt {
	border-bottom: solid 3px #f6ca44;
	text-align: center;
	font-weight: 700;
	padding: 10px 15px;
}

.menuSingleMainv .packRecommend dd {
	padding: 10px 15px;
	font-weight: 500;
}

.menuSingleMainv .menuExplan {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	color: #FFFFFF;
	background-color: rgba(0, 0, 0, 0.7);
	padding: 10px 30px;
	font-weight: 700;
	font-size: 22px;
}

.menuSingleMainv .menuExplan .note {
	font-size: 16px;
}

.menuSingleMainv .menuApartmentArrow {
	position: absolute;
	top: 170px;
	right: 10px;
}

.outerImg .packRecommend {
	background-color: #FFFFFF;
	width: 100%;
	border-radius: 10px;
	border: solid 3px #f6ca44;
}

.outerImg .packRecommend dt {
	border-bottom: solid 3px #f6ca44;
	text-align: center;
	font-weight: 700;
	padding: 10px 15px;
}

.outerImg .packRecommend dd {
	padding: 10px 15px;
	font-weight: 500;
}

.packData .itemBox {
	display: flex;
	flex-direction: row-reverse;
	gap: 40px;
}

.packData .itemPhoto {
	width: 27%;
}

.packData .itemSummery {
	flex: 1;
	font-size: 18px;
	font-weight: 500;
	line-height: 2.0;
}

.packData .itemSummeryText p {
	margin-top: 10px;
}

.packData .itemSummeryText p:first-child {
	margin-top: 0;
}

.packData .ageList {
	display: flex;
	gap: 20px;
	margin-top: 40px;
}

.packData .ageList li {
	flex: 1;
	text-align: center;
	border: solid 3px #555555;
	border-radius: 5px;
	display: flex;
}

.packData .ageList li h5 {
	font-size: 18px;
	font-weight: 700;
	padding: 10px 20px;
	background-color: #f67644;
	color: #FFFFFF;
}

.packData .ageList li p {
	flex: 1;
	padding: 10px;
}

.itemData {
	/*    background: url(./img/bg_dline_ly.png) repeat #ffe9a7;*/
	background: #fff6da;
	margin-top: 40px;
	padding: 10px;
	border-radius: 10px;
	text-align: center;
}

.itemData h4 {
	font-size: 25px;
}

.itemData ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 10px;
}

.itemData ul li {
	flex: 1;
	background: #FFFFFF;
	border-radius: 5px;
	padding: 10px;
}

.itemData ul li h5 {
	background: #555555;
	color: #FFFFFF;
	padding: 5px;
	font-size: 16px;
	margin-bottom: 10px;
}

.itemData ul li img {
	width: 13%;
	vertical-align: unset;
}

@media (max-width: 1150px) {
	.menuSingleMainv .menuTypeText {
		top: 10px;
		left: 10px;
	}

	.menuSingleMainv .menuTypeText span {
		width: calc(100vw * 0.13);
		height: calc(100vw * 0.13);
		font-size: 10vw;
	}

	.menuSingleMainv.packRcover .menuTypeText span:nth-of-type(3),
	.menuSingleMainv.packRcover .menuTypeText span:nth-of-type(4),
	.menuSingleMainv.packRcover .menuTypeText span:nth-of-type(5) {
		width: calc(100vw * 0.09);
		height: calc(100vw * 0.09);
		font-size: 8.0vw;
	}

	.menuSingleMainv .packRecommend {
		width: 35%;
		top: 10px;
		right: 10px;
		font-size: 1.3vw;
	}

	.menuSingleMainv .packRecommend dd,
	.menuSingleMainv .packRecommend dt {
		padding: 10px;
	}

	.menuSingleMainv .menuName {
		top: calc((100vw * 0.13) + 30px);
		left: 10px;
		font-size: 7.1vw;
	}

	.menuSingleMainv .menuPriceArea {
		left: 10px;
	}

	.menuSingleMainv .menuPriceArea>span:nth-of-type(1) {
		font-size: 1.5vw;
	}

	.menuSingleMainv .menuPriceArea .menuPrice span:nth-of-type(1) {
		font-size: 16vw;
	}

	.menuSingleMainv .menuPriceArea .menuPrice span:nth-of-type(2),
	.menuSingleMainv .menuPriceArea .menuPrice span:nth-of-type(3) {
		font-size: 12vw;
	}

	.menuSingleMainv .menuPriceArea .menuPrice span:nth-of-type(4),
	.menuSingleMainv .menuPriceArea .menuPrice span:nth-of-type(5) {
		font-size: 7vw;
	}

	.menuSingleMainv .menuPriceMedal {
		right: 0;
		width: 27%;
	}

	.menuSingleMainv .menuExplan {
		padding: 10px;
	}

	.menuSingleMainv .menuExplan,
	.menuSingleMainv .menuExplan .note {
		font-size: 2.0vw;
	}

	.menuSingleMainv .menuApartmentArrow {
		width: 55vw;
	}
}

@media (max-width: 800px) {
	.menuSingleMainv {
		height: 70vw;
	}

	.packData .itemSummery {
		font-size: 16px;
	}

	.packData .ageList {
		flex-direction: column;
	}

	.packData .ageList li h5 {
		width: 40%;
		font-size: 2.8vw;
		padding: 10px 10px;
	}

	.itemData h4 {
		font-size: 3vw;
	}
}

@media (max-width: 599px) {
	.menuSingleMainv .menuTypeText span {
		padding-bottom: 5px;
	}

	.menuSingleMainv .menuName {
		top: calc((100vw* 0.13) + 15px);
		font-size: 6.8vw;
	}

	.menuSingleMainv.packRcover .menuTypeText span:nth-of-type(3),
	.menuSingleMainv.packRcover .menuTypeText span:nth-of-type(4),
	.menuSingleMainv.packRcover .menuTypeText span:nth-of-type(5) {
		width: calc(100vw * 0.13);
		height: calc(100vw * 0.13);
		font-size: 10vw;
	}

	.menuSingleMainv .menuPriceArea,
	.menuSingleMainv .menuPriceMedal {
		bottom: 35px;
	}

	.menuSingleMainv .menuPriceArea>span:nth-of-type(1) {
		padding: 10px 5px;
	}

	.menuSingleMainv .menuPriceArea .menuPrice {
		text-shadow: rgb(255, 255, 255) 3px 0px 0px, rgb(255, 255, 255) 2.83487px 0.981584px 0px, rgb(255, 255, 255) 2.35766px 1.85511px 0px, rgb(255, 255, 255) 1.62091px 2.52441px 0px, rgb(255, 255, 255) 0.705713px 2.91581px 0px, rgb(255, 255, 255) -0.287171px 2.98622px 0px, rgb(255, 255, 255) -1.24844px 2.72789px 0px, rgb(255, 255, 255) -2.07227px 2.16926px 0px, rgb(255, 255, 255) -2.66798px 1.37182px 0px, rgb(255, 255, 255) -2.96998px 0.42336px 0px, rgb(255, 255, 255) -2.94502px -0.571704px 0px, rgb(255, 255, 255) -2.59586px -1.50383px 0px, rgb(255, 255, 255) -1.96093px -2.27041px 0px, rgb(255, 255, 255) -1.11013px -2.78704px 0px, rgb(255, 255, 255) -0.137119px -2.99686px 0px, rgb(255, 255, 255) 0.850987px -2.87677px 0px, rgb(255, 255, 255) 1.74541px -2.43999px 0px, rgb(255, 255, 255) 2.44769px -1.73459px 0px, rgb(255, 255, 255) 2.88051px -0.838247px 0px;
	}

	.menuSingleMainv .menuApartmentArrow {
		top: calc(50% - 50px);
	}

	.packData .itemBox {
		flex-direction: column;
		gap: 20px;
	}

	.packData .itemPhoto {
		width: 50%;
		text-align: center;
		margin: 0 auto;
	}

	.packData .ageList {
		margin-top: 20px;
	}

	.packData .ageList li {
		flex-direction: column;
	}

	.packData .ageList li h5,
	.packData .ageList li p {
		width: 100%;
		font-size: 16px;
		padding: 5px;
	}

	.itemData h4 {
		font-size: 4.0vw;
	}

	.itemData ul {
		display: block;
	}

	.itemData ul li+li {
		margin-top: 10px;
	}
}

/*----------------------------------------
 カラーシミュレーション
----------------------------------------*/
#colorsimulation #contents {
	margin: 30px auto 0;
}

#colorsimulation .leadText p+p {
	margin-top: 20px;
}

.colorSample ul {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	gap: 10px;
}

.colorSample li {
	padding: 0 !important;
	margin: 0 !important;
	position: relative;
}

.colorSample li:before {
	content: none !important;
}

.colorSample ul li:first-child {
	margin: 0 35px 0 0 !important;
}

.colorSample ul li:first-child::after {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	border: 30px solid transparent;
	border-left: #f67644 solid 30px;
	left: 103%;
	top: 0;
	bottom: 0;
	margin: auto;
	display: block;
}

#colorsimulation .shopAccess {
	margin-top: 0 !important;
}

.colorStep {
	display: flex;
	gap: 10px;
	margin-top: 40px;
}

.colorStep li {
	/*	background: url(./img/bg_dline_dy.png) repeat #f6ca44;*/
	background: #f6ca44;
	border-radius: 5px;
	padding: 5px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	flex: 1;
}

.colorStep li .colorStepNum {
	text-align: center;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	font-size: 18px;
	padding: 5px 0;
}

.colorStep li .colorStepText {
	background-color: #FFFFFF;
	flex: 1;
}

.colorStep li .colorStepText h4 {
	text-align: center;
	margin-top: 5px;
}

.colorStep li .colorStepText p {
	margin-top: 5px;
	padding: 0 10px 5px;
	font-size: 14px;
}

.campaignArw {
	background: #555555;
	color: #fff;
	font-size: 20px;
	font-weight: bold;
	padding: 4px 20px 0;
	margin: 20px 25% 10px 0;
	height: 40px;
	position: relative;
}

.campaignArw:after {
	content: ' ';
	height: 0;
	position: absolute;
	width: 0;
	border: 20px solid transparent;
	border-left: #555555 solid 30px;
	left: 100%;
	top: 50%;
	margin-top: -20px;
}

.colorCtc {
	display: flex;
	align-items: center;
	gap: 20px;
	line-height: 1.3;
	font-size: 35px;
	font-weight: 700;
}

.colorCtc strong {
	color: #de431f;
}

.colorCtc span {
	display: block;
	width: 127px;
	height: 127px;
	background: url(./img/badge01.png) no-repeat;
	color: #FFFFFF;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 25px;
}

.colorCtc p {
	flex: 1;
}

@media (max-width: 599px) {
	.colorSample ul {
		flex-direction: column;
	}

	.colorSample ul li {
		width: 100%;
	}

	.colorSample ul li img {
		width: 100%;
	}

	.colorSample ul li:first-child {
		margin: 0 0 35px 0 !important;
	}

	.colorSample ul li:first-child::after {
		border: 30px solid transparent;
		border-top: #f67644 solid 30px;
		left: 0;
		right: 0;
		top: 102%;
		bottom: unset;
	}

	.colorStep {
		flex-direction: column;
	}

	.colorStepText img {
		float: left;
		width: 50%;
		margin-right: 10px;
	}

	.colorStep li .colorStepText h4 {
		text-align: left;
	}

	.campaignArw {
		display: none;
	}

	.colorCtc {
		gap: 5px;
		font-size: 4.6vmin;
		margin-top: 10px;
	}

	.colorCtc span {
		width: calc(100vw * 0.18);
		height: calc(100vw * 0.18);
		background: url(./img/badge01.png) 100% / contain no-repeat;
		font-size: 4.0vmin;
	}
}

/*----------------------------------------
 雨漏り診断
----------------------------------------*/
/*----------------------------------------
 外壁屋根診断
----------------------------------------*/
#rainleaking #contents,
#diagnosis #contents {
	margin: 30px auto 0;
}

.agingBox {
	/*    background: url(./img/contact01_catch.png) repeat #555555;*/
	background: #555555;
}

.agingBox .inner {
	padding: 20px 0 40px;
}

.agingBox h2 {
	display: flex;
	gap: 20px;
	color: #FFFFFF;
	font-weight: 700;
	font-size: 40px;
	line-height: 1.2;
	align-items: center;
}

.agingBox h2 small {
	font-size: 70%;
}

.agingBox h2 strong {
	color: #f6ca44;
}

.agingBox .photoUL {
	margin-top: 15px;
}

.agingBox .photoUL img {
	width: 100%;
}

.agingBox p {
	margin-top: 20px;
	color: #FFFFFF;
	font-weight: 700;
	font-size: 25px;
}

.agingBox p strong {
	color: #f6ca44;
}

.rainRank {
	margin-top: 40px;
	display: flex;
	flex-direction: row-reverse;
	gap: 40px;
}

.rainRankText {
	flex: 1;
}

.rainRankText ol {
	margin-top: 30px;
}

.rainRankText ol li {
	border-bottom: dotted 1px #555555;
	font-size: 28px;
	font-weight: 700;
	padding-left: 30px;
	position: relative;
}

.rainRankText ol li::before {
	content: '';
	background: #f67644;
	border-radius: 50vh;
	width: 8px;
	height: 8px;
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	left: 10px;
}

.rainRankText p {
	margin-top: 30px;
}

.rainCatch {
	margin-top: 10px !important;
	font-size: 25px;
	font-size: 2.5rem;
	font-weight: 700;
	line-height: 1.2;
}

.rainCatch br {
	display: none;
}

.rainCatch strong {
	color: #f67644;
}

#contents .diagnosisPoint.contentBox h3.pointTitle {
	border: none;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	font-size: 30px;
	padding: 0;
}

#contents .diagnosisPoint.contentBox h3.pointTitle span {
	display: inline-block;
	font-size: 22px;
	font-weight: 700;
	border-radius: 5px;
	background: #f67644;
	color: #FFFFFF;
	line-height: 1;
	padding: 5px 20px;
}

#contents .diagnosisPoint.contentBox h3.pointTitle span em {
	font-family: 'Roboto', sans-serif;
	font-size: 34px;
	margin-right: 10px;
}

#contents #main .diagnosisPoint.contentBox {
	margin-top: 60px;
}

#contents #main .diagnosisPoint.contentBox {}

#contents #main .diagnosisPoint.contentBox:nth-of-type(2n+1) .col2 {
	flex-direction: row-reverse;
}

.agingCheck {
	background: url(./img/bg_dot_ly.png) repeat;
	padding: 50px 0 30px;
}

.agingCheck>.sub-heading01 {
	margin-top: 0;
}

.agingCheck .inner:nth-of-type(1) {
	display: flex;
	flex-direction: row-reverse;
	align-items: flex-end;
	margin-top: 30px;
	gap: 10px
}

.agingCheck .inner:nth-of-type(1) div {
	flex: 1;
}

.agingCheck .checkPoint ul {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.agingCheck .checkPoint ul li {
	width: calc((100% - 20px)/3);
	height: 150px;
}

.agingCheck .checkPoint ul li img {
	width: 100%;
	height: 150px;
	object-fit: cover;
	border-radius: 5px;
}

.agingCheck .checkpointThumb {
	position: relative;
}

.agingCheck .checkpointThumb .checkTtl {
	position: absolute;
	bottom: 5px;
	left: 5px;
	right: 5px;
	margin: auto;
	text-align: center;
	background: #444444;
	color: #FFFFFF;
	font-size: 13px;
	font-weight: 700;
}

.diagnosisFeatureText {
	margin-top: 20px;
	display: flex;
	gap: 10px;
	font-size: 60px;
	font-weight: 900;
	line-height: 1.2;
	align-items: center;
	justify-content: center;
}

.diagnosisFeatureText li:nth-child(1) {
	display: flex;
	align-items: center;
	gap: 10px;
}

.diagnosisFeatureText li:nth-child(1) small {
	font-size: 25px;
}

.diagnosisFeatureText li:nth-child(2) {
	font-size: 40px;
	color: #FFFFFF;
	background: #444444;
	line-height: 1;
	padding: 5px;
	border-radius: 50vh;
}

@media (max-width: 1150px) {
	.agingBox h2 {
		font-size: 34px;
	}

	.agingBox .photoUL {
		margin-left: 0;
		margin-right: 0;
		gap: 20px;
	}

	.agingBox .photoUL li {
		width: calc((100% - 40px) / 3);
	}

	.rainRankImg {
		flex: 1;
	}

	.rainRankText ol li {
		font-size: 25px;
	}

	.diagnosisFeatureText {
		font-size: 5.7vw;
	}

	.diagnosisFeatureText li:nth-child(1) small {
		font-size: 2.5vw;
	}

	.diagnosisFeatureText li:nth-child(2) {
		font-size: 4.0vw;
	}

	.agingCheck .checkPoint ul li {
		height: calc((100vw / 2 - 70px) / 3);
	}

	.agingCheck .checkPoint ul li img {
		height: calc((100vw / 2 - 70px) / 3);
	}
}

@media (max-width: 800px) {
	#contents .diagnosisPoint.contentBox h3.pointTitle {
		font-size: 27px;
	}

	#contents .diagnosisPoint.contentBox h4 {
		font-size: 20px;
	}

	.agingCheck .inner:nth-of-type(1) {
		flex-direction: column-reverse;
		align-items: center;
		margin-top: 20px;
	}

	.agingCheck .checkpointThumb .checkTtl {
		font-size: 12px;
	}

	.agingCheck .checkpointThumb .checkTtl small {
		display: block;
	}

	.agingCheck .checkPoint ul li {
		height: calc(100vw / 3 * 0.8);
	}

	.agingCheck .checkPoint ul li img {
		height: calc(100vw / 3 * 0.8);
	}
}

@media (max-width: 700px) {
	.diagnosisFeatureText {
		flex-direction: column;
		font-size: 9.0vw;
		gap: 5px;
	}

	.diagnosisFeatureText li:nth-child(1) small {
		font-size: 4.0vw;
	}

	.diagnosisFeatureText li:nth-child(2) {
		font-size: 4.0vw;
	}
}

@media (max-width: 599px) {
	#contents article.mt50 {
		margin-top: 40px !important;
	}

	.agingBox .inner {
		padding-bottom: 20px;
	}

	.agingBox h2 {
		flex-direction: column;
		gap: 5px;
		font-size: 6.5vw;
		text-align: center;
	}

	.agingBox h2 span img {
		width: 80%;
	}

	.agingBox .photoUL {
		margin: 20px 0 0 0;
		gap: 10px;
	}

	.agingBox .photoUL li {
		width: calc((100% - 20px) / 3);
	}

	.rainRank {
		flex-direction: column;
	}

	.rainCatch {
		text-align: center;
	}

	#contents .diagnosisPoint.contentBox .col2 {
		margin-top: 10px;
		gap: 30px;
	}

	#contents .diagnosisPoint.contentBox .col2 p {
		margin-top: 20px;
	}

	#contents .diagnosisPoint.contentBox h3.pointTitle span,
	#contents .diagnosisPoint.contentBox h3.pointTitle span em {
		font-size: 18px;
		font-size: 4.6vmin;
	}

	#contents .diagnosisPoint.contentBox h3.pointTitle {
		font-size: 24px;
		font-size: 6.4vmin;
	}

	#contents .diagnosisPoint.contentBox h4 {
		font-size: 18px;
		font-size: 4.6vmin;
	}
}

/* ===============================================
# トップ-共通
=============================================== */
.l-inner {
	padding: 0 12px;
}

.u-desktop {
	display: none;
}

@media (min-width: 750px) {
	.l-inner {
		padding: 0 20px;
	}

	.u-mobile {
		display: none;
	}

	.u-desktop {
		display: block;
	}
}

/* ===============================================
# top-mv
=============================================== */
.top-mv {
	background-color: #fff6da;
}


/* ===============================================
# top-anshin
=============================================== */
.top-anshin {
	background-color: #fff6da;
	margin-top: -30px;
	padding: 20px 0;
}

.top-anshin--white {
	background-color: #fff;
}

.top-anshin__textBlock {
	background-color: #f5c53e;
	padding: 12px 16px;
}

.top-anshin__title {
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	margin-bottom: 6px;
}

.top-anshin__text {
	font-size: 13px;
	line-height: 2;
}

@media (min-width: 750px) {
	.top-anshin {
		padding: 24px 0;
	}

	.top-anshin__inner {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 16px;
		height: 300px;
		max-width: 1000px;
		margin: 0 auto;
	}

	.top-anshin__textBlock {
		height: 100%;
		width: calc(55% - 8px);
		padding: 16px 24px;
	}

	.top-anshin__image {
		width: calc(45% - 8px);
		height: 100%;
	}

	.top-anshin__image img {
		height: 100% !important;
		object-fit: cover !important;
	}

	.top-anshin__title {
		font-size: 28px;
	}

	.top-anshin__text {
		font-size: 16px;
	}
}

/* ===============================================
# top-cv
=============================================== */
.top-cv {
	background-color: #fff6da !important;
}

.top-cv__title {
	font-weight: 900;
	text-align: center;
	letter-spacing: 0.1em;
	margin-bottom: 16px;
	font-size: 24px;
}

.top-cv__text {
	color: #f05537;
	font-weight: 700;
	text-align: center;
	margin-top: 16px;
	line-height: 1.5;
	letter-spacing: 0.1em;
}

.top-cv__text--big {
	font-size: 20px;
}

.top-cv__text--big span {
	font-size: 15px;
}

.top-cv__text--small {
	margin-bottom: 8px;
	font-size: 16px;
}

@media (min-width: 750px) {
	.top-cv {
		background-color: #cecece !important;
	}

	.top-cv__title {
		color: #fff;
		font-weight: 700;
		font-size: 52px;
		text-align-last: left;
		margin-left: 120px;
		margin-bottom: -4px;
		letter-spacing: 0.05em;
	}
}

/* ===============================================
# top-fact
=============================================== */
.top-fact {
	background-color: #333333;
	padding: 20px 8px;
	position: relative;
}

.top-fact__inner {
	position: relative;
}

.top-fact__image {
	margin-bottom: 10px;
}

.top-fact__voice {
	width: 60%;
	background-color: #fff;
	padding: 6px;
	margin-bottom: 8px;
}

.top-fact__content {
	position: relative;
	z-index: 1;
}

.top-fact__voice--title {
	font-weight: 600;
}

.top-fact__voice--text {
	font-size: 11px;
}

.top-fact__button a {
	color: #fff;
	background-color: #f67644;
	width: 60%;
	display: block;
	text-align: center;
	padding: 8px 0;
	z-index: 1;
	position: relative;
	font-weight: 700;
}

.top-fact__person {
	position: absolute;
	right: -20px;
	bottom: -71px;
	width: 200px;
	height: auto;
	z-index: -1;
}

@media (min-width: 750px) {
	.top-fact {
		border-top: 32px solid #cecece;
		padding: 0 0 40px;
	}

	.top-fact__inner {
		max-width: 1100px;
		margin: 0 auto;
	}

	.top-fact__image {
		margin-top: -24px;
	}

	.top-fact__content {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 70%;
		margin: 0 auto 32px;
	}

	.top-fact__voice {
		padding: 16px;
	}

	.top-fact__voice--title {
		font-size: 28px;
	}

	.top-fact__voice--text {
		font-size: 16px;
	}

	.top-fact__person {
		position: static;
		width: 240px;
	}

	.top-fact__button a {
		margin: 0 auto;
		width: 600px;
		padding: 16px 0;
		font-size: 20px;
	}
}

/* ===============================================
# top-difference
=============================================== */
.top-difference {
	background-color: #e6edfc;
	padding: 32px 0;
}

.top-difference__title {
	width: 80%;
	margin: 0 auto 24px;
	min-width: 330px;
}

.top-difference__blocks {
	position: relative;
	z-index: 1;
	margin-bottom: 40px;
}

.top-difference__block {
	position: relative;
	border: 2px solid #000;
	border-radius: 8px;
	background-color: #fff;
	padding: 16px;
}

.top-difference__block::after {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #000;
	right: -8px;
	bottom: -8px;
	z-index: -2;
	border-radius: 8px;
}

.top-difference__block--1 {
	margin-bottom: 24px;
}

.top-difference__icon {
	position: absolute;
	left: 0;
	top: 0;
	width: 60px;
	height: auto;
}

.difference-block__title {
	text-align: left;
	font-weight: 700;
	font-size: 20px;
	width: fit-content;
	margin: 0 auto 16px;
	padding-left: 20px;
	line-height: 1.2;
}

.difference-block__image {
	margin-bottom: 16px;
}

.difference-block__text {
	font-size: 14px;
	font-weight: 700;
}

@media (min-width: 750px) {
	.top-difference {
		padding: 60px 0 74px;
	}

	.top-difference__inner {
		max-width: 1150px;
		margin: 0 auto;
	}

	.top-difference__title {
		width: 70%;
		max-width: 690px;
		margin-bottom: 60px;
	}

	.top-difference__blocks {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 16px;
		height: fit-content;
		margin-bottom: 60px;
	}

	.top-difference__block {
		border-radius: 10px;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 50%;
		border-width: 5px;
	}

	.top-difference__icon {
		width: 70px;
		height: auto;
		left: -5px;
		top: -5px;
	}

	.top-difference__block::after {
		border-radius: 10px;
	}

	.top-difference__block--1 {
		margin-bottom: 0;
		height: 440px;
		padding: 48px;
	}

	.top-difference__block--2 {
		height: 100%;
		height: 440px;
	}

	.top-difference__block--1 .difference-block__title {
		font-size: 20px;
	}

	.top-difference__block--1 .difference-block__text {
		font-size: 16px;
	}

	.top-difference__block--2 .difference-block__title {
		font-size: 26px;
		margin-bottom: 24px;
	}

	.top-difference__block--2 .difference-block__image {
		margin-bottom: 24px;
	}

	.top-difference__block--2 .difference-block__text {
		font-size: 16px;
	}

	.top-difference__block--1 .difference-block__inner {
		max-width: 320px;
	}

	.top-difference__block--2 .difference-block__inner {
		max-width: 450px;
	}
}

.top-difference__subTitle {
	margin: 0 auto 24px;
	width: 80%;
}

.difference-items {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1fr 1fr;
	gap: 16px;
}

.difference-item {
	border: 2px solid #000;
	position: relative;
}

.difference-item__title {
	background-color: #000;
	color: #fff;
	display: flex;
	align-items: center;
	font-size: 24px;
	height: 40px;
	padding-left: 8px;
}

.difference-item__title--small {
	font-size: 17px;
	line-height: 1;
}

.difference-item__title span {
	font-size: 12px;
	line-height: 1.2;
	margin-right: 4px;
	text-align: center;
}

.difference-item__image {
	width: 100%;
	height: 120px;
	background-color: #fff;
}

.difference-item__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.difference-item__down {
	background-color: #000;
	color: #fff;
	padding-left: 32px;
	font-size: 14px;
	letter-spacing: 0.05em;
}

.difference-item__down span {
	font-weight: bold;
	font-size: 17px;
	margin-right: 2px;
}

.difference-item__icon {
	position: absolute;
	width: 40px;
	height: auto;
	left: -14px;
	bottom: -14px;
}

@media (min-width: 750px) {
	.top-difference__subTitle {
		max-width: 510px;
		margin-bottom: 40px;
	}

	.difference-items {
		grid-template-columns: 1fr 1fr 1fr 1fr;
		grid-template-rows: 1fr;
	}

	.difference-item__title {
		font-size: 1.5em;
		height: 50px;
	}

	.difference-item__title span {
		font-size: 15px;
	}

	.difference-item__title--small {
		font-size: 1.2em;
	}

	.difference-item__image {
		height: 180px;
	}

	.difference-item__down {
		font-size: 20px;
		padding-left: 42px;
	}

	.difference-item__down span {
		font-size: 22px;
	}

	.difference-item__icon {
		width: 50px;
		left: -20px;
		bottom: -14px;
	}
}

/* ===============================================
# nishimikawa
=============================================== */
.nishimikawa {
	padding: 24px 16px;
	background-color: #fff6da;
}

.nishimikawa-image {
	max-width: 550px;
	margin: 0 auto;
	width: 100%;
}

@media (min-width: 750px) {
	.nishimikawa {
		padding: 32px 16px;
	}

	.nishimikawa-image {
		max-width: 1150px;
		margin: 0 auto;
	}
}

/* ===============================================
# top-works
=============================================== */
.top-works {
	background-color: #fff6da;
	padding: 32px 20px;
}

.top-works__title {
	width: 100%;
	max-width: 550px;
	margin: 0 auto 32px;
}

.top-works__bubble {
	width: 100%;
	max-width: 300px;
	margin: 0 auto -20px;
}

.top-works-bottom {
	margin-top: 60px;
	font-weight: 700;
}

.top-works-bottom__text {
	margin: 0 auto 16px;
	position: relative;
	width: fit-content;
}

.top-works-bottom__text::before {
	content: "";
	position: absolute;
	left: -20px;
	top: 0;
	height: 100%;
	width: 1px;
	background-color: #012b41;
}

.top-works-bottom__text::after {
	content: "";
	position: absolute;
	right: -20px;
	top: 0;
	height: 100%;
	width: 1px;
	background-color: #012b41;
}

.top-works-bottom__attention {
	background-color: #fff;
	padding: 4px 20px;
	margin-bottom: 8px;
}

.top-works-bottom__attention span {
	color: #f05537;
}

@media (min-width: 750px) {
	.top-works {
		padding: 60px 0;
	}

	.top-works-bottom__inner {
		max-width: 1150px;
		margin: 0 auto;
	}

	.top-works__title {
		max-width: 690px;
		margin-bottom: 60px;
	}

	.top-works__bubble {
		max-width: 720px;
	}

	.top-works-bottom {
		margin-top: 100px;
	}

	.top-works-bottom__text {
		font-size: 22px;
		margin-bottom: 40px;
	}

	.top-works-bottom__attention {
		font-size: 22px;
		margin-bottom: 16px;
		text-align: center;
		padding: 10px 0;
	}

	.top-works-bottom__text::before {
		left: -40px;
	}

	.top-works-bottom__text::after {
		right: -40px;
	}
}

/* ===============================================
# top-menu
=============================================== */
.top-menu {
	padding: 32px 0;
}

.top-menu__title {
	position: relative;
	width: fit-content;
	margin: 0 auto 32px;
}

.top-menu__title::before {
	content: "";
	position: absolute;
	width: 5px;
	height: 100%;
	top: 0;
	left: -24px;
	background-color: #f6ca44;
}

.top-menu__title::after {
	content: "";
	position: absolute;
	width: 5px;
	height: 100%;
	top: 0;
	right: -24px;
	background-color: #f6ca44;
}

.top-menu__bubble {
	width: 300px;
	margin: 0 auto 8px;
}

.top-menu__title--text {
	font-size: 32px;
	text-align: center;
	font-weight: bold;
	line-height: 1.2;
}



@media (min-width: 750px) {
	.top-menu {
		padding: 80px 0;
	}

	.top-menu__title--text {
		font-size: 34px;
	}

	.top-menu__title {
		padding: 8px 0;
		margin-bottom: 74px;
	}

	.top-menu__title::before {
		left: -100px;
	}

	.top-menu__title::after {
		right: -100px;
	}

	.top-menu__title--text {
		letter-spacing: 0.1em;
	}

	.top-menu__bubble {
		width: 500px;
	}
}

@media (min-width: 1050px) {
	.top-menu__title--text {
		font-size: 48px;
	}

	.top-menu__title::before {
		left: -120px;
	}

	.top-menu__title::after {
		right: -120px;
	}

	.top-menu__bubble {
		width: 610px;
	}
}

/* ===============================================
# top-menu__image
=============================================== */
.top-menu__banner1 {
	margin-bottom: 32px;
}

.top-menu__banner2--image {
	margin-bottom: 16px;
}

.banner-text {
	font-size: 14px;
	font-weight: 700;
}

.top-menu__image {
	position: relative;
	z-index: 1;
}

.top-menu__bg {
	position: absolute;
	z-index: -1;
	left: -100%;
	right: -100%;
	bottom: 150px;
	width: calc(200% + 12px);
	/* height: 50px; */
	/* object-fit: cover; */
}

@media (min-width: 750px) {
	.top-menu__inner {
		max-width: 1150px;
		margin: 0 auto;
	}

	.top-menu__image {
		display: flex;
		justify-content: center;
		gap: 32px;
	}

	.top-menu__banner1 {
		width: 40%;
	}

	.top-menu__banner2 {
		width: 60%;
	}

	.banner-text {
		font-size: 16px;
		line-height: 2;
	}

	.top-menu__bg {
		width: calc(200% + 20px);
		bottom: 60px;
	}
}

/* ===============================================
# トップ 選ばれる理由
=============================================== */
#reason #reason-container {
	margin: 40px 0 0;
}

#reason .reasonMsg p {
	font-size: 18px;
}

#reason .reasonList {
	margin-top: 40px;
	gap: 40px;
}

#reason .reasonList li {
	background: #555555;
	padding-bottom: 30px;
	position: relative;
}

#reason .reasonList li::before,
#reason .reasonList li::after {
	content: '';
	position: absolute;
	display: block;
}

#reason .reasonList li::before {
	width: 20px;
	height: 20px;
	background: #FFFFFF;
	border-radius: 50vh;
	bottom: 4px;
	right: calc(50% - 10px);
}

#reason .reasonList li::after {
	width: 8px;
	height: 8px;
	border-top: solid 3px #555555;
	border-right: solid 3px #555555;
	transform: rotate(135deg);
	background: transparent;
	margin: 0 0 0 0;
	bottom: 11px;
	right: calc(50% - 4px);
}

#reason .reasonList li a::before,
#reason .reasonList li a::after {
	content: none;
}

#reason .reasonList li a {
	padding: 20px;
	background-color: #FFFFFF;
	transition: 0.3s ease-out;
	height: 100%;
}

#reason .reasonList .reasonnum {
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	text-align: center;
	color: #777777;
	line-height: 1.2;
}

#reason .reasonList .reasonnum span {
	display: block;
	color: #222222;
	font-size: 30px;
	font-size: 3.0rem;
}

#reason .reasonListTtl {
	margin-top: 10px;
}

#reason .reasonList .reasonListTtl h4 {
	background: #fff6da;
	color: #222222;
	padding: 2px 2px;
	font-size: 24px;
	transition: 0.3s ease-out
}

#reason .reasonList .reasonListTtl p {
	margin-top: 5px;
	font-size: 18px;
	font-weight: 700;
}

#reason .reasonList .reasonListTtl p strong {
	color: #f67644;
}

#reason .reasonList li a:hover {
	background-color: #fff6da;
}

#reason .reasonList li a:hover .reasonListTtl h4 {
	background: #777777;
	color: #FFFFFF;
}

#reason #reason-container .contentBox,
#reason #reason-container .contentBox+.contentBox {
	clear: both;
}

#reason #reason-container .contentBox h2.reasonTitle {
	background: transparent;
	font-size: 40px;
	padding: 0 0 15px;
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1.2;
	gap: 10px;
	border-bottom: dotted 2px #d3d3d3;
}

#reason #reason-container .contentBox h2.reasonTitle .num {
	font-family: 'Roboto', sans-serif;
	font-size: 22px;
	background-color: #f6ca44;
	border-radius: 5px;
	width: 40px;
	height: 40px;
	text-align: center;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}

#reason #reason-container .contentBox h2.reasonTitle .num::before {
	width: 114px;
	height: 69px;
	content: '';
	display: block;
	position: absolute;
	background: url(./img/reason_en.png) 50% / contain no-repeat;
	top: -5px;
	left: -140px;
}

#reason #reason-container .contentBox p.reasonCatch {
	text-align: center;
	font-size: 35px;
	font-size: 3.5rem;
	font-weight: 700;
	line-height: 1.2;
}

.reasonCatch br {
	display: none;
}

.reasonCatch strong {
	color: #f67644;
}

.reasonFindingMsg {
	border: solid 1px #555555;
	border-radius: 10px;
	max-width: 600px;
	margin: 40px auto;
	padding: 30px;
	text-align: left;
	display: flex;
	gap: 40px;
	background-color: #FFFFFF;
}

.reasonFindingMsg strong {
	color: #f67644;
}

#reason-container .contentBox .reasonFindingMsg p {
	margin-top: 0;
	font-weight: 500;
}

#reason h3 {
	text-align: center;
}

#reason h3 strong {
	color: #f67644;
}

#reason h3 br {
	display: none;
}


.top-reason__list.reasonList li {
	width: calc((100% - 20px)/2);
	border: solid 3px #555555;
	background-color: #FFFFFF;
	position: relative;
}

.top-reason__list.reasonList {
	margin-top: 40px;
	gap: 20px !important;
}

.top-reason__list.reasonList {
	margin: 0 auto !important;
}

.top-reason__list.reasonList li a {
	padding: 16px 6px !important;
}

#reason-container #reason02,
#reason-container #reason04 {
	background-color: #fff6da !important;
}

#reason-container #reason01,
#reason-container #reason02,
#reason-container #reason03,
#reason-container #reason04 {
	padding: 24px 0;
}

@media (min-width: 750px) {
	.top-reason__list.reasonList li a {
		padding: 24px 6px !important;
	}

	#reason-container #reason01,
	#reason-container #reason02,
	#reason-container #reason03,
	#reason-container #reason04 {
		padding: 32px 0;
	}
}


/* ===============================================
# top-reason__head
=============================================== */
.top-reason__head {
	padding: 40px 12px;
	background-color: #e6edfc;
}

.top-reason__title {
	margin-bottom: 32px;
}

.top-reason__title--image {
	width: 100%;
	max-width: 500px;
	margin: 0 auto 24px;
}

.top-reason__title--text {
	text-align: center;
	line-height: 2;
	font-weight: 700;
}

@media (min-width: 750px) {
	.top-reason__head {
		padding: 80px 0;
	}

	.top-reason__title--image {
		max-width: 700px;
		margin-bottom: 48px;
	}

	.top-reason__title--text {
		font-size: 20px;
	}

	.top-reason__title {
		margin-bottom: 54px;
	}
}

/* ===============================================
# top-voice
=============================================== */
.top-voice__bubble {
	width: 300px;
	margin: 0 auto;
}

.top-voice__head--text {
	text-align: center;
	font-weight: 700;
	font-size: 18px;
}

.top-voice__head--text span {
	font-size: 24px;
}

@media (min-width: 750px) {
	.top-voice__bubble {
		width: 460px;
	}

	.top-voice__head--text {
		font-size: 24px;
	}

	.top-voice__head--text span {
		font-size: 32px;
	}
}

/* ===============================================
# lp-header
=============================================== */
.lp-header {
	width: 100%;
	height: 60px;
	background-color: #fff6da;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 0 12px;
	gap: 24px;
}

.lp-header__logo {
	width: 180px;
	height: auto;
}

.lp-header p {
	font-weight: bold;
	letter-spacing: 0.05em;
    font-size: 14px;
    line-height: 1.25;
}

@media (min-width: 750px) {
	.lp-header {
		height: 80px;
		padding: 0 40px;
	}

	.lp-header__logo {
		width: 240px;
	}
}

/* ===============================================
# lp-mv
=============================================== */
.lp-mv {
	margin-top: -40px;
}

@media (min-width: 750px) {
	.lp-mv {
		margin-top: -68px;
	}
}