@charset "utf-8";

main i{margin-right:5px;}

.list4 {
	width: 32%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
	padding: 0px 0px 5px 0px;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
}
.list4 img{
	border-radius: 2px;
	height: auto;
}

.list4_2 {
	width: 32%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
	padding: 0px 0px 5px 0px;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
}

.bg_gr1{
	background: rgb(247,246,246);
background: linear-gradient(180deg, rgba(247,246,246,1) 0%, rgba(251,250,250,1) 16%, rgba(255,255,255,1) 100%);
}

.bdr8{
	border-radius:8px;
	}

.list5 {
	width: 32%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
	padding: 0;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
	background-color:#171C61;
}
.list5 img{
	height: auto;
}

.list5 h4{	
	text-align:center;
	padding-top:5px;
	}

.list5 a {
	text-decoration: none;
	color: #FFF;	/*文字色*/
}
.list5 figure{
	overflow: hidden;
	}
	
.list5 img{display: block;
  transition-duration: .5s;
}	

.list5 img:hover{
  transform:scale(1.2,1.2);
}

.list6 {
	width: 32%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
	padding: 0px 0px 5px 0px;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
	transition: 0.3s;		/*アニメーションにかける時間。0.3秒。*/	
}
.list6 img{
	border-radius: 2px;
	height: auto;
}

.list7 {
	width: 48%;				/*ボックスの幅*/	
	padding: 0px 0px 5px 0px;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
	transition: 0.3s;		/*アニメーションにかける時間。0.3秒。*/	
}
.list7 img{
	border-radius: 2px;
	height: auto;
}
.list8 {
	width: 48%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
	padding: 0px 0px 5px 0px;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
}
.list8 img{
	border-radius: 2px;
	height: auto;
}

.list9 {
	width: 22%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
	padding: 0;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
	padding:10px;background:#FFF;
	
}
.list9 img{
	height: auto;
	display: block;
  transition-duration: .5s;
}

.list9 h4{	
	text-align:center;
	padding-top:5px;
	}

.list9 a {
	text-decoration: none;
	color: #171C61;	/*文字色*/
}
.list9 figure{
	overflow: hidden;
	}

.list9 img:hover{
  transform:scale(1.2,1.2);
}



.list10 {
	width: 22%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
	padding: 0;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
	padding:10px;
}
.list10 img{
	height: auto;
}


.list10 a {
	text-decoration: none;
	color: #171C61;	/*文字色*/
}


.list11 {
	width: 48%;				/*ボックスの幅*/	
	padding: 0px 0px 5px 0px;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
}
.list11 img{	
	height: auto;
}

.list12 {
	width: 22%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
	padding: 0;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
	padding:10px;background:#FFF;
	
}


.list12 h4{	
	text-align:center;
	padding-top:5px;
	}

.list12 a {
	text-decoration: none;
	color: #171C61;	/*文字色*/
}




.lh1{
	line-height:1.3;
	}
.lh2{
	line-height:1.8;
	}
.pd5{
	padding:5px;
	}
.pd10{
	padding:10px;
	}
.pd30{
	padding:30px;
	}
.mg_b10{
	margin-bottom:10px;
	}
.mg_b20{
	margin-bottom:20px;
	}
.mg-r10{
	margin-right:10px;
	}
.label{
	font-size:24px;
	color:white;
	font-weight:normal;	
	}
.anshin_p{
	background-color:#FF0000;
	padding-left:5px;
	padding-right:5px;
	width:100px;
	border-radius:10px;
	color:#FFFFFF;
	}
.anshin_pink{
	background-color:#ff7777;
	padding-left:5px;
	padding-right:5px;
	border-radius:10px;
	color:#FFFFFF;
	}
.ldk_kon{
	background-color:#171C61;
	padding-left:5px;
	padding-right:5px;
	border-radius:10px;
	color:#FFFFFF;
	}
.wd50{
	width:50%;
	}
.wd45{
	width:45%;
	}
.wd70{
	width:78%;
	}
.wd70_1{
	width:70%;
	}
