/*
Theme Name: kaitai-motto-q
*/

@charset "utf-8";
@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);

/* commmon
---------------------------------------------------------------------------*/
html,body{
	margin-top: 0;
	font-family: "Noto Sans Japanese", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	line-height: 2.2rem;
	background-color: white;
}
body{
	/*background-image: url(./images/cubes.png);*/
}
#top {
	margin: 0px;
	padding: 0px;
}
h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure,figcaption{
	margin: 0px;
	padding: 0px;
	font-size: 100%;
	font-weight: normal;
}
ul{
	list-style-type: none;
	margin:0;
	padding:0;
}
img {
	border: none;
	vertical-align: bottom;
}
a{
	text-decoration: none;
	color: black;
}
.left{
	text-align: left;
}
.right{
	text-align: right;
}
.clear{
	clear:both;
}
.center{
	text-align: center;
}
.bold{
	font-weight:bold;
}
i{
	margin-right: 0.4em;
}
.clearfix::after {
	content: "";
	display: block;
	clear: both;
}
h2 {
	font-size: 2.4rem;
	padding: 0;
	position: relative;
	width: 100%;
	text-align: center;
	margin-bottom: 2rem;
	font-weight: bold;
	color: #163269;
	margin-top: 10px;
}
h3{
	font-size: 1.2rem;
	padding: 1rem 0;
	letter-spacing: 0.2rem;	
	text-align: center;
}
h4{
	margin: 1rem 0;
	font-weight: bold;
}
.only-sp{
	display: none;
}
.only-pc{
	display: block;
}
.small{
	font-size:90%;
}
.subtitle{
	color: #f77618;
	text-align: center;
	font-size: 1.2rem;
}

/* header
---------------------------------------------------------------------------*/
header {
	height: 120px;
	width:100%;
	position: fixed; 
	top: 0px;
	left: 0px;
	z-index: 100;
	background-color: white;
	background: rgba(255,255,255,0.9);
	transition: .3s;
	box-sizing: border-box;
}
#header {
	position: relative;
	margin:0 auto;
	justify-content: space-evenly;
	align-items: center;
	width: 100%;
	height: 100%;
	display: flex;
	-moz-transition: height 0.3s;
	-o-transition: height 0.3s;
	-webkit-transition: height 0.3s;
	transition: height 0.3s;
}
#header #logo {
	width: 320px;
	text-align: center;
	display: flex;
    align-items: center;
}
#header #logo h1 {
	flex: 1;
}
#header #logo h1 img{
	width: 200px;
}
#header #logo h1 span{
	display: none;
}
#header #logo .anniversary img{
	width: 70px;
}
#header #navi {
	flex: 1;
}
#header #navi p{
	margin-bottom: 4px;
}
#header #navi p a{
}
#header #navi p i{
	margin-right: 10px;
}
#header #navi ul#index{
	text-align: right;
	width: 100%;
	box-sizing: border-box;
	line-height: 1.6rem;
}
#header #navi ul#index li{
	font-size: 0.9rem;
	display:inline-block; 
	padding: 0 6px;
	text-align: center;
	box-sizing: border-box;
}
#header #navi li a{
	display:block;
	color: black;
	text-decoration: none;
}
#header #navi li.stay a{
  color: #f30000;
}
#header #navi .underline a {
	position: relative;
	display: inline-block;
	text-decoration: none;
}
#header #navi .underline a::after {
	position: absolute;
	bottom: -4px;
	left: 0;
	content: '';
	width: 100%;
	height: 2px;
	background: #f77618;
	transform: scale(0, 1);
	transform-origin: left top;
	transition: transform .3s;
}
#header #navi .underline a:hover::after {
	transform: scale(1, 1);
}

#header #navi .contact{
	text-align: right;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	font-size: 0.9rem;
	line-height: 1.3rem;
}
#header #navi .contact .tel .no{
	color: #f77618;
	font-size: 2rem;
    margin-right: 1rem;
}
#header #navi .contact .line i{
	color: #00B900;
	font-size: 3rem;
}
#header #navi .contact .open{
	color: gray;
	font-size: 0.8rem;
}


/*  sp-menu
---------------------------------------------------------------------------*/
header .menu-sp-btn {
	display: none;
	position: absolute;
	z-index: 9999;
	top: 25px;
	right: 20px;
	width: 25px;
	height: 20px;
}
header .menu-sp-btn span {
	display: block;
	height: 3px;
	border-radius: 3px;
	width: 100%;
	margin-bottom: 6px;
	transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s, opacity 0.1s ease-in-out 0.1s, -webkit-transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
	-webkit-transform: translateZ(0);
					transform: translateZ(0);
}
header .menu-sp-btn span:last-child {
	margin-bottom: 0;
}
header .menu-sp-btn.is-clicked span:first-child {
	-webkit-transform: translateY(9px) rotateZ(-135deg);
			-ms-transform: translateY(9px) rotate(-135deg);
					transform: translateY(9px) rotateZ(-135deg);
}
header .menu-sp-btn.is-clicked span:nth-child(2) {
	opacity: 0;
}
header .menu-sp-btn.is-clicked span:last-child {
	-webkit-transform: translateY(-9px) rotateZ(135deg);
			-ms-transform: translateY(-9px) rotate(135deg);
					transform: translateY(-9px) rotateZ(135deg);
}


@media only screen and (max-width:767px){

	#header #navi ul#index li{
		text-align: left;
	}
	#header #navi ul#index li ul{
		position: relative;
		width: 100%;
		padding-top: 0;
		display: block !important;
	}
}



/* main
---------------------------------------------------------------------------*/
main {
	position: relative;
	top: 120px;
}





/* section
---------------------------------------------------------------------------*/
section{
	width:100%;
	clear: both;
	padding: 50px 0;
}
section p+section{
	margin-top: 20px;
}
section .section-inner{
	margin: 0 auto;
	justify-content: space-evenly;
	align-items: center;
	max-width: 1100px;
}



/* icatch
---------------------------------------------------------------------------*/
#toppage #icatch{
	margin: 0 auto;
	text-align: center;
	padding: 0;
	margin-bottom: 30px;
}
#toppage #icatch div img {
	width: 100%;
	object-fit: cover;
}
#toppage #icatch div {
	margin: 0 30px;
}




/* top 共通
---------------------------------------------------------------------------*/
main#toppage .linkall{
	text-align: center;
	margin-bottom: 60px;
	clear: both;
}
main#toppage .linkall a{
	display: inline-block;
	color: white;
	background: #f77618;
	padding: 10px 60px;
	border-radius: 50px;
	font-size: 1.2rem
}
main#toppage .linkall a:hover{
	background: #FF964A;
	transition-duration: 0.3s;
}
main#toppage .linkall a i{
	margin-left: 6px;
}
main#toppage section .detail i{
	color: #f77618;
	margin-left: 6px;
}


/* top バナー
---------------------------------------------------------------------------*/
main#toppage section#banner ul{
	display: flex;
	align-items: center;
	justify-content: center;
}
main#toppage section#banner ul li img{
	width: 100%;
}

/* top reason
---------------------------------------------------------------------------*/
main#toppage section#reason{
}
main#toppage section#reason .reason-index{
	margin: 50px 0;
}
main#toppage section#reason .reason-index li{
	display: flex;
	align-items: center;
	border: 1px solid #bbb;
	border-radius: 20px;
	margin-bottom: 20px;
	padding: 20px;
	background: white;
}
main#toppage section#reason .reason-box{
	display: flex;
	align-items: center;
	width: 100%;
    gap: 40px;
}
main#toppage section#reason .reason-box h3{
	text-align: left;
	letter-spacing: 1px;
	color: #f77618;
	font-size: 1.6rem;
	font-weight: bold;
}
main#toppage section#reason .reason-box h3 span{
	background: #f77618;
	color: white;
	margin-right: 10px;
	border-radius: 50%;
	padding: 10px;
	width: 40px;
	display: inline-block;
	text-align: center;
}
main#toppage section#reason .reason-box .summary{
    flex-grow: 1;
	width: 85%;
}
main#toppage section#reason .reason-box .subtitle{
	color: black;
	text-align: left;
	font-size: 1rem;
	line-height: 1.4rem;
}
main#toppage section#reason .reason-box  .photo{
	width: 15%;
}
main#toppage section#reason .reason-box  .photo img{
	max-width: 100%;
    border-radius: 20px;
}





