@charset "utf-8";
/* Copyright 2019 FSFIELD All Rights Reserved. */

@media only screen and (min-width:768px){ /* 表示領域が768px以上の場合に適用するスタイル */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	PC

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

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

	トップページ

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

	/* ローディング画面
	---------------------------------------------- */
	.loading{
		width: 100%;
		height: 100%;
		background:#FFF;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 9999;
		transition: opacity .4s;
		transition-delay: 1s;
	}

	.loading img{
		width: 410px;
		height: 375px;
		position: absolute;
		margin: auto;
		right: 0;
		left: 0;
		top: 0;
		bottom: 0;
	}
	
	.loading.loaded{
		opacity: 0;
		pointer-events: none;
	}
	

}/*--@media--*/


@media print, screen and (min-width:768px){ /* 表示領域が768px以上の場合に適用するスタイル */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	PC

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

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

	トップページ

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

	/* メインビジュアル
	---------------------------------------------- */
	#main{
		background: #FFF;
		display:-webkit-flex;
		display:flex;
		-webkit-justify-content:center;
		justify-content:center;
		-webkit-align-items:center;
		align-items:center;
		height: 910px;
		position: relative;
		z-index: 0;
	}

	.image_main{
		background: url("../img/img_logo02.png") no-repeat 0 center;
		background-size: 100%;
		width: 665px;
		height: 264px;
	}
	
	.image_main span{display: none;}

	/* トピックス
	---------------------------------------------- */
	#topics{
		background: #F5F5F5;
		padding: 160px 0;
		position: relative;
		z-index: 0;
	}

	#topics h2{
		text-align: center;
		margin-bottom: 80px;
	}
	
	#topics h2 img{width: 350px;}

	#topics .btn_type01{text-align: center;}
	
	/*--記事--*/
	.wrap_article_topics{
		width: 900px;
		margin: 0 auto;
		display:-webkit-flex;
		display:flex;
		margin-bottom: 80px;
	}
	
	.article_topics{
		background: #FFF;
		width: 280px;
		font-size: 1.6rem;
		margin-right: 30px;
		border: 1px solid #DBDBDB;
	}
	
	.article_topics:last-of-type{margin-right: 0;}
	
	.article_topics a{
		display: block;
		color: #333;
		height: 100%;
	}
	
	.article_topics a .photo{
		overflow: hidden;
		border-bottom: 1px solid #DBDBDB;
	}
	
	.article_topics a .photo span{
		width: 100%;
		height: 200px;
		display: block;
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
		transition-duration: 0.5s;
	}
	
	.article_topics a:hover .photo span{
		transform: scale(1.05);
		transition-duration: 0.5s;
	}
	
	.article_topics a .txt{
		background: #FFF url("../img/ico_arrow02.png") no-repeat center bottom 20px;
		background-size: 30px;
		border-top: none;
		padding: 20px 30px 45px;
		text-align: center;
		height: calc(100% - 201px);
	}
	
	.article_topics a .category{
		background: #000;
		color: #FFF;
		text-align: center;
		font-size: 1.2rem;
		min-width: 160px;
		margin-bottom: 10px;
		padding: 3px 0;
		display: inline-block;
	}
	
	.article_topics a time{
		display: inline-block;
		color: #C1C1C1;
		font-size: 1.4rem;
		margin-bottom: 10px;
	}
	
	.article_topics a .txt h3{
		font-size: 1.6rem;
		line-height: 1.6;
		transition: all 0.5s;
	}
	
	.article_topics a:hover .txt h3{
		color: #C1C1C1;
		transition: all 0.5s;
	}
	
	/* A.T home
	---------------------------------------------- */
	#athome{
		background: #FFF;
		padding: 160px 0;
		position: relative;
		z-index: 0;
	}

	.athome_inner{
		width: 1100px;
		margin: 0 auto;
		display:-webkit-flex;
		display:flex;
		-webkit-justify-content:space-between;
		justify-content:space-between;
		-webkit-align-items:center;
		align-items:center;
	}
	
	.athome_inner h2{padding-left: 100px;}

	.athome_inner h2 img{width: 350px;}
	
	.nav_athome01{
		width: 550px;
		display:-webkit-flex;
		display:flex;
		-webkit-flex-wrap:wrap;
		flex-wrap:wrap;
		-webkit-justify-content:space-between;
		justify-content:space-between;
	}
	
	.nav_athome{
		text-align: center;
		width: 250px;
		min-height: 200px;
	}
	
	.nav_athome:nth-child(1),
	.nav_athome:nth-child(2){margin-bottom: 50px;}
	
	.nav_athome a{
		background: #FFF;
		border: 1px solid #8B8B8B;
		display: block;
		padding: 25px 0 0;
		color: #333;
		transition: background 0.5s;
	}
	
	.nav_athome a:hover{
		background: #E8E8E9;
		transition: background 0.5s;
	}
	
	.nav_athome a .image{
		width: 90px;
		margin-bottom: 13px;
	}
	
	.nav_athome a .txt{margin-bottom: 15px;}
	
	.nav_athome a .arrow{width: 30px;}
	
	/* おとぎの国工房
	---------------------------------------------- */
	#otogi{
		background: #F5F5F5;
		padding: 160px 0;
		position: relative;
		z-index: 0;
	}

	.otogi_inner{
		width: 1100px;
		margin: 0 auto;
	}

	.otogi_inner h2{
		width: 900px;
		margin: 0 auto 80px;
		text-align: right;
	}
	
	.otogi_inner h2 img{width: 350px;}
	
	.otogi{
		width: 1100px;
		margin: 0 auto 80px;
	}
	
	.otogi .photo{
		overflow: hidden;
		margin-bottom: 30px;
	}
	
	.otogi .photo span{
		display: block;
		width: 100%;
		height: 825px;
		background:url("../img/home/img_otogi01.jpg") no-repeat center;
		background-size: cover;
		transition-duration: 0.5s;
	}
	
	.otogi .photo:hover span{
		transform: scale(1.05);
		transition-duration: 0.5s;
	}
	
	.otogi .btn_area .inner{height: 190px;}
	
	.otogi .btn_area .txt{margin-bottom: 25px;}
	
	/*--ガーデンハウス--*/
	.garden{
		display:-webkit-flex;
		display:flex;
		-webkit-justify-content:space-between;
		justify-content:space-between;
	}
	
	.garden .photo{
		overflow: hidden;
		width: 800px;
	}
	
	.garden .photo span{
		display: block;
		width: 100%;
		height: 360px;
		background:url("../img/home/img_otogi02.jpg") no-repeat center;
		background-size: cover;
		transition-duration: 0.5s;
	}
	
	.garden .photo:hover span{
		transform: scale(1.05);
		transition-duration: 0.5s;
	}
	
	.garden .garden_inner{width: 260px;}
	
	.garden .btn_area .txt{margin-bottom: 50px;}
	
	/* 良造
	---------------------------------------------- */
	#hobby{
		background: #F5F5F5;
		padding: 160px 0;
		position: relative;
		z-index: 0;
	}

	#hobby h2{
		width: 900px;
		margin: 0 auto 80px;
	}
	
	#hobby h2 img{width: 350px;}
	
	.hobby{
		width: 1100px;
		margin: 0 auto 80px;
	}
	
	.hobby .photo{
		overflow: hidden;
		margin-bottom: 30px;
	}
	
	.hobby .photo span{
		display: block;
		width: 100%;
		height: 825px;
		background: url("../img/home/img_hobby01.jpg") no-repeat center;
		background-size: cover;
		transition-duration: 0.5s;
	}
	
	.hobby .photo:hover span{
		transform: scale(1.05);
		transition-duration: 0.5s;
	}
	
	.hobby .btn_area .inner{height: 190px;}
	
	.hobby .btn_area .txt{margin-bottom: 25px;}
	
	/*--武川設計室・レントハウス--*/
	.hobby_inner{
		width: 1100px;
		margin: 0 auto;
		display:-webkit-flex;
		display:flex;
		-webkit-justify-content:space-between;
		justify-content:space-between;
	}
	
	.takekawa{width: 270px;}
	
	.takekawa .image{
		overflow: hidden;
		margin-bottom: 30px;
	}
	
	.takekawa .image span{
		background:url("../img/home/pc/img_hobby01.jpg") no-repeat 0 0;
		display: block;
		height: 240px;
		transition-duration: 0.5s;
	}
	
	.takekawa .image:hover span{
		transform: scale(1.05);
		transition-duration: 0.5s;
	}
	
	.takekawa .btn_area{height: 170px;}
	
	.takekawa .btn_area .txt{margin-bottom: 25px;}
	
	.wrap_renthouse{
		width: 780px;
		display:-webkit-flex;
		display:flex;
		-webkit-justify-content:space-between;
		justify-content:space-between;
	}
	
	.wrap_renthouse .photo{overflow: hidden;}
	
	.wrap_renthouse .photo span{
		display: block;
		width: 450px;
		height: 450px;
		background: url("../img/home/img_hobby02.jpg") no-repeat -150px 0;
		background-size: cover;
		transition-duration: 0.5s;
	}
	
	.wrap_renthouse .photo:hover span{
		transform: scale(1.05);
		transition-duration: 0.5s;
	}
	
	.renthouse{width: 300px;}
	
	.renthouse .btn_area .txt{margin-bottom: 25px;}

	/* クローバーハウスセミナー
	---------------------------------------------- */
	#clover{
		background: #FFF;
		padding: 160px 0 180px;
		display:-webkit-flex;
		display:flex;
		-webkit-justify-content:space-between;
		justify-content:space-between;
		-webkit-align-items:center;
		align-items:center;
		position: relative;
		z-index: 0;
	}
	
	.clover_inner{
		width: 1100px;
		margin: 0 auto;
		display:-webkit-flex;
		display:flex;
		-webkit-justify-content:space-between;
		justify-content:space-between;
		-webkit-align-items:center;
		align-items:center;
		-webkit-flex-direction:row-reverse;
		flex-direction:row-reverse;
	}
	
	.clover_inner h2{padding-right: 50px;}

	.clover_inner h2 img{width: 449px;}
	
	.nav_clover01{width: 500px;}
	
	.nav_clover{
		border: 1px solid #DBDBDB;
		margin-bottom: 20px;
	}
	
	.nav_clover:last-of-type{margin-bottom: 0;}
	
	.nav_clover a{
		display:-webkit-flex;
		display:flex;
		color: #333;
		line-height: 1.6;
	}
	
	.nav_clover a .photo{overflow: hidden;}
	
	.nav_clover a .photo span{
		display: block;
		width: 320px;
		height: 180px;
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
		transition-duration: 0.5s;
	}
	
	.nav_clover:nth-child(1) a .photo span{background-image: url("../img/home/nav_clover01.jpg");}
	.nav_clover:nth-child(2) a .photo span{background-image: url("../img/home/nav_clover02.jpg");}
	.nav_clover:nth-child(3) a .photo span{background-image: url("../img/home/nav_clover03.jpg");}
	
	.nav_clover a:hover .photo span{
		transform: scale(1.05);
		transition-duration: 0.5s;
	}
	
	.nav_inner{
		width: 180px;
		text-align: center;
		display:-webkit-flex;
		display:flex;
		-webkit-justify-content:center;
		justify-content:center;
		-webkit-align-items:center;
		align-items:center;
		-webkit-flex-direction: column;
		flex-direction: column;
	}
	
	.nav_inner .txt{margin-bottom: 15px;}
	
	.nav_inner .arrow{
		width: 30px;
		vertical-align: inherit;
	}
	

}/*--@media--*/