.wd100px{
	width:100px;
	}
.center{
	text-align:center;
	}
.txt_right{
	text-align:right;
	}

.pict1{
padding: 2px;
    border: 1px solid #CCCCCC;
}

.border_bg{
	border-bottom:solid 1px #CCC;
	}
.list figure{
	overflow: hidden;
	}

.list img:hover{
  transform:scale(1.2,1.2);
}
	
.c-toppage-contact {
	width: 700px;
	margin: 0 auto;
	background: #fff;
	margin-bottom:25px;
}

.c-toppage-contact .e-title {
	color: #fff;
	font-size: 26px;
	font-weight: 700px;
	text-align: center;
	vertical-align: middle;
	width: 220px;
	background: #666;
	display: table-cell;
}

.c-toppage-contact .e-items {
	font-size: 18px;
	text-align: left;
	line-height: 1.75;
	vertical-align: middle;
	padding: 10px 20px;
	display: table-cell;background:#DFDFDF;
}

.c-toppage-contact .e-items a {
	color: #00005d;
	text-decoration: underline;
}

.c-toppage-contact .e-items a:hover {
	text-decoration: none;
}

/*メイン画像下に余白をつける*/

.gallery{
  margin:0 0 5px 0;
}

/*矢印の設定*/



/*選択するサムネイル画像の設定*/

.choice-btn li{
  cursor: pointer;
  outline: none;
  background:#333;
  width:25%!important;
  height:auto;
}

.choice-btn li img{
  opacity: 0.4;/*選択されていないものは透過40%*/
}

.choice-btn li.slick-current img{
  opacity: 1;/*選択されているものは透過しない*/
}

.choice-btn .slick-track {
  transform: unset !important;/*画面幅サイズ変更に伴うサムネイル固定*/
}

.choice-btn ul{
  margin:0;
  padding: 0;
  list-style: none;
}


a:hover,
a:active{
  text-decoration: none;
}