/* top plan
---------------------------------------------------------------------------*/
main#toppage section#plan{
	background: #163269;
}
main#toppage section#plan h2{
	color: white;
}
main#toppage section#plan .subtitle{
	color: #f6f300;
}
main#toppage section#plan h3{
	border-bottom: 3px solid #f6f300;
	margin-bottom: 2rem;
	font-size: 1.8rem;
	color: #f6f300;
	font-weight: bold;
}
main#toppage section#plan .plan-index{
	display: flex;
	gap: 50px;
	margin-bottom: 80px;
}
main#toppage section#plan .plan-index li{
	flex-grow: 1;
	text-align: center;
	background: white;
	border-radius: 20px;
    display: block;
    padding: 30px;
}
main#toppage section#plan .plan-index li:hover{
	opacity: 0.9;
	transition-duration: 0.3s;
}
main#toppage section#plan .plan-index li a{
}
main#toppage section#plan .plan-index li img{
	width: 100%;
	margin: 20px 0;
	border-radius: 20px;
}
main#toppage section#plan .plan-index .target{
    color: white;
    background: #f77618;
    margin-bottom: 1rem;
}
main#toppage section#plan .plan-index .name{
	color: #163269;
	font-size: 2rem;
	font-weight: bold;
}
main#toppage section#plan .plan-index .price span{
	font-size: 2rem;
	color: red;
	font-weight: bold;
	padding-right: 5px;
}
main#toppage section#plan .plan-index .taxinclude span{
	font-size: 1.3rem;
	padding-right: 3px;
	padding-left: 3px;
}
main#toppage section#plan .plan-index .limit{
	border: 1px solid red;
	display: inline-block;
	width: 200px;
	color: #f77618;
	line-height: 1.6rem;
}
main#toppage section#plan .plan-index .memo{
	font-size: 0.8rem;
}
.others-index{
	display: flex;
	margin-bottom: 20px;
	flex-wrap: wrap;
}
.others-index li{
	flex-grow: 1;
	text-align: center;
	background: white;
	width: 30%;
	margin-right: 5%;
	margin-bottom: 5%;
	border-radius: 20px;
    padding: 30px;
    box-sizing: border-box;
}
.others-index li:nth-child(3n){
	margin-right: 0;
}
.others-index li img{
	width: 100%;
	margin: 10px 0 20px 0;
	height: 160px;
	object-fit: cover;
	border-radius: 20px;
}
.others-index .name{
	color: #163269;
	font-size: 1.4rem;
    font-weight: bold;
}
.others-index .info-box{
	display: flex;
    line-height: 1.6rem;
}
.others-index .price{
    flex: 1;
    border-right: 1px dotted black;
    font-size: 0.9rem;
}
.others-index .price .price01{
	color: red;
	font-size: 2rem;
	padding-right: 5px;
	font-weight: bold;
}
.others-index .price .price02{
    font-weight: bold;
    font-size: 1rem;
	padding-right: 3px;
	padding-left: 3px;
}
.others-index .time{
    padding-left: 1rem;
    font-size: 0.8rem;
}
.others-index .time span{
	font-size: 1.4rem;
    font-weight: bold;
	color: #163269;
}
main#toppage section#plan .packplan{
    background: white;
    border-radius: 20px;
    text-align: center;
    padding: 40px;
    margin-bottom: 80px;
}
main#toppage section#plan .packplan .title{
    font-size: 1.6rem;
    color: #163269;
    margin-bottom: 2rem;
    font-weight: bold;
}
main#toppage section#plan .packplan ul{
	float:left;
	width: 100%;
}
main#toppage section#plan .packplan li{
	float: left;
    width: 18%;
    margin-right: 2%;
}
main#toppage section#plan .packplan li:nth-child(5n){
    margin-right: 0;
}
main#toppage section#plan .packplan li i{
	color: #f77618;
	margin-right: 5px;
}



/* top スタッフ
---------------------------------------------------------------------------*/
main#toppage section#staff{
}
main#toppage section#staff ul{
	margin: 50px 0;
}
main#toppage section#staff .staff-slick li{
	margin: 0 20px;
}
main#toppage section#staff .staff-box .photo img{
	width: 100%;
    border-radius: 20px;
}
main#toppage section#staff .staff-box .info{
	display: flex;
}

main#toppage section#staff .staff-box .name{
	color: #163269;
    font-weight: bold;
}
main#toppage section#staff .staff-box .detail{
    flex: 1;
    text-align: right;
    font-size: 0.8rem;
}
.slick-next:before,
.slick-prev:before{
	color: #163269 !important;
	font-size: 2rem !important;
}



/* top 施工事例
---------------------------------------------------------------------------*/
main#toppage section#works{
	background: #fff;
}
main#toppage section#works .works-index {
	width: 100%;
	float: left;
}
main#toppage section#works .works-index li{
	width: 32%;
	margin-right: 2%;
	margin-bottom: 4%;
	float: left;
	border: 1px solid #ccc;
	box-sizing: border-box;
}
main#toppage section#works .works-index li:nth-child(3n) {
	margin-right: 0;
}
main#toppage section#works .works-index li a{
	display: block;
	padding: 20px;
	box-sizing: border-box;
	background: white;
}
main#toppage section#works .works-index li a:hover{
	opacity: 0.8;
}
main#toppage section#works .works-index li a img{
	width: 100%;
	margin-bottom: 1rem;
	max-height: 220px;
	width: auto;
}
main#toppage section#works .works-index li .works-box .photo{
	text-align: center;
}
main#toppage section#works .works-index li .title {
	text-align: center;
}
main#toppage section#works .works-index li .detail {
	font-size: 0.8rem;
	text-align: right;
	clear: both;
}


/* top お客様の声
---------------------------------------------------------------------------*/
main#toppage section#voice{
	background: #eee;
}

main#toppage section#voice .voice-index {
	width: 100%;
	float: left;
}
main#toppage section#voice .voice-index li{
	width: 32%;
	margin-right: 2%;
	margin-bottom: 4%;
	float: left;
}
main#toppage section#voice .voice-index li:nth-child(3n) {
	margin-right: 0;
}
main#toppage section#voice .voice-index li a{
	display: block;
	padding: 20px;
	box-sizing: border-box;
	background: white;
}
main#toppage section#voice .voice-index li a img{
    width: 100%;
    height: 200px;
    object-fit: cover;
	margin-bottom: 1rem;
}
main#toppage section#voice .voice-index li .title {
	text-align: center;
}
main#toppage section#voice .voice-index li .detail {
	font-size: 0.8rem;
	text-align: right;
	clear: both;
}



/* top ブログ
---------------------------------------------------------------------------*/
main#toppage section#blog{
	background: #eee;
}
ul.blog-index{
	padding-bottom: 50px;
	border-top: 1px solid #163269;
}
ul.blog-index li{
	padding: 50px 0;
	border-bottom: 1px solid #163269;
}
ul.blog-index .blog-box{
	display: flex;
	align-items: center;
}
ul.blog-index .blog-box .photo{
	width: 360px;
}
ul.blog-index .blog-box .photo img{
    border-radius: 20px;
    
}
ul.blog-index .blog-box .summary{
	flex: 1;
}
ul.blog-index .blog-box .summary .info{
	display: flex;
	margin-bottom: 1rem;
	align-items: center;
}
ul.blog-index .blog-box .summary .info .date{
	color: #163269;
	font-weight: bold;
	margin-right: 2rem;
}
ul.blog-index.blog-box .summary .info .category{

}
ul.blog-index .blog-box .summary .info .category a{
	background: #163269;
	color: white;
	border-radius: 10px;
	padding: 0 20px;
	font-size: 0.8rem;
	height: 1.6rem;
	line-height: 1.6rem;
	color: white;
}
ul.blog-index .blog-box .summary .title{
	color: #f77618;
	font-size: 1.2rem;
    margin-bottom: 0.5rem;
}
ul.blog-index .blog-box .summary .text{
}
ul.blog-index .blog-box .summary .detail{
	text-align: right;
	font-size: 0.8rem;
}
ul.blog-index .blog-box .summary .detail a{
	background: white;
	padding: 5px 20px;
	border-radius: 20px;
}
ul.blog-index .blog-box .summary .detail a:hover{
	transition-duration: 0.3s;
	color: #f77618;
}