@media print{ /* 印刷時のみ */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	PC

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

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

	トップページ

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

	/* ローディング画面
	---------------------------------------------- */
	.loading{display: none;}
	

}/*--@media--*/


@media only screen and (max-width:767px){ /* 表示領域が767px以下の場合に適用するスタイル */
	/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

	スマートフォン（iPhone,Android)

	_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

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

	トップページ

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

	/* ローディング画面
	---------------------------------------------- */
	.loading{
		width: 100%;
		height: 100%;
		background: #FFF;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 9999;
		transition: opacity .4s;
		transition-delay: 1s;
	}

	.loading img {
		width: 205px;
		height: 187.5px;
		position: absolute;
		margin: auto;
		right: 0;
		left: 0;
		top: 0;
		bottom: 0;
	}
	
	.loading.loaded{
		opacity: 0;
		pointer-events: none;
	}

	/* メインビジュアル
	---------------------------------------------- */
	#main{
		background: #FFF;
		display:-webkit-flex;
		display:flex;
		-webkit-justify-content:center;
		justify-content:center;
		-webkit-align-items:center;
		align-items:center;
		height: 113.86vw;
		position: relative;
		z-index: 0;
	}

	.image_main{
		background: url("../img/img_logo02.png") no-repeat 0 center;
		background-size: 100%;
		width: 88.66vw;
		height: 35.2vw;
	}
	
	.image_main span{display: none;}

	/* トピックス
	---------------------------------------------- */
	#topics{
		background: #F5F5F5;
		padding: 21.33vw 0;
		position: relative;
		z-index: 0;
	}

	#topics h2{
		text-align: center;
		margin-bottom: 14.66vw;
	}
	
	#topics h2 img{width: 64.93vw;}
	
	#topics .btn_type01{text-align: center;}
	
	/*--記事--*/
	.wrap_article_topics{
		padding: 0 15px;
		margin-bottom: 40px;
	}
	
	.article_topics{
		background: #FFF;
		margin-bottom: 20px;
	}
	
	.article_topics:last-of-type{margin-bottom: 0;}
	
	.article_topics a{
		display:-webkit-flex;
		display:flex;
		color: #333;
	}
	
	.article_topics a .photo{
		width: 40.57%;
		border: 1px solid #DBDBDB;
	}
	
	.article_topics a .photo span{
		width: 100%;
		height: 100%;
		display: block;
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
	}
	
	.article_topics a .txt{
		width: 59.43%;
		background: #FFF url("../img/ico_arrow02.png") no-repeat right 15px bottom 10px;
		background-size: 25px;
		border: 1px solid #DBDBDB;
		border-left: none;
		padding: 10px 10px 30px 10px;
	}
	
	.article_topics a .category{
		background: #000;
		color: #FFF;
		text-align: center;
		font-size: 1.2rem;
		min-width: 120px;
		margin-bottom: 10px;
		display: inline-block;
	}
	
	.article_topics a time{
		display: block;
		color: #C1C1C1;
		font-size: 1.2rem;
		margin-bottom: 5px;
	}
	
	.article_topics a .txt h3{line-height: 1.6;}
	
	/* A.T home
	---------------------------------------------- */
	#athome{
		background: #FFF;
		padding: 21.33vw 15px;
		position: relative;
		z-index: 0;
	}
	
	.athome_inner h2{
		text-align: center;
		margin-bottom: 14.66vw;
	}
	
	.athome_inner h2 img{width: 64.93vw;}
	
	.nav_athome01{
		display:-webkit-flex;
		display:flex;
		-webkit-flex-wrap:wrap;
		flex-wrap:wrap;
		-webkit-justify-content:space-between;
		justify-content:space-between;
	}
	
	.nav_athome{
		text-align: center;
		width: 50%;
	}
	
	.nav_athome:nth-child(1),
	.nav_athome:nth-child(2){margin-bottom: 15px;}
	
	.nav_athome:nth-child(odd){padding-right: 7.5px;}
	
	.nav_athome:nth-child(even){padding-left: 7.5px;}
	
	.nav_athome a{
		border: 1px solid #8B8B8B;
		padding: 4vw 5px;
		height: 100%;
		color: #333;
		display:-webkit-flex;
		display:flex;
		-webkit-justify-content:center;
		justify-content:center;
		-webkit-align-items:center;
		align-items:center;
		-webkit-flex-direction: column;
		flex-direction: column;
	}
	
	.nav_athome a .image{
		width: 21.73vw;
		margin-bottom: 13px;
	}
	
	.nav_athome a .txt{
		font-size: 1.1rem;
		line-height: 1.2;
		margin-bottom: 15px;
	}
	
	.nav_athome a .arrow{width: 25px;}

	/* おとぎの国工房
	---------------------------------------------- */
	#otogi{
		background: #F5F5F5;
		padding: 21.33vw 15px;;
		position: relative;
		z-index: 0;
	}

	.otogi_inner h2{
		text-align: center;
		margin-bottom: 14.66vw;
	}
	
	.otogi_inner h2 img{width: 64.93vw;}
	
	.otogi{margin-bottom: 35px;}
	
	.otogi .photo{margin-bottom: 10px;}
	
	.otogi .photo span{
		display: block;
		width: 100%;
		padding-top: 75.07%;
		background: url("../img/home/img_otogi01.jpg") no-repeat center;
		background-size: cover;
	}
	
	.otogi .btn_area .inner{
		height: 35.7vw;
		max-height: 134px;
	}
	
	.otogi .btn_area .txt{margin-bottom: 3vw;}
	
	/*--ガーデンハウス--*/
	.garden{
		display:-webkit-flex;
		display:flex;
		-webkit-justify-content:flex-end;
		justify-content:flex-end;
		-webkit-flex-direction:row-reverse;
		flex-direction:row-reverse;
		position: relative;
	}
	
	.garden .photo{
		width: 66.66vw;
	}
	
	.garden .photo span{
		display: block;
		width: 100%;
		padding-top: 100%;
		background: url("../img/home/img_otogi02.jpg") no-repeat 80% center;
		background-size: cover;
	}
	
	.garden .garden_inner{
		width: 34.66vw;
		height: 53.33vw;
		position: absolute;
		right: 0;
		bottom: 0;
	}
	
	.garden .btn_area .txt{margin-bottom: 30px;}
	
	.garden .btn_area .btn_type01{width: 80%;}
	
	.garden .btn_area .btn_type01 a{min-width: inherit;}
	
	/* 良造
	---------------------------------------------- */
	#hobby{
		background: #F5F5F5;
		padding: 21.33vw 15px;
		position: relative;
		z-index: 0;
	}
	
	#hobby h2{
		text-align: center;
		margin-bottom: 14.66vw;
	}
	
	#hobby h2 img{width: 64.93vw;}
	
	.hobby{margin-bottom: 35px;}
	
	.hobby .photo{margin-bottom: 10px;}
	
	.hobby .photo span{
		display: block;
		width: 100%;
		padding-top: 75.07%;
		background: url("../img/home/img_hobby01.jpg") no-repeat center;
		background-size: cover;
	}
	
	.hobby .btn_area .inner{
		height: 35.7vw;
		max-height: 134px;
	}
	
	.hobby .btn_area .txt{margin-bottom: 3vw;}
	
	/*--武川設計室・レントハウス--*/
	.hobby_inner{
		display:-webkit-flex;
		display:flex;
		-webkit-flex-direction: column-reverse;
		flex-direction: column-reverse;
	}
	
	.takekawa .image{
		background:url("../img/home/sp/img_hobby01.jpg") no-repeat 0 0;
		background-size: cover;
		width: 100%;
		padding-top: 57.97%;
		margin-bottom: 10px;
	}
	
	.takekawa .btn_area{
		height: 35.7vw;
		max-height: 134px;
	}
	
	.takekawa .btn_area .txt{margin-bottom: 3vw;}

	.wrap_renthouse .photo{margin-bottom: 10px;}
	
	.wrap_renthouse .photo span{
		display: block;
		width: 100%;
		padding-top: 57.97%;
		background: url("../img/home/img_hobby02.jpg") no-repeat center 45%;
		background-size: cover;
	}
	
	.renthouse{margin-bottom: 30px;}
	
	.renthouse .btn_area{
		height: 35.7vw;
		max-height: 134px;
	}
	
	.renthouse .btn_area .txt{margin-bottom: 3vw;}

	/* クローバーハウスセミナー
	---------------------------------------------- */
	#clover{
		background: #FFF;
		padding: 21.33vw 15px 24vw;
		position: relative;
		z-index: 0;
	}
	
	.clover_inner h2{
		text-align: center;
		margin-bottom: 14.66vw;
	}

	.clover_inner img{width: 90.66vw;}
	
	.nav_clover{
		border: 1px solid #DBDBDB;
		margin-bottom: 30px;
	}
	
	.nav_clover:last-of-type{margin-bottom: 0;}
	
	.nav_clover a{
		display:-webkit-flex;
		display:flex;
		color: #333;
		line-height: 1.6;
	}
	
	.nav_clover a .photo{width: 59.42%;}
	
	.nav_clover a .photo span{
		display: block;
		width: 100%;
		height: 37.33vw;
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
	}
	
	.nav_clover:nth-child(1) a .photo span{background-image: url("../img/home/nav_clover01.jpg");}
	.nav_clover:nth-child(2) a .photo span{background-image: url("../img/home/nav_clover02.jpg");}
	.nav_clover:nth-child(3) a .photo span{background-image: url("../img/home/nav_clover03.jpg");}
	
	.nav_inner{
		width: 40.58%;
		text-align: center;
		display:-webkit-flex;
		display:flex;
		-webkit-justify-content:center;
		justify-content:center;
		-webkit-align-items:center;
		align-items:center;
		-webkit-flex-direction: column;
		flex-direction: column;
	}
	
	.nav_inner .txt{margin-bottom: 15px;}
	
	.nav_inner .arrow{
		width: 25px;
		vertical-align: inherit;
	}


}/*--@media--*/