@charset "UTF-8";

/*-----common-------*/
html{
	overflow-y: scroll;
}
img{
	max-width: 100%;
	height: auto;
}
body{
	font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic,";
}
a{
	text-decoration: none;
}
.container{
	position: relative;
	line-height: 1.5;
	max-width: 1100px;
	min-width: 320px;
	margin: 0 auto;
	background: #fff;
	color: #1d1a11;
	font-size: 1.25rem; /*18px*/
	
}
.contents{
	padding:0 50px;
}
/*-----header-------*/
header{
	min-height: 100px;
	padding: 20px 50px 5px;
}
#logo1{
	width: 20%;
	float: left;
	padding: 0 1.81% 0; /*20px*/
}
header #utility{
	width: 75%;
	float: right;
}

@font-face {
	font-family: 'KTEGAKI';
	src: url(fonts/KTEGAKI.ttf);/*kawaii手書き文字*/
}

header #utility .catchphrase {
	font-family:'KTEGAKI';
	font-size: 1.125rem;   /*18px*/
}

.gnav-list{
	display: flex;
	justify-content: space-between;
	font-size: 1.18rem;   /*19px*/
	padding: 10px 2% 0 4%;
}

.gnav-list a {
	color: #1d1a11;
	padding-bottom: 1px;
	text-decoration: none; /* デフォルトの下線を非表示にする */
	background-image: linear-gradient(90deg, #c0b283, #c0b283); /* 線の色 */
	background-repeat: no-repeat;
	background-position: left bottom; /* 線の起点を左・下に設定 */
	background-size: 0 4px; /* 線の横幅を0、縦幅を4pxに */
	transition: background-size 0.4s; /* 線を伸ばすアニメーション実行時間を指定 */
}

.gnav-list a:hover {
	background-size: 100% 4px; /* 線の横幅を100%にする */
}

.contents{
	clear: both;
}

/*-----h2のタイトルの設定-------*/
h2{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 2.5rem;  /*40px*/
	text-align: center;
	letter-spacing: 0.4rem;
	font-weight: 500;
	margin-top:70px;
}
/*-----h2下のタイトルの設定-------*/
.subtitle{
	font-size: 1.125rem;  /*18px*/
	text-align: center;
	margin-top: -0.5rem;
	margin-bottom: 25px;
}
/*-----h2の2文字目の設定-------*/
.colorTxt{
	color: #c0b283;
}
/*-----アイコンの設定-------*/

main .icon {
	background: url("../images/kaza-icon.gif") no-repeat ;
	background-position: calc(50% - 6rem) 0;
}
main .icon h2 {
	padding-top: 22px;
}

#home main #concept,
main #business,
main #information,
main #house,
main #company,
footer {
	margin-top: 250px;
}

/*-----footer-------*/

footer {
	clear: both;
	font-size: 1rem;   /*16px*/
	text-align: center;
	min-height: 60px;
	padding: 34px 50px 5px;
	color: #1d1a11;
}
footer ul{
	margin-bottom: 5px;
}
footer ul li{
	display: inline;
}
footer ul li+li::before{
	content: " | ";
}
footer ul li a{
	color: #1d1a11;
}
footer ul li a:hover{
	text-decoration-line: underline;
	text-decoration-style: solid;
	text-decoration-color: #c0b283;
	text-decoration-thickness: 2px;
}

footer p{
	font-family: Arial, Helvetica, sans-serif;
	color: #1d1a11;
}
footer #logo2{
	text-align: right;
	margin-top: -55px;
}
/*-----formリンクの設定-------*/

#formSticky p img{
	position: fixed;
	right: 0px;
	bottom:12%;
	z-index: 1;
}
/*#formSticky{
	position: fixed;
	right: 0px;
	bottom:12%;
	z-index: 1;
	background: #eee;
}*/
#formSticky p{
	text-align: right;
}
@media screen and (min-width: 1100px){

	#formSticky p img{
		position: fixed;
		right: calc(50% - 550px);
		bottom:12%;
		z-index: 1;
	}
}

/*----ハンバーガーメニュー----*/

.openbtn{
	position: relative;
	z-index: 100;
	cursor: pointer;
	border-radius: 5px;
	justify-content: space-between;
	width: 50px;
	margin-right: 5%;
	background: #fff;
}

.menuDisplay {
	opacity: 1;
}

.menuHidden {
	opacity: 0;
}
.openbtn{
	display: none;
}

/*----カレント------*/

#home nav .home a,
#house nav .nav1 a,
#process nav .nav2 a,
#information nav .nav3 a,
#form nav .nav4 a{
	color: #c0b283;
	padding-bottom: 1px;
	background-image: linear-gradient(90deg, #c0b283, #c0b283); /* 線の色 */
	background-repeat: no-repeat;
	background-position: left bottom; /* 線の起点を左・下に設定 */
	background-size: 100% 4px; /* 線の横幅を0、縦幅を4pxに */
	transition: background-size 0.4s; /* 線を伸ばすアニメーション実行時間を指定 */
}
#home footer .home a,
#house footer .nav1 a,
#process footer .nav2 a,
#information footer .nav3 a,
#form footer .nav4 a{
	color: #c0b283;
	text-decoration-line: underline;
	text-decoration-style: solid;
	text-decoration-color: #c0b283;
	text-decoration-thickness: 2px;
	}

/*-----SP版の設定-------*/

@media screen and (max-width: 767px){
	
	/*-----header-------*/
	header{
		min-height: 60px;
		padding: 5px 0px 5px;
	}
	
	#logo1{
		width: 110px;
	}
	
	#utility p{
		display: none;
	}
	main .icon {
		background-position: calc(50% - 4rem) 0;
		background-size: 60px;
	}
	main .icon h2 {
		padding-top: 15px;
	}
	/*----ハンバーガーメニュー----*/
	
	.gnav-bg{
		background: rgba(250,250,250,0.9);
		position: fixed;
		height: 100%;
		width: 100%;
		z-index: 98;
		top: 0;
		display: none;
	}
	
	header #utility{
		float: none;
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
	}

	.gnav-list{
		display: block;
		padding: 0;
	}
	.gnav-list li{
		margin: 20px 0;
	}
	.gnav-list li a{
		color: #c0b283;
		font-size: 1.5rem;
		transition: .5s;
	}

	.openbtn{
		display: flex;
		margin-left: auto;
	}
	/*-----common-------*/
	.contents{
		padding:0 10px;
	}
	h2{
		font-size: 1.5rem;
		margin-top: 40px;
	}
	.subtitle{
		font-size: 0.875rem;
	}
	/*-----formリンク-------*/
	#formSticky p img{
		width: 22%;
	}
	/*-----footer-------*/
	footer {
		font-size: 0.875rem;  /*  16px */
		padding-top: 50px;
		
	}
	footer ul li{
		display: inline-block;
	}
	footer #logo2{
		text-align: center;
		margin: auto;
	}
	
}