/* 下層 ブログ
---------------------------------------------------------------------------*/
main#subpage #blog-single .blog-box{
	background: white;
	border-radius: 20px;
	background: white;
	border-radius: 20px;
	padding: 20px 80px 40px 80px;
}
main#subpage #blog-single  .blog-box .blog-head h3{
	color: #f77618;
	font-weight: bold;
	border-bottom: 2px solid #f77618;
	padding: 1rem 0;
	margin: 2rem 0;
	font-size: 1.5rem;
	text-align: left;
}
main#subpage #blog-single  .blog-box .blog-head .date{
	font-size: 0.9rem;
	color: #163269;
}
main#subpage #blog-single  .blog-box .blog-head .tag a{
	background: #163269;
	color: white;
	border-radius: 10px;
	padding: 0 20px;
	font-size: 0.9rem;
	height: 1.6rem;
	line-height: 1.6rem;
	color: white;
}
main#subpage #blog-single  .blog-box .blog-body{
}
main#subpage #blog-single  .blog-box .blog-body ul,
main#subpage #blog-single  .blog-box .blog-body ol{
	margin-left: 1rem;
}
main#subpage #blog-single  .blog-box .blog-body ul li{
	list-style-type: disc;
    margin-left: 0.2rem;
}
main#subpage #blog-single  .blog-box .blog-body p{
}



/* 下層 施工事例 SINGLEページ
---------------------------------------------------------------------------*/
main#subpage #works-single .works-box{
	margin-bottom: 50px;
}
main#subpage #works-single .works-box .works-head{
}
main#subpage #works-single .works-box .works-body{
	background: white;
	padding: 50px;
	box-sizing: border-box;
	border-radius: 20px;
}
main#subpage #works-single .works-box .works-body .works-photo{
	display: flex;
	width: 100%;
	gap: 50px;
	margin-bottom: 50px;
}
main#subpage #works-single .works-box .works-body .works-photo img{
	width: 100%;
}
main#subpage #works-single .works-box .works-body .works-photo .photo-before{
	width: 40%;
	position: relative;
}
main#subpage #works-single .works-box .works-body .works-photo .photo-before .label{
	position: absolute;
	top: 0;
	left: 0;
	background: black;
	color: white;
	padding: 0 1rem;
}
main#subpage #works-single .works-box .works-body .works-photo .photo-after{
	width: 60%;
	position: relative;
}
main#subpage #works-single .works-box .works-body .works-photo .photo-after .label{
	position: absolute;
	top: 0;
	left: 0;
	background: red;
	color: white;
	padding: 0 1rem;
}
main#subpage #works-single .works-box .works-body .works-photo .label span{
	margin-left: 1rem;
	font-size: 90%;
}
main#subpage #works-single .works-box .works-body table.works-summary{
	border-top: 1px solid black;
	width: 100%;
}
main#subpage #works-single .works-box .works-body table.works-summary th{
	border-bottom: 1px solid black;
	width: 30%;
	padding: 1rem;
    background: #eee;
    font-weight: normal;
}
main#subpage #works-single .works-box .works-body table.works-summary td{
	border-bottom: 1px solid black;
	padding: 1rem;
	box-sizing: border-box;
}



/* 下層 お客様の声 SINGLEページ
---------------------------------------------------------------------------*/
main#subpage #voice-single .voice-box{
	margin-bottom: 50px;
}
main#subpage #voice-single .voice-box .voice-head{
}
main#subpage #voice-single .voice-box .voice-body{
	background: white;
	padding: 50px;
	box-sizing: border-box;
	border-radius: 20px;
}
main#subpage #voice-single .voice-box .voice-body .voice-photo{
	display: flex;
	width: 100%;
	gap: 50px;
	margin-bottom: 50px;
}
main#subpage #voice-single .voice-box .voice-body .voice-photo img{
	width: 100%;
}
main#subpage #voice-single .voice-box .voice-body table.voice-summary{
	border-top: 1px solid black;
	width: 100%;
}
main#subpage #voice-single .voice-box .voice-body table.voice-summary th{
	border-bottom: 1px solid black;
	width: 30%;
	padding: 1rem;
    background: #eee;
    font-weight: normal;
}
main#subpage #voice-single .voice-box .voice-body table.voice-summary td{
	border-bottom: 1px solid black;
	padding: 1rem;
	box-sizing: border-box;
}




/* top ご挨拶
---------------------------------------------------------------------------*/
main#toppage section#greeting{
	background: #123268;
	color: white;
}
main#toppage section#greeting h2{
	color: white;
}
main#toppage section#greeting .subtitle{
	color: #f6f300;
}
main#toppage section#greeting .greeting-box{
	display: flex;
	padding: 40px 0;
}
main#toppage section#greeting .greeting-box .photo{
}
main#toppage section#greeting .greeting-box .photo img{
	width: 260px;
}
main#toppage section#greeting .greeting-box .message{
	padding-left: 80px;
}
main#toppage section#greeting .greeting-box .message .sign{
	text-align: right;
	margin-top: 1rem;
	font-size: 0.9rem;
}
main#toppage section#greeting .greeting-box .message .sign span{
	font-size: 1.2rem;
	margin-left: 1rem;
}


/* top ショールーム
---------------------------------------------------------------------------*/
main#toppage section#showroom{
}
main#toppage section#showroom .showroom-box{
	display: flex;
	padding: 40px 0;
	margin-bottom: 80px;
}
main#toppage section#showroom .showroom-box .photo{
}
main#toppage section#showroom .showroom-box .photo img{
	border-radius: 0 20px 20px 0;
	width: 100%;
}
main#toppage section#showroom .showroom-box .message{
	padding-left: 50px;
	max-width: 38vw;
}
main#toppage section#showroom .showroom-box .message p{
	margin-bottom: 1rem;
}
main#toppage section#showroom .showroom-box .message p strong{
	color: #f77618;
}


/* 下層ページ common
---------------------------------------------------------------------------*/
main#subpage h3 {
    font-size: 2.4rem;
    margin-bottom: 1rem;
    font-weight: bold;
    color: #f77618;
    padding: 2rem 0;
}
main#subpage h3 strong{
	color: #f77618;
    font-size: 2rem;
}
main#subpage #menu h3{
    font-size: 1.6rem;
    padding: 2rem 0;
}
main#subpage section.contents {
	background: aliceblue;
	padding-top: 0;
}
main#subpage #pagetitle {
	background: #163269;
	background: steelblue;
}
main#subpage #pagetitle h2{
	color: white;
}
main#subpage #pagetitle .subtitle{
	color: #f6f300;
}
main#subpage .aioseo-breadcrumbs{
	padding: 1rem 0;
	font-size: 0.9rem;
}
main#subpage .aioseo-breadcrumbs .aioseo-breadcrumb-separator{
	padding: 0 0.5rem;
}
main#subpage .wrap {
    margin-bottom: 100px;
}
main#subpage .page-nav{
	background: white;
	border-radius: 20px;
	background: white;
	border-radius: 20px;
	padding: 20px 80px;
	margin-top: 30px;
	display: flex;
    justify-content: center;
}
main#subpage .page-nav .prev{
	margin-right: 60px;
}
main#subpage .page-nav .next{
	margin-left: 60px;
}






/* 下層ページ menu
---------------------------------------------------------------------------*/
main#subpage .plan-index li a{
}
main#subpage .plan-index .plan-box{
background: white;
    display: flex;
    margin-bottom: 30px;
    padding: 30px;
    align-items: center;
	border: 2px solid steelblue;
}
main#subpage .plan-index .plan-box .photo{
	width: 40%;
}
main#subpage .plan-index .plan-box .photo img{
	width: 100%;
}
main#subpage .plan-index .plan-box .info{
	flex: 1;
	padding-left: 60px;
	text-align: center;
}
main#subpage .plan-index .plan-box .info .limit li{
    border: 1px solid red;
    display: inline-block;
    color: #f77618;
    line-height: 1.6rem;
    padding: 0 10px;
    font-size: 1.3rem;
    padding: 2px 10px;
    margin: 0 5px;
}
main#subpage .plan-index .info .target {
	background: #f77618;
	color: white;
	display: inline-block;
	padding: 0 30px;
	line-height: 1.6rem;
}
main#subpage .plan-index .info .name {
    font-size: 3rem;
    margin: 2rem 0;
    font-weight: bold;
    color: #163269;
}
main#subpage .plan-index .info .price {
	margin: 1rem 0;
}
main#subpage .plan-index .plan-box .info .price span{
	color: red;
	font-size: 3.4rem;
	font-weight: bold;
}
main#subpage .plan-index .info .taxinclude {
	font-size: 1.4rem;
	font-weight: bold;
} 
main#subpage .others-index li{
	border: 2px solid steelblue;
}