.pink{
	color:#ef63a5;}

.fl_right2{
	float:right;
	}
	
.bt_rinobe a{
	display:block;
	text-align:center;
	line-height:;
	width:210px;
	height:50px;
	margin:0 auto;
	font-size:18px;
	color:#FFF;	
	background-color:#ffa303;
	padding:10px;
	border-radius:10px;
	text-decoration:none;
	vertical-align: middle;
	box-shadow: 5px 5px 4px rgba(0,0,0,0.2);
	}

.bt_rinobe a:hover{
	background-color:#ffd11a;
	color:#FFF;
	}
.bt_shueki a{
	display:block;
	text-align:center;
	line-height:;
	width:210px;
	height:50px;
	margin:0 auto;
	font-size:18px;
	color:#FFF;	
	background-color:#fd0000;
	padding:10px;
	border-radius:10px;
	text-decoration:none;
	vertical-align: middle;
	box-shadow: 5px 5px 4px rgba(0,0,0,0.2);
	}

.bt_shueki a:hover{
	background-color:#fe6e6e;
	color:#FFF;
	}
	
.bt_bunjo a{
	display:block;
	text-align:center;
	line-height:;
	width:210px;
	height:50px;
	margin:0 auto;
	font-size:18px;
	color:#FFF;	
	background-color:#28a1fe;
	padding:10px;
	border-radius:10px;
	text-decoration:none;
	vertical-align: middle;
	box-shadow: 5px 5px 4px rgba(0,0,0,0.2);
	}

.bt_bunjo a:hover{
	background-color:#67cafe;
	color:#FFF;
	}
.h_moushikomi a{
	display:block;
	width:200px;
	text-align:center
	padding:10px;
	border-radius:30px;
	background:#fd8f19;
	text-decoration:none;
	text-align:center;
	color:#FFF;
	}
.h_moushikomi a:hover{
	display:block;
	width:200px;
	text-align:center
	padding:10px;
	border-radius:30px;
	background:#FF0000;
	text-decoration:none;
	text-align:center;
	color:#FFF;
	}
.shade {
  box-shadow: 6px 6px #EDEDED;
}

.map a{
	width:85px;
	display:block;
	text-indent:6px;
	text-decoration:none;
	background:#171C61;
	color:#FFFFFF;margin:0 auto;
	}
.map a:hover{
	background:#d59938;
	}


@media screen and (max-width:1100px) {
.list4_2 {
	width: 48%;}
	}
/*---------------------------------------------------------------------------
ここから下は画面幅320px以下の追加指定
---------------------------------------------------------------------------*/
@media screen and (max-width:320px) {


.br-tab{
	display:none;
	}
	

}



/*---------------------------------------------------------------------------
ここから下は画面幅480px以下の追加指定
---------------------------------------------------------------------------*/
@media screen and (max-width:480px) {

.br-tab{
	display:none;
	}
	
.sp-none{
	display:none;}
	
.list9 {
	width: 100%;}
.list12 {
	width: 100%;}	

/*　※注意！　下の閉じカッコ　}　は480px以上の設定に必要なので、うっかり削除しないように。　*/

}
/*---------------------------------------------------------------------------
ここから下は画面幅600px以下の追加指定
---------------------------------------------------------------------------*/
@media screen and (max-width:600px) {

.label{
	font-size:16px;
	color:white;
	font-weight:normal;	
	}
.wd30{width:30%;
}

.list4 {
	width: 100%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
	padding: 0px 0px 5px 0px;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
	transition: 0.3s;		/*アニメーションにかける時間。0.3秒。*/	
}
.list4 img{
	border-radius: 2px;
	height: auto;
}
.list4_2 {
	width: 100%;	
	}

.list10 {
	width: 100%;}
}
@media screen and (max-width:699px) {
.list4 {
	width: 48%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
	padding: 0px 0px 5px 0px;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
	transition: 0.3s;		/*アニメーションにかける時間。0.3秒。*/	
}
.list4 img{
	border-radius: 2px;
	height: auto;
	}
.list4_2 {
	width: 100%;	
	}
.list5 {
	width: 48%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
	padding: 0px 0px 5px 0px;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
	background-color:#171C61;
}
.list5 img{
	height: auto;
}

.list5 h4{
	font-size:14px;
	}
.list6 {
	width: 48%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
	padding: 0px 0px 5px 0px;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
	transition: 0.3s;		/*アニメーションにかける時間。0.3秒。*/	
}
.list6 img{
	border-radius: 2px;
	height: auto;
	}
.sp-none1{
	display:none;}	

.pc-only3{
	display:none;}

.list9 img{
	height: auto;
}

.list12 img{
	height: auto;
}

.list10 {
	width: 48%;				/*ボックスの幅*/	
}


}

@media screen and (max-width:500px) {
.list4 {
	width: 100%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
	padding: 0px 0px 5px 0px;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
	transition: 0.3s;		/*アニメーションにかける時間。0.3秒。*/	
}
.list4 img{
	border-radius: 2px;
	height: auto;
}
.list4_2 {
	width: 100%;	
	}

.list5 {
	width: 100%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
	padding: 0px 0px 5px 0px;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
	background-color:#171C61;
}
.list5 img{
	height: auto;
}

.list5 h4{
	font-size:16px;
	}
	
	.c-toppage-contact {
	width: 100%;
	margin: 0 auto;
	background: #fff;
}

.c-toppage-contact .e-title {
	color: #fff;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	vertical-align: middle;
	width: 100%;
	background: #666;
	display: block;
}

.c-toppage-contact .e-items {
	font-size: 18px;
	text-align: left;
	line-height: 1.75;
	vertical-align: middle;
	padding: 10px 20px;display: block;	
}

.list7 {
	width: 100%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
}
.list7 img{
	height: auto;
}

.list9 {
	width: 80%;				/*ボックスの幅*/
	margin:0 auto;
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
}
.list9 img{
	height: auto;
}

.list12 {
	width: 80%;				/*ボックスの幅*/
	margin:0 auto;
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
}
.list12 img{
	height: auto;
}


.wd70_1{
	width:100%;
	}

}




/*---------------------------------------------------------------------------
ここから下は画面幅700px以上の追加指定
---------------------------------------------------------------------------*/
@media screen and (max-width:700px) {

.list8 {
	width: 100%;				/*ボックスの幅*/
}

.list10 {
	width: 48%;				/*ボックスの幅*/	
}

.tab-none{
	display:none;
}
/*　※注意！　下の閉じカッコ　}　は700px以上の設定に必要なので、削除しないで下さい。　*/

}

/*---------------------------------------------------------------------------
ここから下は画面幅800px以下の追加指定
---------------------------------------------------------------------------*/
@media screen and (max-width:800px) {
.c-toppage-contact {
	width: 100%;
	margin: 0 auto;
	background: #fff;
}

.house_bk{background:url("images/option/house_bk.jpg") no-repeat center top;}
.list11 {
	width: 90%;				/*ボックスの幅*/		
}


}

@media screen and (max-width:1250px) {
.list12 {
	width: 48%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
}
}


@media screen and (max-width:950px) {
.fl_cl2	{
	clear:both;
	}
.fl_right2{
	float:none;
	}
	
.center2{
	text-align:center;
	}
.sp-none2{
	display:none;}	
.list9 {
	width: 48%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
}

.list10 {
	width: 33%;				/*ボックスの幅*/	
}

.list12 {
	width: 48%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
}
.br-pc2{
	display:none;
	}
.tab-none{
	display:none;
}

}

@media screen and (max-width:600px) {
.list10 {
	width: 48%;				/*ボックスの幅*/	
}


}

@media screen and (min-width:346px) {
.pc-none{
	display:none;
	}
.pc-soshiki{
	display:none;
	}
	}

@media screen and (min-width:700px) {

.pc-none2{
	display:none;
	}


}

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

.tab-soshiki{
	display:block;
}

.pc-soshiki{
	display:none;
	}
	}
