@charset "UTF-8";
/*//共通部分//////////////////////*/
body{
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	padding: 0 !important;
	margin: 0 !important;}


#grad45{
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	padding: 0;
	margin: 0;}

img{width: 100%;}

a{
	text-decoration: none;
	color: #fff;}


@media screen and (min-width:750px)  {
  .br_sp {
    display: none;
  }
}

@media screen and (min-width:750px)  {
  .br_pc{
    display: inline;
  }
}

.content{
	margin: auto;
	width: 90%;}

@media screen and (min-width:750px) {
.content{
	margin: auto;
	max-width: 900px;}
	}

.sc_a{
	padding-left: 10%;
	padding-right: 10%;}

ul{
	text-align: left;
	list-style: none;
	padding: 0;
margin: 0;}

h2{
padding: 0;
margin: 0;
font-weight: normal;
letter-spacing: 0.3rem;
font-size: 1.4rem;
line-height: 2.4rem;}

h3{
padding: 0;
margin: 0;
text-align: center;
letter-spacing: 0.1rem;
font-size: 1.2rem;
line-height: 1.8rem;}

h4{
font-size: 1.0rem;
line-height: 2.0rem;
line-height: 0;
padding: 0;
margin: 0;}

p{
font-size: 1.0rem;
line-height: 2.0rem;
padding: 0;
margin: 0;}



/*text-align*/
.ta-l{text-align: left;}
.ta-c{text-align: center;}
.ta-r{text-align: right;}


/*font*/
.fs-sm{	
	font-size: 0.8rem;
	line-height: 1.2rem;
}

.fs-md{
	letter-spacing: 0.1rem;
	font-size: 1.0rem;
	line-height: 2.0rem;
}

.yl_line{
	background: linear-gradient(transparent 50%, #fdd87d 50%);
	}


/*flex*/
		.fx {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
			display: flex;}

@media screen and (min-width:750px) {
    .fx--sp-block {
        display: block;
    }
}

.fx--item-s {
    -webkit-box-align: flex-start;
    -ms-flex-align: flex-start;
    align-items: flex-start;
}

.fx--item-e {
    -webkit-box-align: flex-end;
    -ms-flex-align: flex-end;
    align-items: flex-end
}

.fx--item-c {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.fx--jc-c {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.fx--jc-e {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}


.fx--jc-sb{
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.fx--dir-r-r {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

.fx--wrap {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}


		@media screen and (min-width:750px) {
.pc_fx {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
			display: flex;}
			
.pc_twin li{flex-basis:calc((100% - 3.0rem) / 2);}
.pc_twin div{flex-basis:calc((100% - 3.0rem) / 2);}
}



/*２つ並び調整*/

.twin li{flex-basis:calc((100% - 3.0rem) / 2);}
.twin div{flex-basis:calc((100% - 3.0rem) / 2);}


/*margin-bottom*/

.mb--sm{margin-bottom: 0.5rem;}
.mb--smd{margin-bottom: 1.0rem;}
.mb--md{margin-bottom: 1.5rem;}
.mb--lmd{margin-bottom: 2.0rem;}
.mb--lg{margin-bottom: 2.5rem;}
.mb--xl{margin-bottom: 5.0rem;}


		@media screen and (min-width:750px) {
.mb--sm{margin-bottom: 1.0rem;}
.mb--smd{margin-bottom: 2.0rem;}
.mb--md{margin-bottom: 3.0rem;}
.mb--lg{margin-bottom: 5.0rem;}
.mb--xl{margin-bottom: 10rem;}}


/*scroll*/
.fade{
  opacity : 0;
  transition: all 1s;
	transform: translateY(100px);
}
 
.view{
  opacity: 1;
	transform: translateY(0);
}

.fade_2{
	overflow: hidden;
  opacity : 0;
  transition: all 1s;
	transform: translateX(100px);
}
 
.view_2{
  opacity: 1;
	transform: translateX(0);
}

.fade_3{overflow: hidden;
  opacity : 0;
  transition: all 1s;
	transform: translateX(-100px);
}
 
.view_3{
  opacity: 3;
	transform: translateX(0);
}



/*//共通部分//////////////////////*/


/*//top_button//////////////////////*/
.top_button{
	width: 70px;
	height: 70px;
	z-index: 99;
	bottom: 68px;
	right: 0.8%;
	position: fixed;
	border-radius: 35px;
	border: 2px solid #fff;
	background-color: rgba(124,124,124,0.80);}

.top_button a{
	display: block;
    text-align: center;
    color: #fff;
	font-size: 18px;
    text-decoration: none;
    padding: 12px 10px;
}

.top_button span{
	display: block;
	font-size: 16px;
	margin-top: -8px;
}



@media screen and (min-width:750px) {.top_button{
bottom: 60px;}
}
/*//top_button//////////////////////*/


/*//bottom_button//////////////////////*/
.bottom_button{
	width: 100%;
	z-index: 100;
	bottom: 0;
	position: fixed;}

.bb_con{
	margin: 0 0.5%;
	height: 60px;
	color: #fff;
	text-align: center;
}

.bb_con div{
	border-radius: 10px 10px 0 0;
	border: 2px solid #fff;
	border-bottom: none;
	flex-basis:calc((100% - 0.8rem) / 2);}

.bb_con a{
	font-weight: bold;
	font-size: 0.9rem;
	text-decoration: none;
	color: #fff;}

.bb_showroom{
	position:relative;
	background-color: #fa9b55;}

.bb_showroom a{
	top:0px;
  left:0;
	padding-top: 20px;
  width:100%;
  height:100%;
	position:absolute;}

.bb_planing{
	position:relative;
	background-color: #525252;}

.bb_planing a{
	top:0px;
  left:0;
	padding-top: 20px;
  width:100%;
  height:100%;
	position:absolute;}

@media screen and (min-width:750px) {
	.bottom_button{
top: 0;
right: 0;
bottom: auto;
position: fixed;
width: 45%;}
	
.bb_con div{
	border-radius: 0 0 10px 10px;}
}

@media screen and (min-width:1000px) {
	.bottom_button{
width: 35%;}
}

/*//bottom_button//////////////////////*/


/*//nav//////////////////////*/
#nav-content ul {
    text-align: center;
}

#nav-content {
    width: 80%;
    background-color: rgba(0,0,0,0.9);
}

		@media screen and (min-width:750px) {
			#nav-content {
    width: 30%;
			}}

/*//nav//////////////////////*/

/*//wrapper//////////////////////*/

.wrapper{	overflow: hidden;}

/*//wrapper//////////////////////*/

/*//yajirusi//////////////////////*/

.yajirusi{margin: 10% auto;}

.yajirusi img{width: 25%;}

/*//yajirusi//////////////////////*/

/*//hero//////////////////////*/

.hero {
	position: relative;
	height: 90vh;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;}


.hero div h1{
	z-index: 999;
	padding-left: 1rem;
	max-width: 9rem;}

.hero .hero_txt{
position: absolute;
top: 55%;
transform: translate(0,-50%);}

.hero .hero_txt img{
filter: drop-shadow(0px 0px 10px #ffffff) drop-shadow(0px 0px 10px #ffffff) drop-shadow(0px 0px 10px #ffffff);}


@media screen and (min-width:750px) {
	.hero {
	height: 800px;}
	.hero div h1{
	max-width: 16rem;}
	}

@media screen and (min-width:1400px) {
.hero {
	width: 80%;
	margin: auto;
	position: relative;
	height: 100vh;
  background-repeat: no-repeat;
  background-size: cover 50%;
  background-position: bottom center;}
	
.hero::after {
	position: absolute;
	content: '';
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	box-shadow:inset 2rem 0px 2rem #fff, inset -2rem 0px 2rem #fff;
}
	}

/*//hero//////////////////////*/


/*//myhome_check//////////////////////*/

.myhome_check{}

.myhome_check li{
	margin-bottom: 5%;
}

.myhome_check li img{
	margin-right: 5%;
	height: auto;
	width: 40px;}

@media screen and (min-width:750px) {
.myhome_check{
	margin: auto;
	max-width: 1000px;}
	
	.myhome_check .pc_img{
text-align: center;
}
	
.myhome_check .pc_img img{
	width: 60%;
	margin: auto;
}}

/*//myhome_check//////////////////////*/

/*//osusume_stainless_kitchen//////////////////////*/

.osusume_stainless_kitchen{
	padding-bottom: 1%;
	background-color: #f4eddb;
}

.sc_head{
	z-index: 1;}

.osk_head{}


.osk_head_ttl_txt{
	padding: 0 0%;
	padding-top: 5rem; 
 background-color: #fff;
	margin-bottom: -10%;
	filter: drop-shadow(0px 70px 30px #fff);}

.osk_head_ttl_img {
	height: 50vh;
	background-size: cover;
	background-position: bottom;
	background-image: url("../img/s3_ttl-top_img.jpg");
}



.osk_con
{background-color: #fff;
	position: relative;
	z-index: 2;
	margin-top: -15%; 
	margin-bottom: 15%; }

.osk_con_in{
	padding: 5%;
	padding-top: 10%; 
}

.osk_con_in h3{
	margin-left: auto;
	margin-right: auto;
}

.cn_one
{}

.slider_2 .slick-prev
{
    left: 10px;
}
.slider_2 .slick-next
{
    right: 10px;
}

.slider_2 .slick-prev,
.slider_2 .slick-next
{ z-index: 500;}

.slider_2 .slick-prev::before,
.slider_2 .slick-next::before {
 font-size: 20px; 
 color: #FFFFFF; }

@media screen and (min-width:750px) {
.osusume_stainless_kitchen{
	margin: auto;
	padding-bottom: 10%; }
	
	.sc_head{
	margin: auto;}
	
.osk_head_ttl_txt{
	padding: 0 20%;}
	
	.osk_head_ttl_txt img{
max-width: 600px;
margin: auto;}
	
	.osk_con{
		margin-bottom: 0%; }
	
	.osk_head_ttl_img {
	height: 90vh;
}
	
	.osusume_stainless_kitchen .pc_img{
text-align: center;
}
	
.osusume_stainless_kitchen .pc_img img{
	width: 80%;
	margin: auto;
}

.osusume_stainless_kitchen .osk_con h4{width: 60%;}	
	
}

/*//osusume_stainless_kitchen//////////////////////*/


/*//osusume_all_stainless_kitchen//////////////////////*/

.osusume_all_stainless_kitchen{}

.oask_head_ttl_txt{
	padding: 0 5%;
	z-index: 1;
	margin-bottom: -10%;}

.oask_head_ttl_img {
	height: 50vh;
	background-size: cover;
	background-position: bottom;
	background-image: url("../img/s4_ttl-top_img.jpg");
}

@media screen and (min-width:750px) {
.osusume_all_stainless_kitchen{
	background-color: #fff;
	margin: auto;}
	
.osusume_all_stainless_kitchen .pc_img{
text-align: center;
}
	
	.oask_head_ttl_txt{
	padding: 0 20%;}
	
.oask_head_ttl_txt img{
max-width: 600px;
margin: auto;}
	
	.oask_head_ttl_img {
	height: 90vh;
}

.osusume_all_stainless_kitchen .osk_con h4{width: 60%;}	
	
}


/*//osusume_all_stainless_kitchen//////////////////////*/


/*//aishou//////////////////////*/

.aishou{}

.slick-dots li{margin: 0 0px;}

.slick-slide{margin: 0 5px;}

.slider .slick-prev
{
    left: 10px;
}
.slider .slick-next
{
    right: 10px;
}

.slider .slick-prev,
.slider .slick-next
{ z-index: 500;}

.slider .slick-prev::before,
.slider .slick-next::before {
 font-size: 20px; 
 color: #FFFFFF; }

@media screen and (min-width:750px) {
.aishou{
	background-color: #fff;
	margin: auto;}
	
.aishou .pc_img{
text-align: center;
max-width: 500px;
margin: auto;
margin-bottom: 5.0rem;
}
	
.aishou .pc_img img{
	margin: auto;
}}

/*//aishou//////////////////////*/


/*//osusume_grad//////////////////////*/

.osusume_grad{}



.og_head_ttl_txt{
	background-color: #f3f3f3;
	filter: drop-shadow(0px 70px 30px #f3f3f3);
	padding: 0 5%;
	padding-top: 5rem; 
	margin-bottom: -10%;}

.og_head_ttl_img {
	z-index: -1;
	height: 50vh;
	background-size: cover;
	background-position: center;
	background-image: url("../img/s6_ttl-top_img.jpg");
}


.og_con{
	   margin: auto;
    width: 90%;
}

.og_con h3{
	text-align: left;
}

.og_con .cn_head h3 img{
	width: 80%;
}

.left{
display: flex;
justify-content: flex-start;
}

.right{
overflow: hidden;
display: flex;
justify-content: flex-end;
}

.og_con .cn_one{
	width: 100%;}
.og_con .cn_two{
	width: 100%;}
.og_con .cn_three{
	width: 100%;}

.cn_one{overflow: hidden;}

.cn_three{overflow: hidden;}

.og_con .cn_two h3{
	text-align: right;
}

@media screen and (min-width:750px) {
.osusume_grad{
	background-color: #fff;}
	
	.osusume_grad .sc_head{
	background-color: #f3f3f3;
margin-bottom: 5rem;
padding-bottom: 5rem;
}
	
	.og_head_ttl_txt{
	padding: 0 20%;
	    padding-top: 5rem;}
	
.og_head_ttl_txt img{
max-width: 600px;
margin: auto;}
	

	.osusume_grad .content{
	max-width: 900px; 
	margin: auto;
}

.osusume_grad .pc_img{
text-align: center;
}
	
.osusume_grad .pc_img img{
	width: 80%;
	margin: auto;
}
	
	.osusume_cn_fx
	{display: flex;
		justify-content: space-between;
		align-items: center;
	}
	
		.osusume_cn_fx div
	{
		flex-basis:calc((100% - 3.0rem) / 2);
	}
	
		.og_con .cn_two
	{
		flex-flow: row-reverse;
	}
	

	.og_con{
	max-width: 900px; 
	margin: auto;}
	
	.og_con .cn_one{
	width: 100%;}
.og_con .cn_two{
	width: 100%;}
.og_con .cn_three{
	width: 100%;}

	
	.og_head_ttl_img {
	height: 90vh;
}
	
}


/*//osusume_grad//////////////////////*/


/*//tokutyou_grad//////////////////////*/

.tokutyou_grad{
	padding-top: 10%;
	padding-bottom: 5%;
	background-color: #f3f3f3;}

.tokutyou_grad .sc_head{
	margin-left: auto;
	margin-right: auto;
	width: 50%;}

	.cn_img{
		text-align: center;}

.tg_con .cn_one h3{text-align: left;}
.tg_con .cn_two h3{text-align: left;}
.tg_con .cn_three h3{text-align: left;}

.cn_ex{
	padding: 10% 5%;
	background-color: #fff;}

.cn_ex_img{
	margin-inline-start: 0.6rem;}

@media screen and (min-width:750px) {
	
	.tokutyou_grad{}
	
	.tg_con{
		margin: auto;}
	
	.tg_3con{
		justify-content: space-between;
		display: flex;}
	
	.tg_3con div{
		flex-basis:calc((100% - 2.0rem) / 3);}
	
	.tokutyou_grad .pc_img{
		text-align: center;
		max-width: 500px;
	}	
	
		.tokutyou_grad .pc_img img{
		width: 50%;
	}
	
	.cn_ex{
	padding: 0% 5%;
	padding-top: 5%;}
	
	.cn_ex_img{
	margin-inline-start: 1.0rem;}
	
	.cn_ex_2con{
		justify-content: space-between;
		display: flex;}
	
.cn_ex_2con div{
		flex-basis:calc((100% - 2.0rem) / 2);}
}



/*//tokutyou_grad//////////////////////*/


/*//sns_grad//////////////////////*/

.sns_grad{ margin: auto;}

.sns_tag{
	text-align: right;
}

.sns_grad .sc_head{padding: 0 5%;}

.sns_tag p {
  position: relative;
  display: inline-block;
  margin-left: 8%;
  padding-right: 2%;
  background: #dbd2c3;
}

.sns_tag p:before {
  position: absolute;
  top: 0;
  left: -22px;
  content: '';
  border-width: 16px 22px 16px 0;
  border-style: solid;
  border-color: transparent #dbd2c3 transparent transparent;
}

.sg_con{}

.sg_con ul li{
	flex-basis:calc((100% - 1.0rem) / 2);
	margin-bottom: 0.8rem;}

.button_sns{
	width: 70%;
	margin: auto;
	padding: 5% 10%;
	border: 1px black solid;
}

.button_sns p{
	margin:auto;
}

.button_sns a{
	color: #000;
}

.black_img{
    filter: invert(100%);
}

@media screen and (min-width:750px) {
	.sns_grad{
		margin: auto;
		margin-bottom: 5.0rem;}
	
		.sns_grad .sc_head{
			padding: 0 20%;
			margin: auto;
		max-width: 600px;}
	
	.sns_grad .pc_img{
		margin: auto;
		margin-bottom: 2rem;
		text-align: center;
		width: 50%;
	}	
	
		.sns_grad .pc_img img{
	}	
	
	.sg_con ul li{
	flex-basis:calc((100% - 1.0rem) / 3);
	margin-bottom: 0.8rem;}
	
	.button_sns{
	padding: 2% 5%;
	max-width: 260px;
}
	
	.sns_tag p {
  margin-left: 4%;
  padding-right: 2%;
}
	
}

/*//sns_grad//////////////////////*/


/*//faq_grad//////////////////////*/

	.faq_grad{background-color: #dbd2c3;}

	.faq_content{
		padding-top: 4.0rem;
		padding-bottom: 4.0rem;
		background-color: #dbd2c3;}
	

.faq_grad_logo{
text-align: center;}

.faq_grad_logo h2{
line-height: 0;}

.faq_grad_logo img{
width: 40%;}


.acd .title i{flex-basis:1.5em;font-family:'Lato', sans-serif;text-transform:none;font-style:normal;margin-right:1rem;font-size:2rem;vertical-align:middle;text-align:center;}
.acd .title span{flex-basis:calc(100% - 1.5em)}
.acd .content .content-inner{display:flex;justify-content:flex-start;align-items:flex-start;}
.acd .content .content-inner i{font-family:'Lato', sans-serif;text-transform:none;font-style:normal;font-size:2rem;vertical-align:middle;margin-right:1rem;text-align:center;}
.acd .content .content-inner div{flex-basis:calc(100% - 1.5em);}
.acd .content .content-inner div p{margin-top: 0px;}
.acd .content .content-inner div ol{font-size:14px;counter-reset:item;line-height:2;}
.acd .content .content-inner div ol li{text-indent:-1.3em;padding-left:1.3em;}
.acd .content .content-inner div ol li::before{counter-increment:item;content:counter(item) ".";}

.acd .title::after {
  transform: rotate(90deg);
  box-sizing: border-box;
}

.toggle{display:none}
.acd .title,.acd .content{-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translateZ(0);transition:all 0.4s}
.acd .title{padding:1em 3em 1em 1em;display:block;cursor:pointer;transition:background-color 0.3s cubic-bezier(0.47, 0, 0.745, 0.715)}
.acd .title::before,.acd .title::after{content:'';position:absolute;right:1.25em;top:50%;width:2px;margin-top:-.525em;height:0.75em;transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);background-color:#303030}
.acd .title::after{transform:rotate(90deg)}
.acd .title{
    margin-left: 2.6rem;
    text-indent: -2.6rem;
}
.acd .content{height:0;overflow:hidden}
.acd .toggle:checked+.title+.content{height:auto}
.acd .toggle:checked+.title:before{transform:rotate(90deg) !important}




.faq_img {
	z-index: -1;
	height: 50vh;
	background-size: cover;
	background-position: center;
	background-image: url("../img/faq_back_img.jpg");
}

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

	.faq_content{
		padding-top: 4.0rem;
		padding-bottom: 4.0rem;
		background-color: #dbd2c3;}
	
.acd .title .title_txt{font-size: 1.0rem;}

	.faq_img{
height: 70vh;
	}	
}



/*//faq_grad//////////////////////*/


/*//button_grad//////////////////////*/

.button_grad h3{
	font-size: 1.0rem;
	font-weight: normal;
}

	.button_grad .content
	{display: block;}

.button_showroom{
	margin: auto;
	width: 70%;
	color: #fff;
	padding: 5% 10%;
	background-color: #fa9b55;
}

.button_planing{
	margin: auto;
	width: 70%;
	color: #fff;
	padding: 5% 10%;
	background-color: #525252;}

.yokoyajirusi{margin-left: 2%;}

.yokoyajirusi img{width: 80%;}


@media screen and (min-width:750px) {
	
	.button_grad .content
	{display: flex;
		justify-content: space-between;
		max-width: 900px;
	}
	
		.button_grad .content .button_fx_item
	{
		flex-basis:calc((100% - 3.0rem) / 2);
	}
	
	
	.button_grad{
		margin: auto;
		margin-top: 4rem;
		margin-bottom: 4rem;}
	
	.button_grad .pc_img{
		margin: auto;
		margin-bottom: 3rem;
		text-align: center;
		max-width: 500px;
	}	
	
		.button_grad .pc_img img{
			width: 90%;
	}	
	
	.button_showroom{
padding: 5% 10%;
height: 60px;
}
.button_planing{
	padding: 5% 10%;
	height: 60px;}
	
		.button_grad .content h3
	{font-size: 1.0rem;
	}
	
	.yokoyajirusi img{
		width: 40px;
		margin-left: 10%;}
}

/*//button_grad//////////////////////*/


/*//what_sanwa//////////////////////*/
	
.what_sanwa{}

.what_sanwa .sc_head{
    text-align: center;}

.what_sanwa .sc_head h2{
    letter-spacing: 0.1rem;
    font-size: 1.2rem;
    line-height: 1.4rem;}

.what_sanwa .img_line{
	height: 2vh;
  background-image: url("../img/line.png");
  background-repeat: repeat;
  background-size: contain;
  background-position: center center;}


.what_sanwa .img_line:last-child{margin-top: 2.5rem;}

@media screen and (min-width:750px) {
	.what_sanwa .img_line:last-child{margin-top: 5rem;}}

/*//what_sanwa//////////////////////*/




/*//footer//////////////////////*/
footer{
	text-align: center;
}

footer address{
	font-style: normal;
}
/*//footer//////////////////////*/




/*sp時非表示*/
	@media screen and (max-width:751px) 
	{.sp_hiden{
		display: none;}}

/*pc時非表示*/
@media screen and (min-width:750px) {
	.pc_hiden{
	display: none;
}}


/*margin-bottom*/

.mb--sm{margin-bottom: 0.5rem;}
.mb--smd{margin-bottom: 1.0rem;}
.mb--md{margin-bottom: 1.5rem;}
.mb--lg{margin-bottom: 2.5rem;}
.mb--xl{margin-bottom: 5.0rem;}


		@media screen and (min-width:750px) {
.mb--sm{margin-bottom: 1.0rem;}
.mb--smd{margin-bottom: 2.0rem;}
.mb--md{margin-bottom: 3.0rem;}
.mb--lg{margin-bottom: 5.0rem;}
.mb--xl{margin-bottom: 10rem;}}

@media screen and (min-width: 900px){
.faq_grad_logo img {
	margin: auto;
    margin-bottom: 10px;
    max-width: 200px;
}}