/* 下層ページ 施工事例INDEX
---------------------------------------------------------------------------*/
main#subpage .works-index{
	width: 100%;
}
main#subpage .works-index li{
	width: 32%;
	margin-right: 2%;
	margin-bottom: 4%;
	float: left;
}
main#subpage .works-index li a{
	display: block;
    padding: 20px;
    box-sizing: border-box;
    background: white;
}
main#subpage .works-index li a:hover{
	opacity: 0.8;
}
main#subpage .works-index li:nth-child(3n){
	margin-right: 0;
}
main#subpage .works-index li img{
	width: 100%;
	margin-bottom: 1rem;
	max-height: 220px;
	width: auto;
}
main#subpage .works-index li .works-box .photo{
	text-align: center;
}
main#subpage .works-index li .title{
	text-align: center;
}
main#subpage .works-index li .detail{
	font-size: 0.8rem;
	text-align: right;
}
main#subpage .works-index li .detail i {
    color: #f77618;
	margin-left: 6px;
}



/* 下層ページ 口コミINDEX
---------------------------------------------------------------------------*/
main#subpage .voice-index{
	width: 100%;
}
main#subpage .voice-index li{
	width: 32%;
	margin-right: 2%;
	margin-bottom: 4%;
	float: left;
}
main#subpage .voice-index li a{
	display: block;
    padding: 20px;
    box-sizing: border-box;
    background: white;
}
main#subpage .voice-index li a:hover{
	opacity: 0.8;
}
main#subpage .voice-index li:nth-child(3n){
	margin-right: 0;
}
main#subpage .voice-index li img{
    width: 100%;
    height: 200px;
    object-fit: cover;
	margin-bottom: 1rem;
	border: 1px solid;
}
main#subpage .voice-index li .title{
	text-align: center;
}
main#subpage .voice-index li .detail{
	font-size: 0.8rem;
	text-align: right;
}
main#subpage .voice-index li .detail i {
    color: #f77618;
	margin-left: 6px;
}





/* 下層ページ company
---------------------------------------------------------------------------*/
main#subpage #company .message-box{
	display: flex;
	background: white;
	padding: 60px;
	gap: 60px;
	align-items: center;
}
main#subpage #company .message-box .message{
}
main#subpage #company .message-box .photo{
	font-size: 0.9rem;
	text-align: center;
}
main#subpage #company .message-box .shopname{
	line-height: 1.3rem;
}
main#subpage #company .message-box .photo img{
	width: 220px;
	margin-bottom: 1rem;
}
main#subpage #company .outline{
	width: 100%;
	background: white;
	border-top: 1px solid steelblue;
}
main#subpage #company .outline th{
	width: 30%;
	padding: 1rem;
	border-bottom: 1px solid steelblue;
	background: lightyellow;
	box-sizing: border-box;
}
main#subpage #company .outline td{
	padding: 1rem;
	border-bottom: 1px solid steelblue;
	box-sizing: border-box;
}
main#subpage #company .map{
	padding: 30px;
	background: white;
}



/* 下層ページ 初めての方へ
---------------------------------------------------------------------------*/
main#subpage #first .intro{
	margin-bottom: 80px;
	background: white;
	padding: 30px;
	display: flex;
	align-items: center;
}
main#subpage #first .intro img{
	width: 100%;
}
main#subpage #first .intro .text{
	width: 75%;
	padding: 60px;
	box-sizing: border-box;
}
main#subpage #first .intro .photo{
	width: 25%;
}
main#subpage #first .point-box{
	background: white;
	padding: 30px;
	border-radius: 20px;
	margin-bottom: 80px;
	text-align: center;
}
main#subpage #first .point-box .title{
	font-size: 2rem;
	font-weight: bold;
	padding-bottom: 1rem;
	margin-bottom: 2rem;
	padding-top: 1rem;
	background: bisque;
}
main#subpage #first .point-box .title span{
	margin-right: 1rem;
	background: #f77618;
	color: white;
	font-size: 1rem;
	padding: 0px 20px;
	border-radius: 20px;
	vertical-align: bottom;
}
main#subpage #first .point-box .question{
	font-size: 1.6rem;
	margin-bottom: 2rem;
}
main#subpage #first .point-box p.answer{
	font-size: 2rem;
	background: black;
	display: inline-block;
	color: white;
	padding: 20px 80px;
	border-radius: 20px;
	font-weight: bold;
}
main#subpage #first .point-box div.answer ol{
	width: fit-content;
	margin: auto;
}
main#subpage #first .point-box div.answer ol li{
	text-align: left;
	padding-left: 5px;
	font-size: 1.6rem;
	margin-bottom: 0.5rem;
	font-weight: bold;
}
main#subpage #first .point-box .photo-box{
	display: flex;
	margin-top: 40px;
	align-items: center;
    border: 1px solid;
}
main#subpage #first .point-box .photo-box .photo{
	width: 30%;
	padding: 20px;
}
main#subpage #first .point-box .photo-box .photo img{
	width: 100%;
}
main#subpage #first .point-box .photo-box .message{
	line-height: 1.8rem;
	width: 70%;
	text-align: left;
	box-sizing: border-box;
	padding: 0 20px;
}
main#subpage #first .point-box .photo-box .message strong{
	text-decoration: underline;
	text-decoration-thickness: 0.5em;
	text-decoration-color: rgba(255, 228, 0, 0.4);
	text-underline-offset: -0.2em;
	text-decoration-skip-ink: none;
}


/* 下層ページ 選ばれる理由
---------------------------------------------------------------------------*/
main#subpage #reason .reason-wrap {
	background: white;
	padding: 30px;
	border-radius: 20px;
	margin-bottom: 80px;
	text-align: center;
}
main#subpage #reason .reason-wrap:last-child:after {
    content: '';
}
main#subpage #reason .reason-wrap .title{
	font-size: 2rem;
	font-weight: bold;
	padding-bottom: 1rem;
	margin-bottom: 2rem;
	padding-top: 1rem;
	background: bisque;
}
main#subpage #reason .reason-wrap .title span{
	margin-right: 1rem;
	background: #f77618;
	color: white;
	font-size: 1rem;
	padding: 0px 20px;
	border-radius: 20px;
	vertical-align: bottom;
}
main#subpage #reason .reason-wrap .subtitle{
	text-align: center;
	margin-top: 4rem;
	margin-bottom: 3rem;
	font-size: 1.4rem;
	font-weight: bold;
	color: black;
}
main#subpage #reason .reason-wrap strong{
	text-decoration: underline;
	text-decoration-thickness: 0.5em;
	text-decoration-color: rgba(255, 228, 0, 0.4);
	text-underline-offset: -0.2em;
	text-decoration-skip-ink: none;
}
main#subpage #reason .reason-wrap .reason-box{
	display: flex;
	align-items: center;
}
main#subpage #reason .reason-wrap .reason-box .text{
	width: 70%;
	text-align: left;
	padding: 0 40px;
	box-sizing: border-box;
}
main#subpage #reason .reason-wrap .reason-box .text p{
	margin-bottom: 1rem;
}
main#subpage #reason .reason-wrap .reason-box .photo{
	width: 30%;
}
main#subpage #reason .reason-wrap .reason-box .photo img{
	width: 100%;
	border-radius: 20px;
}




/* 下層ページ 施工の流れ
---------------------------------------------------------------------------*/
main#subpage #flow .flow-wrap {
	background: white;
	padding: 30px;
	border-radius: 20px;
	margin-bottom: 80px;
	text-align: center;
}
main#subpage #flow .flow-wrap:after {
    content: '\f107';
    font-family: 'Font Awesome 5 Free';
    color: #f77618;
    font-size: 3rem;
    font-weight: 900;
    position: relative;
    bottom: -100px;
}
main#subpage #flow .flow-wrap:last-child:after {
    content: '';
}
main#subpage #flow .flow-wrap .title{
	font-size: 2rem;
	font-weight: bold;
	padding-bottom: 1rem;
	margin-bottom: 2rem;
	padding-top: 1rem;
	background: bisque;
}
main#subpage #flow .flow-wrap .title span{
	margin-right: 1rem;
	background: #f77618;
	color: white;
	font-size: 1rem;
	padding: 0px 20px;
	border-radius: 20px;
	vertical-align: bottom;
}
main#subpage #flow .flow-wrap .flow-box{
	display: flex;
	align-items: center;
}
main#subpage #flow .flow-wrap .flow-box .text{
	width: 70%;
	text-align: left;
	padding: 0 40px;
	box-sizing: border-box;
}
main#subpage #flow .flow-wrap .flow-box .subtitle{
	text-align: left;
	margin-bottom: 1rem;
	font-size: 1.4rem;
	font-weight: bold;
}
main#subpage #flow .flow-wrap .flow-box .photo{
	width: 30%;
}
main#subpage #flow .flow-wrap .flow-box .photo img{
	width: 100%;
}