@media screen and (max-width:540px) {
.list12 {
	width: 80%;				/*ボックスの幅*/
	margin:0 auto;
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
}
.list12 img{
	height: auto;
}
}


/*---------------------------------------------------------------------------
ここから下は画面幅801px以上の追加指定
---------------------------------------------------------------------------*/
@media screen and (min-width:801px) {
.tab-soshiki{
	display:none;
}

.pc-soshiki{
	display:block;
	}
	}
/*---------------------------------------------------------------------------
ここから下は画面幅1000px以上の追加指定
---------------------------------------------------------------------------*/
@media screen and (min-width:1000px) {


.wd30{
	width:30%;
	}

.fl_right3{
	float:right;
	}

.pd_wrap1{
padding-top:150px;padding-bottom:10px;padding-right:10px;padding-left:10px;
}

.pd_wrap2{
padding-top:150px;padding-bottom:10px;padding-right:10px;padding-left:10px;

}

/*　※注意！　下の閉じカッコ　}　は1000px以上の設定に必要なので、削除しないで下さい。　*/

}



@media screen and (max-width:1199px) {
.pc-only1{
	display:none;
	}
.tab-only1{
	display:block;
	}
.br-pc1{
	display:none;
	}
		
}
/*---------------------------------------------------------------------------
ここから下は画面幅1200px以上の追加指定
---------------------------------------------------------------------------*/
@media screen and (min-width:1200px) {

.pc-only1{
	display:block;
	}
.tab-only1{
	display:none;
	}
.br-pc1{
	display:block;
	}
.list9 {
	width: 20%;
	}	
	
/*　※注意！　下の閉じカッコ　}　は1200px以上の設定に必要なので、削除しないで下さい。　*/

}

@media screen and (min-width:1400px) {

.list9 {
	width: 15%;
	}

}


/*---------------------------------------------------------------------------
ここから下は画面幅1600px以上の追加指定
---------------------------------------------------------------------------*/
@media screen and (min-width:1600px) {



/*　※注意！　下の閉じカッコ　}　は1200px以上の設定に必要なので、削除しないで下さい。　*/

}