/* 下層ページ 補助金
---------------------------------------------------------------------------*/
main#subpage #subsidy .subsidy-wrap {
	background: white;
	padding: 30px;
	border-radius: 20px;
	margin-bottom: 80px;
	text-align: center;
}
main#subpage #subsidy .subsidy-wrap .title{
	font-size: 2rem;
	font-weight: bold;
	padding-bottom: 1rem;
	margin-bottom: 2rem;
	padding-top: 1rem;
	background: bisque;
}
main#subpage #subsidy .subsidy-wrap .title span{
	margin-right: 1rem;
	background: #f77618;
	color: white;
	font-size: 1rem;
	padding: 0px 20px;
	border-radius: 20px;
	vertical-align: bottom;
}
main#subpage #subsidy .subsidy-wrap .subtitle{
	text-align: center;
	margin-top: 4rem;
	margin-bottom: 3rem;
	font-size: 1.4rem;
	font-weight: bold;
	color: black;
}
main#subpage #subsidy .subsidy-wrap strong{
	text-decoration: underline;
	text-decoration-thickness: 0.5em;
	text-decoration-color: rgba(255, 228, 0, 0.4);
	text-underline-offset: -0.2em;
	text-decoration-skip-ink: none;
}
main#subpage #subsidy .subsidy-wrap .subsidy-box{
	display: flex;
	align-items: center;
    flex-direction: column;
    padding: 0 50px;
}
main#subpage #subsidy .subsidy-wrap .subsidy-box div{
	flex: 1;
	width: 100%;
	text-align: left;
	box-sizing: border-box;
	margin-bottom: 2rem;
}
main#subpage #subsidy .subsidy-wrap .subsidy-box p.summary{
	border: 1px solid;
    padding: 30px;
}
main#subpage #subsidy .subsidy-wrap .subsidy-box ul{
	margin-left: 2rem;
}
main#subpage #subsidy .subsidy-wrap .subsidy-box ul li{
	list-style-type: disc;
}
main#subpage #subsidy .subsidy-wrap .subsidy-box dt{
	background: #eee;
	padding-left: 1rem;
	box-sizing: border-box;
	font-weight: bold;
	margin-bottom: 1rem;
}
main#subpage #subsidy .subsidy-wrap .subsidy-box dd{
	margin-bottom: 2rem;
}



/* 下層ページ スタッフ紹介
---------------------------------------------------------------------------*/
main#subpage #staff .staff-box {
	background: white;
	padding: 30px;
	border-radius: 20px;
	margin-bottom: 50px;
	text-align: center;
	display: flex;
    gap: 50px;
    align-items: center;
}
main#subpage #staff .staff-box .photo{
    width: 30%;
}
main#subpage #staff .staff-box .photo img{
    width: 100%;
}
main#subpage #staff .staff-box .summary{
    width: 70%;
}
main#subpage #staff .staff-box .summary table{
}
main#subpage #staff .staff-box .summary table th{
	width: 100px;
	background: #eee;
	padding: 0 1rem;
	font-weight: normal;
    text-align: center;
}
main#subpage #staff .staff-box .summary table td{
	text-align: left;
	padding: 0.5rem 1rem;
	line-height: 1.8rem;
}


/* 下層ページ パートナー
---------------------------------------------------------------------------*/
main#subpage #partner .wrap{
	background: white;
	padding: 60px;
	border-radius: 20px;
	margin-bottom: 80px;
	text-align: center;
}
main#subpage #partner ul.partner-index{
	display: flex;
	flex-wrap: wrap;
	gap: 4%;
}
main#subpage #partner .leadtext{
	margin-bottom: 40px;
	text-align: left;
}
main#subpage #partner ul.partner-index li{
	width: 22%;
	margin-bottom: 2%;
}
main#subpage #partner ul.partner-index li a{
	border: 1px solid #ccc;
	padding: 20px;
	box-sizing: border-box;
	display: flex;
	min-height: 100px;
	align-items: center;
}
main#subpage #partner ul.partner-index li img{
	width: 100%;
	vertical-align: middle;
}




/* line
---------------------------------------------------------------------------*/
#line-banner{
	background: #00B900;
}
#line-banner .line-inner{
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
}
#line-banner .line-inner .summary .title{
	color: white;
	font-size: 2rem;
	margin: 1rem;
}
#line-banner .line-inner .summary  .text{
	color: white;
}
#line-banner .line-inner .illust img{
	width: 200px;
}
#line-banner .line-inner .summary .text{
	margin-bottom: 1rem;
}
#line-banner .line-inner .summary .link a{
	background: white;
	color: #00B900;
	padding: 5px 20px;
}
@media only screen and (max-width:767px){
	#line-banner .line-inner .illust img{
		width: 100px;
	}
	#line-banner .line-inner .summary .title{
		font-size: 1.2rem;
		margin: 0;
	}
	#line-banner .line-inner .summary .text{
		font-size: 0.8rem;
	}
}




/* contact
---------------------------------------------------------------------------*/
#contact-banner{
	background: url(/wordpress/wp-content/themes/kaitai-motto-q/images/contact-bg.png);
	background-size: cover;
	background-position: center;
	position: relative;
	min-height: 280px;
	display: flex;
	align-items: center;
	margin-top: 160px;
}
section#contact-banner{
	padding: 0;
}
section#contact-banner .section-inner{
	position: relative;
}
#contact-banner #contact-photo{
	position: absolute;
	left: 0;
	bottom: 0;
}
#contact-banner #contact-photo img{
    width: 250px;
}
#contact-banner #contact-easy30{
	position: absolute;
	top: 120px;
	left: 270px;
}
#contact-banner #contact-easy30 img{
	width: 100px;
}
#contact-banner .contact-inner{
	width: 1100px;
	padding-left: 160px;
	padding: 50px 0 50px 160px;
    box-sizing: border-box;
}
#contact-banner .title{
	color: white;
	font-size: 1.6rem;
	text-align: center;
	margin-bottom: 30px;
}
#contact-banner .phone{
	color: white;
	font-size: 2.6rem;
	text-align: center;
}
#contact-banner .phone a{
	color: white;
}
#contact-banner .phone i{
	font-size: 2rem;
}
#contact-banner .reception{
	color: white;
	font-size: 0.8rem;
	text-align: center;
}
#contact-banner .btn{
	display: flex;
	gap: 20px;
	justify-content: center;
	margin-top: 10px;
}
#contact-banner .btn li{

}
#contact-banner .btn li a{
	background: white;
	border-radius: 50px;
	width: 230px;
	text-align: center;
	height: 50px;
	display: flex;
	align-items: center;
	text-align: center;
	justify-content: center;
	transition-duration: 0.3s;
}
#contact-banner .btn li a:hover{
	background: #F5F300;
}
#contact-banner .btn li a i{
	color: #F77618;
}



/* footer
---------------------------------------------------------------------------*/
footer {
	position: relative;
	top: 120px;
	width:100%;
	clear: both;
	text-align: left;
	line-height:1.5em;
	font-size: 1rem;
	background-color: white;
	padding-bottom: 60px;
	margin-top: 100px;
}
footer #footer-inner{
	width: 1100px;
	margin: 0 auto;
}
footer #footer-inner #footer-company{
	display: flex;
	align-items: center;
}
footer #footer-inner #footer-company .footer-logo{
    width: 300px;
    text-align: center;
}
footer #footer-inner #footer-company .footer-logo img{
	width: 260px;
}
footer #footer-inner #footer-company .footer-address{
	margin-right: 2rem;
}
footer #footer-inner #footer-company .footer-address .name{
	margin-bottom: 5px;
	font-weight: bold;
}
footer #footer-inner #footer-company .footer-social .line a{
	color: #00B900;
	font-size: 3rem;
}
footer #footer-inner #footer-company .footer-social .line i{
	margin-right: 0;
}
footer #footer-inner #sitemap{
	display: flex;
	margin: 50px 0;
}
footer #footer-inner #sitemap ul{
	flex: 1;
}
footer #footer-inner #sitemap ul li{
	margin: 0.6rem 0;
}
footer .copy{
	text-align: center;
	font-size: 0.8rem;
}
footer #sidebtn ul{
    position: fixed;
    top: 30%;
    right: 0;
    z-index: 100;
    display: flex;
    flex-direction: column;
    gap: 30px;
    align-items: center;
}
footer #sidebtn ul li{
}
footer #sidebtn ul li a{
    border-radius: 20px 0 0 20px;
	display: block;
	padding: 20px 14px;
    background: white;
	writing-mode: vertical-rl;
    border-left: 2px solid #f77618;
    border-top: 2px solid #f77618;
    border-bottom: 2px solid #f77618;
}
footer #sidebtn ul li a:hover{
	transition-duration: 0.3s;
	background: #f6f300;
}
footer #sidebtn ul li i{
	margin-bottom: 10px;
	color: #f77618;
}
footer #sidebtn #easy{
	position: fixed;
	top: 186px;
	right: 40px;
	z-index: 999;
}
footer #links{
	margin-bottom: 50px;
}
footer #links ul{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 50px;
}
footer #links ul li a{
	border: 1px solid black;
    min-height: 120px;
    display: flex;
    align-items: center;
    padding: 2px 20px;
    margin-bottom: 5px;
}
footer #links ul li img{
	width: 183px;
}
footer #links ul li .name{
	text-align: center;
	font-size: 0.8rem;
}

/* topback
---------------------------------------------------------------------------*/
#page-top {
	position: fixed;
	bottom: 0px;
	right: 50px;
	margin:0;
	z-index:100;
	display:none;
}
#page-top a {
	color: #f77618;
	text-align: center;
	display: block;
	margin:0;
	font-size: 250%;
}
#page-top a:hover {
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}




/* navi
---------------------------------------------------------------------------*/
@media print, screen  and (min-width: 768px){
	#navi ul#index{
		display:block !important;
	}
	a#menu{display:none;}
}



/*===============================================
 狭いブラウザとタブレット向け(iPad Pro～iPad Mini)
===============================================*/
@media (max-width: 1024px) and (min-width: 768px) {

	section{
		padding: 50px 20px;
		box-sizing: border-box;
	}
	#header,
	header #navi,
	section .section-inner{
	}
	header #navi ul#index,
	header #navi ul#index li {
		border: 0;
	}
	header #navi ul#index li {
		font-size: 0.7rem;
	}
	#toppage #about .aboutbox .summary{
		padding: 0;
		padding-right: 60px;
	}
	#footer #sitemap{
		padding: 20px 0;
		margin-bottom: 0;
	}
	#footer-company{
		padding: 20px 0;
	}
	#toppage #about p.leadtext{
		font-size: 1.6rem;
	}
	#footer-inner{
		padding: 0;
	}

	footer #footer-inner,
	#contact-banner .contact-inner{
		width: 100%;
	}
	main#toppage section#staff ul {
		margin: 0 auto 50px auto;
		width: 90%;
	}

	/*service
	---------------------------------------------------------------------------*/
	#subpage #service .service-box{
		flex-direction: column;
	}
	#subpage #service .service-box .photo{
		width: 100%;
		margin-bottom: 2rem;
	}
	#subpage #service .service-box .text{
		width: 100%;
		padding: 0;
	}
	#subpage #service .service-box .text .title{
		font-size: 1.3rem;
	}

}



/*===============================================
 スマホ：画面の横幅が767pxまで
===============================================*/
@media only screen and (max-width:767px){
	/*common 
	---------------------------------------------------------------------------*/
	html,body{ 
		width:100%; 
		min-width: 300px;
		line-height: 1.8rem;
	}
	body{ 
		width:100%; 
		overflow-x:hidden;
	}
	h2 {
		font-size: 1.2em;
	}
	h3{
		font-size: 1.0rem;
	}
	.only-sp{
		display: block;
	}
	.only-pc{
		display: none;
	}
	#main{
		width:100%;
		float:none;
		clear:both;
		padding-bottom: 0;
	}
	#container{
		width:100%;
		float:none;
		clear:both;
		top: 70px;
	}
	#contents{
		float:none;
		clear:both;
		margin:0px;
	}
	
	/* header
	---------------------------------------------------------------------------*/
	header{
		height: 70px;
	}
	#header{
		width:100%;
		padding-bottom: 0;
		padding-top: 0;
		z-index:0;
		clear:both;
		margin:0;
	}
	#header #logo {
    	width: auto;
	}
	#header #logo h1{
		width: 200px;
	}
	#header #navi{
		width: 100%;
		top: 25px;
	}
	header #description{
		display: none;
	}
	#header #navi ul#index{
		position: relative;
		border-top: 1px solid #ccc;
	}
	#header #navi ul#index li{
		display:block;
		margin-left: 0;
		font-weight: normal;
		padding: 0;
		width: 100%;
	}
	#header #navi ul#index li:first-child{
		border: none;
	}
	#header #logo h1 img{
		width: 160px;
	}
	#header #logo .anniversary img {
		width: 50px;
		margin-right: 10px;
	}
	#header .line{
		margin-right: 20px;
	}
	#header .line i{
		color: #00B900;
		font-size: 2.4rem;
	}
	#header #contact{
		display: none;
	}

	/* navigation
	---------------------------------------------------------------------------*/
	#menu{
		display: block;
	}
	#navi{
		z-index:100;
		clear:both;
		padding:0;
		position:relative;
		width:100%;
	}
	#navi a{
		font-size: 100%;
	}
	#navi a.menu{
		display:block;
		font-weight: bold;
		text-align:left;
		top:-62px;
		right:15px;
		position:absolute;
		width:50px;
		right: 20px;
	}
	#navi a#menu span{padding-left:10px;}
	#navi a#menu:hover{cursor:pointer;}
	#navi ul#index{
		display: none;
		width:100%;
		position:absolute;
		right: 0;
		top:0px;
		z-index:100;
	}
	#navi ul#index li{
		float: none;
		clear:both;
		width:100%;
		height:auto;
		background-color: white;
		background: rgba(255,255,255,0.9);
	}
	#navi ul#index li a,#navi ul#index li.current-menu-item li a{
		display: block;
		padding:10px 5px 10px  10px ;
		text-align:left;
		border-bottom:1px dashed #ccc;
	}
	#navi ul#index li a img{display:none;}
	#navi div.panel{float:none;}

	/* sp-menu
	---------------------------------------------------------------------------*/
	header .menu-sp-btn {
		display: block;
	}
	header .menu-sp-btn span {
		background-color: #123268;
	}

	/* sp-nav
	---------------------------------------------------------------------------*/
	nav.sp-menu{
		position: absolute;
		width: 100%;
		top: 70px;
		left: 100%;
		z-index: 1;
		padding: 0;
		background-color: #00326F;
		-webkit-box-shadow: 0 5px 5px rgb(0 0 0 / 15%);
		box-shadow: 0 5px 5px rgb(0 0 0 / 15%);
		-webkit-backface-visibility: hidden;
		-webkit-transition: all .3s ease;
		-o-transition: all .3s ease;
		transition: all .3s ease;
		background-color: rgba( 0, 0, 0, 0.7 );
	}
	nav.sp-menu.is-displayed {
		left: 0;
		-webkit-backface-visibility: hidden;
		-webkit-transition: all .3s ease;
		-o-transition: all .3s ease;
		transition: all .3s ease;
	}
	nav.sp-menu ul li{
		text-align: center;
		border-bottom: 1px solid white;
	}
	nav.sp-menu ul li a{
		color: white;
		display:block;
		padding: 8px 0;
	}
	nav.sp-menu ul li a span{
		display: block;
		font-size: 70%;
		line-height: 1;
	}
	header li.login a{
		border: 0;
	}

	/*slider
	---------------------------------------------------------------------------*/
	#slider{
		top: 70px;
	}
	.slick-box img{
		width: 320px;
	}
		
	/*icatch
	---------------------------------------------------------------------------*/
	#toppage #icatch div{
		margin: 0 10px;
	}

	/*main
	---------------------------------------------------------------------------*/
	main {
		position: relative;
		top: 70px;
	}

	/*section
	---------------------------------------------------------------------------*/
	section{
		width: 100%;
		margin-top: 1rem;
		margin-bottom: 1rem;
		padding: 0;
	}
	section .section-inner{
		width: 90%;
		padding: 50px 0;
	}
	section table{
		font-size: 90%;
	}
	section table th, section table td{
		padding: 0.5rem 0;
		display: block;
		border-bottom: 0;
		width: 100%;
	}
	section table th{
	    text-align: left;
		box-sizing: border-box;
		border-bottom: 1px solid;
	}

	#sub-main{
		top: 80px;
	}
	#subpage .pagetitle{
		margin: 0;
	}
	#subpage section:nth-last-of-type(1){
		margin-bottom: 50px;
	}

	/*topback
	---------------------------------------------------------------------------*/
	#page-top {
		position: fixed;
		bottom:0;
		right: 10px;
		margin:0;
		z-index:100;
	}
	#page-top a {
		text-decoration: none;
		text-align: center;
		display: block;
		margin:0;
	}
	#page-top img {
		width: 40px;
	}


	/*footer
	---------------------------------------------------------------------------*/
	footer{
		width:100%; 
		font-size:80%;
		display:inline-block;
		clear:both;
		top: 70px;
		margin-top: 40px;
	}
	footer #footer-inner{
		width: 100%;
		padding: 0;
	}
	footer #footer-inner #footer-company {
		flex-direction: column;
	}
	footer #footer-inner #sitemap {
		display: none;
	}
	footer #footer-inner #footer-company .footer-address {
		margin-top: 30px;
		margin-right: 0;
	}
	footer #footer-inner #footer-company .footer-social {
		margin: 30px 0;
	}
	footer #links ul{
		flex-direction: column;
		gap: 20px;
	}

	/*フッターボタン
	---------------------------------------------------------------------------*/
	#sp-fixed-menu {
		position: fixed;
		width: 100%;
		bottom: 0px;
		font-size: 0;
		opacity: 0.9;
		z-index: 99;
	}
    #sp-fixed-menu ul {
        display: flex;
        list-style: none;
        padding: 0;
        margin: 0;
        width: 100%;
    }
    #sp-fixed-menu li {
        justify-content: center;
        align-items: center;
        width: 50%;
        padding: 0;
        margin: 0;
        font-size: 14px;
        border-right: 1px solid #fff;
    }    
	#sp-fixed-menu li:first-child {
        background: #38b435;
    }	
	#sp-fixed-menu li:last-child {
        background: #f3a324;
    }
	#sp-fixed-menu li a {
        color: #fff;
        text-align: center;
        display: block;
        width: 100%;
        padding: 10px;
        box-sizing: border-box;
        text-decoration: none;
    }


	
	/*トップページ調整
	---------------------------------------------------------------------------*/
	main#toppage .linkall{
		margin-bottom: 0;
	}

	main#toppage section#reason .reason-box{
		flex-direction: column;
		gap: 0;
	}
	main#toppage section#reason .reason-box .summary{
		width: 100%;
	}
	main#toppage section#reason .reason-box  .photo{
		width: 100%;
	}
	main#toppage section#reason .reason-box h3{
		font-size: 1.2rem;
		letter-spacing: 0;
	}
	main#toppage section#reason .reason-box h3 span{
		width: 30px;
	}

	/* メニュー */
	main#toppage section#plan h3 {
	    font-size: 1rem;
	}
	main#toppage section#plan .plan-index li a {
	    padding: 20px;
	}
	main#toppage section#plan .plan-index .name {
	    font-size: 1.5rem;
	}
	main#toppage section#plan .plan-index .price span {
    	font-size: 1.8rem;
	}
	main#toppage section#plan .plan-index .taxinclude span {
    	font-size: 1.1rem;
	}
	main#toppage section#plan .plan-index {
	    flex-direction: column;
	}
    .others-index {
        display: block;
        float: left;
    }	    
	.others-index li:nth-child(3n){
		margin-right: 4%;
	}
	.others-index li{
		width: 48%;
		margin-right: 4%;
		float:left;
	    padding: 20px;
	}
	.others-index li img{
		height: 100px;
	}
	.others-index li:nth-child(2n){
		margin-right: 0;
	}
	.others-index .info-box {
	    flex-direction: column;
	}
	.others-index .price{
		border-bottom: 1px dotted black;
		border-right: 0;
	}
	.others-index .name{
		font-size: 1rem;
	}
	.others-index .price .price01 {
	    font-size: 1.6rem;
	}
	.others-index .time span{
	    font-size: 1.2rem;
	    padding-left: 4px;
	}
	.others-index .time{
		padding-left: 0;
	}
	.packplan .title {
		font-size: 1.2em;
	    margin-bottom: 1rem;
	}
	main#toppage section#plan .packplan li{
	    width: 100%;
	    margin-right: 0;
	    text-align: left;
	}
	main#toppage section#works .works-index{
		margin-bottom: 1rem;
	}
	main#toppage section#works .works-index li{
	    width: 100%;
	    margin-right: 0;
	}
	main#toppage section#voice .voice-index{
		margin-bottom: 1rem;
	}
	main#toppage section#voice .voice-index li{
	    width: 100%;
	    margin-right: 0;
	}
	main#toppage .linkall a{
		font-size: 0.9rem;
	}
	main#toppage section#banner .section-inner{
		padding: 0;
	}


	/* 下層共通 */
	main#subpage .wrap{
		padding-bottom: 0px;
	}

	/* 会社概要 */
	main#subpage #company .message-box{
		display: block;
		padding: 30px;
	}
	main#subpage #company .message-box .photo img{
		margin-top: 1rem;
	}
	main#subpage #company .outline th{
		width: 100%;
	}
	main#subpage #company .map {
		padding: 0;
	}

	
	
	/* ブログ */
	ul.blog-index .blog-box {
	    flex-direction: column;
	}
	ul.blog-index .blog-box .photo {
		width: 100%;
		text-align: center;
		margin-bottom: 2rem;
	}
	ul.blog-index ul li:first-child{
		padding-top: 0;
	}
	


	/* ご挨拶 */
	main#toppage section#greeting .greeting-box{
		flex-direction: column;
	}
	main#toppage section#greeting .greeting-box .message{
		padding-left: 0;
		padding-top: 2rem;
	}
	main#toppage section#greeting .greeting-box .photo {
		text-align: center;
	}
	main#toppage section#greeting .greeting-box{
		padding: 0;
	}
	main#toppage section#greeting .greeting-box .photo img {
	    width: 200px;
	}


	/* ショールーム */
	main#toppage section#showroom .showroom-box{
		flex-direction: column;
		padding: 0;
		margin-bottom: 0px;
	}
	main#toppage section#showroom .showroom-box .message{
		max-width: 90%;
		width: 90%;
		padding: 50px 0;
		margin: 0 auto;
	}
	main#toppage section#showroom .showroom-box .photo {
	    width: 90%;
	    margin: 0 auto;
	}
	main#toppage section#showroom .showroom-box .photo img {
	    width: 100%;
	    border-radius: 0;
	}


	/* お問い合わせバナー調整
	---------------------------------------------------------------------------*/
	section#contact-banner{
        margin-top: 70px;
	}
	#contact-banner .contact-inner {
	    margin-left: 0;
		width: 100%;
		padding: 0px;
	}
	#contact-banner #contact-photo{
        top: 60px;
		left: -10px;
	}
	#contact-banner #contact-photo img{
		width: 100px;
	}
	#contact-banner #contact-easy30 {
		left: 10px;
        top: -50px;
	}
	#contact-banner .btn li a {
		width: 150px;
		height: 40px;
	}
	#contact-banner .title{
		font-size: 1.1rem;
		margin-left: 100px;
	}
	#contact-banner .phone {
		font-size: 2rem;
		margin-left: 100px;
		font-size: 1.8rem;
	}
	#contact-banner .reception{
		margin-left: 100px;
		font-size: 0.7rem;
        text-align: right;
	}
	#contact-banner .btn{
		padding-top: 30px;
	}


	/* 下層ページ調整
	---------------------------------------------------------------------------*/
	main#subpage #pagetitle{
		margin-top: 0;
		margin-bottom: 0;
	}
	main#subpage section.contents{
		margin-top: 0;
	}
	main#subpage  #pagetitle .section-inner{
		padding: 10px 0;
	}
	main#subpage  .contents .section-inner{
		padding-top: 10px;
	}
	main#subpage h3{
		font-size: 1.3rem;
	}


	main#subpage #blog-single .blog-box{
		padding: 20px 20px 40px 20px;
	}
	main#subpage #blog-single .page-nav{
		padding: 20px;
	}
	ul.blog-index .blog-box .summary .title,
	main#subpage #blog-single .blog-box .blog-head h3{
		font-size: 1.1rem;
	}
	main#subpage #blog-single  .page-nav .prev{
		margin-right: 30px;
	}
	main#subpage #blog-single  .page-nav .next{
		margin-left: 30px;
	}


	/* 下層ページ 施工事例
	---------------------------------------------------------------------------*/
	main#subpage .works-index li{
		width: 100%;
		margin-right: 0%;
		margin-bottom: 2rem;
		float: none;
	}
	main#subpage #works-single .works-box .works-body{
		padding: 20px;
	}
	main#subpage #works-single .works-box .works-body .works-photo{
		flex-direction: column;
	}
	main#subpage #works-single .works-box .works-body .works-photo .photo-after,
	main#subpage #works-single .works-box .works-body .works-photo .photo-before{
		width: 100%;
	}
	main#subpage #works-single .works-box .works-body table.works-summary th{
		width: 100%;
	}


	/* 下層ページ 口コミ
	---------------------------------------------------------------------------*/
	main#subpage .voice-index li{
		width: 100%;
		margin-right: 0%;
		margin-bottom: 2rem;
		float: none;
	}
	main#subpage #voice-single .voice-box .voice-body{
		padding: 20px;
	}
	main#subpage #voice-single .voice-box .voice-body .voice-photo{
		flex-direction: column;
	}
	main#subpage #voice-single .voice-box .voice-body .voice-photo{
		width: 100%;
	}
	main#subpage #voice-single .voice-box .voice-body table.voice-summary th{
		width: 100%;
	}


	/* 下層ページ 初めての方へ
	---------------------------------------------------------------------------*/
	main#subpage #first .point-box .title {
    	font-size: 1rem;
	}
	main#subpage #first .point-box .question{
		font-size: 1.1rem;
	}
	main#subpage #first .point-box div.answer ol li{
		font-size: 1.1rem;
	}
	main#subpage #first .point-box .photo-box{
		flex-direction: column;
		background: none;
		margin-top: 2rem;
		border: 0;
	}
	main#subpage #first .point-box .photo-box .photo img{
		margin-bottom: 1rem;
	}
	main#subpage #first .point-box .photo-box .photo,
	main#subpage #first .point-box .photo-box .message{
		width: 100%;
		padding: 0;
	}
	main#subpage #first .point-box p.answer{
		font-size: 1.2rem;
		padding: 10px 50px;
	}
	main#subpage #flow .flow-wrap .flow-box .subtitle{
		font-size: 1.2rem;
	}
	main#subpage #first .intro{
		flex-direction: column;
	}
	main#subpage #first .intro .text,
	main#subpage #first .intro .photo{
		width: 100%;
	}
	main#subpage #first .intro .text{
		padding: 0;
		margin-top: 1rem;
	}


	/* 下層ページ 補助金
	---------------------------------------------------------------------------*/
	main#subpage #subsidy .subsidy-wrap .title{
		font-size: 1rem;
		padding-top: 0;
		padding-bottom: 0;
	}
	main#subpage #subsidy .subsidy-wrap .title span{
		display: block;
		width: 100%;
		box-sizing: border-box;
		border-radius: 0;
		margin-right: 0;
	}
	main#subpage #subsidy .subsidy-wrap .subsidy-box{
		padding: 0;
	}
	main#subpage #subsidy .subsidy-wrap .subsidy-box p.summary {
		border: 0;
		padding: 0;
	}


	/* 下層ページ 選ばれる理由
	---------------------------------------------------------------------------*/
	main#subpage #reason .reason-wrap .title{
		font-size: 1rem;
		padding-top: 0;
		padding-bottom: 0;
	}
	main#subpage #reason .reason-wrap .title span{
		display: block;
		width: 100%;
		box-sizing: border-box;
		border-radius: 0;
		margin-right: 0;
	}
	main#subpage #reason .reason-wrap .reason-box{
		    flex-direction: column-reverse;	
	}
	main#subpage #reason .reason-wrap .reason-box .photo{
		width: 100%;
		margin-bottom: 1rem;
	}
	main#subpage #reason .reason-wrap .reason-box .text{
		width: 100%;
	    padding: 0;
	}
	main#subpage #reason .reason-wrap .subtitle {
		text-align: left;
		margin-top: 0rem;
		margin-bottom: 2rem;
		font-size: 1.1rem;
	}


	/* 下層ページ 施工の流れ
	---------------------------------------------------------------------------*/
	main#subpage #flow .flow-wrap .title{
        font-size: 1rem;
        padding-top: 0;
        padding-bottom: 0;
	}
	main#subpage #flow .flow-wrap .title span{
		display: block;
		width: 100%;
		box-sizing: border-box;
		border-radius: 0;
		margin-right: 0;
	}
	main#subpage #flow .flow-wrap .flow-box{
		    flex-direction: column-reverse;	
	}
	main#subpage #flow .flow-wrap .flow-box .photo{
		width: 100%;
		margin-bottom: 1rem;
	}
	main#subpage #flow .flow-wrap .flow-box .text{
		width: 100%;
	    padding: 0;
	}
	

	/* 下層ページ スタッフ紹介
	---------------------------------------------------------------------------*/
	main#subpage #staff .staff-box {
		flex-direction: column;
	    gap: 20px;
	}
	main#subpage #staff .staff-box .summary table th{
		width: 100%;
	    text-align: left;
	}
	main#subpage #staff .staff-box .summary table td{
		padding: 1rem 0;
	}
	main#subpage #staff .staff-box .photo img{
		max-width: 100%;
	}
	main#subpage #staff .staff-box .photo,
	main#subpage #staff .staff-box .summary{
	    width: 100%;
	}


	/* 下層ページ パートナー
	---------------------------------------------------------------------------*/
	main#subpage #partner .wrap{
		padding: 30px;
	}
	main#subpage #partner ul.partner-index {
		flex-direction: column;
	}
	main#subpage #partner ul.partner-index li {
		width: 100%;
	}
	main#subpage #partner ul.partner-index li a{
		min-height: 80px;
		padding: 0px 60px;
	}

	
}


/* フォームパーツ
---------------------------------------------------------------------------*/
.form table{
	background-color: steelblue;
	width: 100%;
	margin-top: 30px;
}
.form table th{
	background-color: lightyellow;
	width: 30%;
	padding: 1rem;
}
.form table td{
	background-color: white;
	padding: 1rem;
	text-align: left;
	box-sizing: border-box;
}
.form input:not(input[type="checkbox"]):not(input[type="submit"]):not(input[type="radio"]), .form select{
	font-size: 1rem;
	padding: 5px;
	height: 40px;
	width: 340px;
	border: 1px solid #ddd;
	box-sizing: border-box;
	background: var(--white);
}
.form .ctrl-btn{
	width: min-content;
	margin: auto;
	margin-top: 50px;
}
.form input[type="submit"], .searchBox input[type="submit"] {
	border: none;
	font-size: 1.42rem;
	border-radius: 6px;
	min-width: 240px;
	text-align: center;
	padding: 15px 30px;
	text-decoration: none !important;
	font-weight: bold;
	cursor: pointer;
	background: #f77618;
	color: white;
}
.form .must{
	color: white;
	background: red;
}
.form .optional{
	color: white;
	background: black;
}
.form .must,
.form .optional{
	margin-left: 1rem;
	font-size: 0.8rem;
	padding: 0 10px;
	border-radius: 5px;
}
.form{
	text-align: center;
}
.form .leadtext{
	font-size: 2.4rem;
	margin-bottom: 1rem;
	font-weight: bold;
	color: #f77618;
	padding: 2rem 0;
}
@media only screen and (max-width:767px){
	.form input:not(input[type="checkbox"]):not(input[type="submit"]):not(input[type="radio"]), .form select, .form textarea{
		width: 240px;
	}
	.form table th{
		width: 100%;
	}
	.form .leadtext {
		font-size: 1.4rem;
	}
}




/* 装飾系パーツ
---------------------------------------------------------------------------*/
.heading04 {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 26px;
	text-align: center;
}

.heading04::before,
.heading04::after {
	content: '';
	width: 3px;
	height: 40px;
	background-color: #f77618;
}

.heading04::before {
	margin-right: 30px;
	transform: rotate(-35deg)
}
.heading04::after {
	margin-left: 30px;
	transform: rotate(35deg)
}




/*印刷調整
---------------------------------------------------------------------------*/
@media print {
	header{
		position: absolute;
	}
	#slider{
		background: url(images/icatch01.jpg) no-repeat center center;
		height: 400px;
	}
	.slick-box{
		display:none;
	}
}


/*==================================================
スクロール時に表示する
===================================*/
.scroll_up {
  transition: 0.5s ease-in-out;
  transform: translateY(100px);
  opacity: 0;
}
.scroll_up.on {
  transform: translateY(0);
  opacity: 1.0;
}