@charset "UTF-8";

.gnav li a.select{
    background: #eee;
    color: #000;
}
#slow_white , #french_beige , #cannele_brown {
	margin: -125px 0 0;
	padding:125px 0 0;
}
.pc_on {
	display: block;
}
.sp_on {
	display: none;
}

.sec2_step .note-area {
	margin-top: 25px;
	text-align: justify;
}
.br_767 {
	display: none;
}
.note {
	font-size: 10px;
    line-height: 1.5;
}


.mb40 {
	margin-bottom: 40px;
}
.select_lead_bg {
    padding: 60px 0;
}
.cap.cap_end {
	font-size: 10px!important;
}

/* common */

.con_bg{
	position: relative;
	width: 100%;
	margin: 0 auto;
	/* padding: 60px 0 0; */
}



/* img {
    position: relative;
    z-index: 1;
} */
.w1200{
	max-width: 1240px;
	margin: 0 auto;
	padding-left: 0 20px;
}
.w1000{
	max-width: 1020px;
	margin: 0px auto;
	padding: 0 10px;
	margin-top: 0px;
}


.sub_head_cap{
	position: absolute;
	right: 10px;
	bottom: 10px;
	display: block;
	font-size: 12px;
	color: #fff;
}

.ttl_en01{
	height: 24px;
	width: auto;
	margin: 0 auto 20px;
	text-align: center;
}
.ttl_en01 img{
	width:auto;
	height:100%;
}
.ttl_en02{
	height: 48px;
	width: auto;
	margin: 0px auto 40px;
	text-align: center;
}
.ttl_en02 img{
	width:auto;
	height:100%;
}
.ttl_ja{
	font-size: 24px;
	color: #fff;
	font-weight: 500;
	text-align: center;
	letter-spacing: 0.15em;
}
.text_area{
	padding: 0 10px;
	text-align: center;
	margin-bottom: 90px;
}
.text_area .subttl_top{
	font-size: 20px;
	line-height: 1.4;
	font-weight: 600;
	letter-spacing: 0.085em;
	margin-bottom:20px;
}
.text_area .subttl{
	font-size: 30px;
	line-height: 1.4;
	font-weight: 600;
	letter-spacing: 0.2em;
	margin-bottom: 40px;
}
.text_area .subttl_un{
	font-size: 18px;
	line-height: 2;
	font-weight: 500;
	letter-spacing: 0.05em;
}

.db900 {
	display: none;
}


/*  */

.flow {
	z-index: 3;
	background: #f1f3eb;
	padding: 90px 0 20px;
}
#select{
    font-size: 12px;
}
#select .select_tit {
	font-size: 13px;
	color: #988394;
	position: relative;
	padding-bottom: 20px;
	margin-bottom: 15px;
	text-align: center;
}

#select .select_tit::after {
	content: "";
	background: #988394;
	width: 50px;
	height: 3px;
	position: absolute;
	left: 0;
	bottom: 0;
}


#select .select_tit.txt_center::after {
	left: calc(50% - 25px);
}

.com_ttl {
	font-size: 24px;
	line-height: 1.6;
}

#select .com_ttl {
	margin-bottom: 50px;
	text-align: center;
}

#select .com_ttl {
	margin-bottom: 50px;
}

.com_ttl {
	font-size: 28px;
	line-height: 1.6;
}

.com_lead {
	font-size: 14px;
	line-height: 1.8;
	text-align: center;
}

#select .sec2_step ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 20px;
}

#select .sec2_step ul li {
	width: 33%;
	box-sizing: border-box;
	border-right: 1px solid #858586;
	padding: 0 10px;
}

#select .sec2_step ul li figure {
	max-width: 210px;
	margin: 0 auto 15px;
}

#select .sec2_step ul li p:nth-of-type(1) {
	text-align: center;
	margin-bottom: 20px;
	color: #4c4a4a;
	font-size: 16px;
}

#select .sec2_step ul li figure {
	max-width: 210px;
	margin: 0 auto 15px;
}
.step_main_img{
    margin-bottom: 10px;
}
figure {
	position: relative;
}

#select .sec2_step ul li p:nth-of-type(2) {
	text-decoration: underline;
	color: #4c4a4a;
	max-width: 210px;
	margin: 0 auto 15px;
	line-height: 1.5;
	height: 3em;
	display: flex;
    align-items: center;
}

#select .sec2_step ul li p:nth-of-type(3) {
	color: #666666;
	max-width: 210px;
	margin: 0 auto 15px;
	line-height: 1.5;
}

._sp {
	display: none;
}

#select .sec2_step ul li p.note {
	max-width: 210px;
	margin: 0 auto;
}

#select .sec2_step {
	margin-top: 40px;
	margin-bottom: 40px;
}

.section-block {
	width: 100%;
	margin: 5rem auto 0;
}

.subcopy {
	font-size: 28px;
	color: #424242;
	text-align: center;
	line-height: 1.44;
	font-weight: 500;
	margin: 0 auto 1rem;
}

.section-block .subcopy {
	text-align: left;
	border-bottom: thin solid #ccc;
}

.section-block .subcopy .num {
	color: #988394;
}

.aw {
	display: inline-block;
}

.section-block .subcopy .label.free {
	color: #888;
	border-color: #888;
}

#Select02 .block {
	width: 100%;
	padding-top: 1rem;
	position: relative;
}

#Select02 .block.color1 .color-select-head {}

#Select02 .block .color-select-head {
	width: 100%;
	text-align: left;
}

#Select02 .block.color1 .color-select-head .text {}

#Select02 .block .color-select-head .text {
	font-size: 1.25em;
	line-height: 2;
	text-align: left;
	display: inline-block;
	padding: 0 1rem;
	/* margin: 0 auto 0 1.5rem; */
	/* background-color: #fff; */
}

#Select02 .block .contents-box {
	margin-bottom: 0;
}

.contents-box {
	position: relative;
}

.contents-box {
	width: 100%;
	margin: 0 auto 5rem;
}

#Select02 .block .contents-box .contents-box-inner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
	margin-top: 2rem;
}

.contents-box .contents-box-inner {
	width: 94.696969697%;
	max-width: 1000px;
	margin: auto;
}

#Select02 .block .contents-box .contents-box-inner div,
#Select02 .block .contents-box .contents-box-inner li {
	min-height: 0%;
}

#Select02 .block .door {
	width: 15.85%;
	max-width: 150px;
}

#Select02 .block .contents-box .contents-box-inner div,
#Select02 .block .contents-box .contents-box-inner li {
	min-height: 0%;
}

#Select02 .block .door .parts {
	width: 100%;
}

#Select02 .block .contents-box .contents-box-inner div,
#Select02 .block .contents-box .contents-box-inner li {
	min-height: 0%;
}

.img-box {
	position: relative;
}

.img-box img {
	width: 100%;
	height: auto;
}

img {
	vertical-align: bottom;
}

#Select02 .block .parts .img-box .select_cap.out {
	font-size: 0.75em;
	text-align: left;
	line-height: 1.2;
}

.select_cap.out {
	display: block;
	text-align: right;
	margin-top: 0.25rem;
	color: #333;
}

.select_cap {
	font-size: 0.625em;
    font-family: "Helvetica Neue", "Helvetica", "Yu Gothic", 'Noto Sans JP', "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Meiryo", sans-serif;
	font-weight: normal;
}

.select_cap {
	font-size: .625rem;
	line-height: 1;
}

#Select02 .block .contents-box .contents-box-inner div,
#Select02 .block .contents-box .contents-box-inner li {
	min-height: 0%;
}

#Select02 .block .others {
	width: 82.2%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
}

#Select02 .block .others .parts {
	width: 31.3868613139%;
	margin-bottom: 4%;
	max-width: 244px;
}

#Select02 .block .others div,
#Select02 .block .others li {
	min-height: 0%;
}

#Select02 .block .contents-box .contents-box-inner div,
#Select02 .block .contents-box .contents-box-inner li {
	min-height: 0%;
}

#Select02 .block .contents-box .contents-box-inner div,
#Select02 .block .contents-box .contents-box-inner li {
	min-height: 0%;
}

#Select02 .block .others div,
#Select02 .block .others li {
	min-height: 0%;
}

.img-box {
	position: relative;
}

.img-box img {
	width: 100%;
	height: auto;
}

#Select02 .block .others .parts .img-box .select_cap.out {
	font-size: 0.75em;
	line-height: 1.12;
	text-align: left;
}

Select02 .block .parts .img-box .select_cap.out {
	font-size: 0.75em;
	text-align: left;
	line-height: 1.2;
}

.select_cap.out {
	display: block;
	text-align: right;
	margin-top: 0.25rem;
	color: #333;
}

.select_cap {
	font-size: 0.625em;
	font-family: "Helvetica Neue", "Helvetica", "Yu Gothic", 'Noto Sans JP', "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Meiryo", sans-serif;
	font-weight: normal;
}

.select_cap {
	font-size: .625rem;
	line-height: 1;
}

.color_ug {
	color: #fff;
}

.bg_ug {
	background-color: #d0c6b5;
}

.color_eb {
	color: #fff;
}

.bg_eb {
	background: #ab8f73;
}


.color_hg {
	color: #fff;
}

.bg_hg {
	background: #7e6755;
}

.note_area_border {
	margin: 0 0 10px 0;
	display: flex;
}

.note_area_border .note {
	padding: 5px;
	border: 1px solid #4c4948;
	display: initial;
}

.note_door {
	font-size: 5px;
}

.read {
	font-size: 16px;
	color: #323232;
	line-height: 1.68;
	text-align: left;
	font-feature-settings: 'palt';
	margin: 0 auto;
}

.section-block .subcopy+.read {
	text-align: left;
}

.section-block .subcopy .label.free {
	color: #888;
	border-color: #888;
}

.section-block .subcopy .label {
	display: inline-block;
	font-size: 0.666666666666667em;
	line-height: 1.2;
	text-align: center;
	padding: 0.25rem 0 0.25rem 0.5rem;
	border-width: thin;
	border-style: solid;
	vertical-align: middle;
	margin-left: 1rem;
	margin-bottom: 0.5rem;
	letter-spacing: 0.5em;
}

#Select03 .img-box {
	width: 100%;
	max-width: 723px;
	margin: 3rem auto 2rem;
}

.img-box {
	position: relative;
}

.br_1000 {
	display: none;
}

.br_550 {
	display: none;
}

.img-box img {
	max-height: 380px;
}

.kitchen_flex {
	display: flex;
	justify-content: space-between;
	margin: 0 0 20px 0;
}

.kitchen_flex_contents {
	width: 48%;
}

.kitchen_img01 {
	max-width: 723px;
	margin: 25px auto 10px;
}

.kitchen_img02 {
	position: relative;
}

.select_cap01 {
	font-size: 10px;
	letter-spacing: 0;
	color: #fff;
	text-shadow: 1px 1px 3px rgb(0 0 0 / 50%), -1px 1px 3px rgb(0 0 0 / 50%), 1px -1px 3px rgb(0 0 0 / 50%), -1px -1px 3px rgb(0 0 0 / 50%);
	position: absolute;
	bottom: 5px;
	right: 5px;
}

.stove_img {
	margin: 40px 0;
	display: block;
}

.stove_img_sp {
	display: none;
}

.text_area.secttl_text {
	margin-top: 45px;
}


.select_link_cap{
    font-size: 10px;
    color: #fff;
    background: #2c3056;
    padding: 0.2em 2em;
    border-radius: 100px;
    position: absolute;
    top: -1em;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
}
.select_link_box{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 30px auto 0px;
}
.select_link_box li{
	width: calc((380/1200)*100%);
}
.select_link_h{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	justify-content: center;
	height: 50px;
	font-size: 24px;
	text-align: center;
	margin: 0 auto 3%;
	line-height: 1;
}
.select_link_h > div{
	letter-spacing: 0.05em;
	color: #fff;
}
.select_link_h > div > p{
	font-size: 15px;
	font-weight: 500;
	margin: 0 0 5px;
}
.select_link_h span{
	font-size: 12px;
	width: 100%;
	display: block;
	line-height: 1;
}
.select_link_img{
	position: relative;
	max-width: 316px;
	cursor: pointer;
}
.select_link_img::before{
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	transition-duration: 0.6s;
	z-index: 10;
	cursor: pointer;
}
.select_link01 .select_link_h{
	background: #d0c6b5;
}
.select_link02 .select_link_h{
	background: #ab8f73;
}
.select_link03 .select_link_h{
	background: #7e6755;
}

.select_link.select_link01 .select_link_img::before{
	/* animation: 1.2s select_link01 linear ; */
    animation-name: select_link01;
    animation-timing-function: cubic-bezier(0, 0.66, 0.58, 1.81);
    animation-duration: 6s;
    animation-iteration-count: infinite;
}
.select_link.select_link02 .select_link_img::before{
	/* animation: 1.2s select_link01 linear ; */
    animation-name: select_link02;
    animation-timing-function: cubic-bezier(0, 0.66, 0.58, 1.81);
    animation-duration: 6s;
    animation-iteration-count: infinite;
}
.select_link.select_link03 .select_link_img::before{
	/* animation: 1.2s select_link01 linear ; */
    animation-name: select_link03;
    animation-timing-function: cubic-bezier(0, 0.66, 0.58, 1.81);
    animation-duration: 6s;
    animation-iteration-count: infinite;
}

.select_link01 .select_link_img::before{
	background: url(../img/select/serenitywhite02.png) no-repeat;
	background-size: contain;
}

.select_link01 .select_link_img:hover::before{
	background: url(../img/select/ugoki_bg01.jpg) no-repeat;
	background-size: contain;
	animation: none;
	cursor: pointer;
}

.select_link02 .select_link_img::before{
	background: url(../img/select/fresco03.png) no-repeat;
	background-size: contain;
	animation-delay: 0.4s;
}

.select_link02 .select_link_img:hover::before{
	background: url(../img/select/ugoki_bg02.jpg) no-repeat;
	background-size: contain;
	animation: none;
	cursor: pointer;
}

.select_link03 .select_link_img::before{
	background: url(../img/select/cozy03.png) no-repeat;
	background-size: contain;
	animation-delay: 0.8s;
}

.select_link03 .select_link_img:hover::before{
	background: url(../img/select/ugoki_bg03.jpg) no-repeat;
	background-size: contain;
	animation: none;
	cursor: pointer;
}

@media (hover: none) {
    .select_link01 .select_link_img:active::before{
		background: url(../img/select/ugoki_bg01.jpg) no-repeat;
		background-size: contain;
		animation: none;
		cursor: pointer;
	}
	.select_link02 .select_link_img:active::before{
		background: url(../img/select/ugoki_bg02.jpg) no-repeat;
		background-size: contain;
		animation: none;
		cursor: pointer;
	}
	.select_link03 .select_link_img:active::before{
		background: url(../img/select/ugoki_bg03.jpg) no-repeat;
		background-size: contain;
		animation: none;
		cursor: pointer;
	}
}



@keyframes select_link01{
	0% {
		background: url(../img/select/serenitywhite01.jpg) no-repeat;
		background-size: contain;
	}
	20% {
		background: url(../img/select/serenitywhite02.png) no-repeat;
		background-size: contain;
	}
	60% {
		background: url(../img/select/serenitywhite03.png) no-repeat;
		background-size: contain;
	}
	100% {
		background: url(../img/select/serenitywhite01.jpg) no-repeat;
		background-size: contain;
	}

}
@keyframes select_link02{
	0% {
		background: url(../img/select/fresco01.jpg) no-repeat;
		background-size: contain;
	}
	20% {
		background: url(../img/select/fresco02.png) no-repeat;
		background-size: contain;
	}
	60% {
		background: url(../img/select/fresco03.png) no-repeat;
		background-size: contain;
	}
	100% {
		background: url(../img/select/fresco01.jpg) no-repeat;
		background-size: contain;
	}

}
@keyframes select_link03{
	0% {
		background: url(../img/select/cozy01.jpg) no-repeat;
		background-size: contain;
	}
	20% {
		background: url(../img/select/cozy02.png) no-repeat;
		background-size: contain;
	}
	60% {
		background: url(../img/select/cozy03.png) no-repeat;
		background-size: contain;
	}
	100% {
		background: url(../img/select/cozy01.jpg) no-repeat;
		background-size: contain;
	}

}


.tab{
	cursor: pointer;
}
/* .tab:hover{
	background: #d2743e;
} */
.tab:hover .t_num_on{
	display: block;
}
.tab:hover .t_num_off{
	display: none;
}
.tab.is-active{
	/* background: #d2743e; */
	color: #fff;
}
.t_num img{
	height: 40px;
}
.t_num_on{
	display: none;
}
.is-active .t_num_on{
	display: block;
}
.is-active .t_num_off{
	display: none;
}

.cre_t_img{
	background: #fafafa;
    padding: 40px 0;
}
.cre_t_img div{
	max-width: 1000px;
    margin: 0 auto;
}

.panel{
	/* display:none; */
	height: 0px; 
  	overflow-y: hidden;
}
.panel.is-show{
	height: auto;
	overflow-y: visible;
}

.t_slide_bg{
	background: #fff;
	padding: 40px 0;
}
.t_slide{
	width: 90%;
	max-width: 1150px;
	margin: 0 auto;
}























/*====================================================================
モーダルウィンドウ
====================================================================*/

.modal_inner {
	max-width: 1040px;
	position: relative;
	width: 100vw;
	padding: 0 20px;
}
body.isShow {
	overflow: hidden;
}
/* swiper */
.swiper-container02 {
	max-width: 1000px;
	overflow-y: hidden;
	-ms-overflow-style: none;    /* IE, Edge 対応 */
	scrollbar-width: none;
	padding: 0;
	margin: 0 auto;
	}
.swiper-container02::-webkit-scrollbar{
	display: none;
}

.swiper-button-next02 {
 position: absolute;
 bottom: 45.5%;
 left: 48%;
 z-index: 10;
 cursor: pointer;
 display: flex;
 align-items: center;
 justify-content: center;
 width: 40px !important; /* ボタンの幅 */
 height: 100px !important; /* ボタンの高さ */
 background-size: auto 100%;
 margin-top: 0 !important;
 background-position: right center;
 background-repeat: no-repeat;
}

.swiper-button-prev02 {
	position: absolute;
	top: 45.5%;
	left: 48%;
	z-index: 10;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px !important; /* ボタンの幅 */
	height: 100px !important; /* ボタンの高さ */
	background-size: auto 100%;
	margin-top: 0 !important;
	background-position: right center;
	background-repeat: no-repeat;
}
/* 次ページボタンのスタイル */
.swiper-button-next02 {
 background-image: url(../img/concept/arrow_white.svg);
 /* transform: translateY(-50%); */
 /* right: 20px; */
 transform: rotate(90deg);
}
/* 前ページボタンのスタイル */
.swiper-button-prev02 {
 background-image: url(../img/concept/arrow_white.svg);
 /* transform: scale(-1, 1) translateY(-50%); */ /* 左右反転 */
 /* left: 20px; */
 transform: rotate(-90deg);
}
.swiper-button-prev02:after,
.swiper-button-next:after {
 font-family: swiper-icons;
 font-size: var(--swiper-navigation-size);
 text-transform: none !important;
 letter-spacing: 0;
 text-transform: none;
 font-variant: initial;
}
.swiper-button-prev02:after,
.swiper-container-rtl .swiper-button-next02:after {
 content: "" !important;
}

.swiper-button-next02:after,
.swiper-container-rtl .swiper-button-prev02:after {
	content: "" !important;
}
/* ---------------------------- */
/* --- ModalSection --- */
/* ---------------------------- */
.ModalLayer {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	transition: opacity 0.65s;
	pointer-events: none;
	opacity: 0;
	z-index: 10000;
	  display: flex;
	  align-items: center;
	  justify-content: center;
  }
  .ModalLayer02 {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	transition: opacity 0.65s;
	pointer-events: none;
	opacity: 0;
	z-index: 10000;
	  display: flex;
	  align-items: center;
	  justify-content: center;
  }
  .ModalLayer03 {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	transition: opacity 0.65s;
	pointer-events: none;
	opacity: 0;
	z-index: 10000;
	  display: flex;
	  align-items: center;
	  justify-content: center;
  }

  .ModalLayer.isShow {
	transition: opacity 0.65s;
	pointer-events: auto;
	opacity: 1;
  }
  .ModalLayer02.isShow {
	transition: opacity 0.65s;
	pointer-events: auto;
	opacity: 1;
  }
  .ModalLayer03.isShow {
	transition: opacity 0.65s;
	pointer-events: auto;
	opacity: 1;
  }

  .ModalLayer-Mask {
	position: absolute;
	background: rgba(0,0,0,0.5);
	width: 100%;
	height: 100vh;
	top:50%;
	left: 50%;
	transform: translate(-50%,-50%);
  }
  .ModalLayer-Inner {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	max-width: 600px;
	transform: translate(-50%, -50%);
  }
  .Modal-Inner-Btn {
	position: absolute;
	top: -35px;
	right: -35px;
	width: 70px;
	color: #fff;
	z-index: 10;
	cursor: pointer;
  }
  .Modal-Inner-Card {
	width: 100%;
  }
  .Modal-Inner-Card-Wrapper {
	display: flex;
  }
  .Modal-Inner-Card-Wrapper-Slide {
	width: 100% !important;
	height: auto;
  }
  .Modal-Inner-Card-Wrapper-Slide-Item {
	padding-top: 50px;
	padding-bottom: 50px;
	width: 100%;
	height: 100%;
	background: #059bcc;
  }
  .Modal-Inner-Card-Wrapper-Slide-Item-Box {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 78.37%;
  }
  .Modal-Inner-Card-Wrapper-Slide-Item-Box-Text {
	color: #fff;
  }
  .br_1250{
	  display: none;
  }
  
  @media screen and (max-width: 1250px) {
	  .br_1250{
		  display: block;
	  }
  }
  @media screen and (max-width: 768px) {
	  .modal_inner {
		  width: calc(100vw - 40px);
		  max-width: initial;
	  }
	  .swiper-button-prev02,
	  .swiper-button-next02 {
		  height: 70px !important;
		  background-image: url(../img/design/arrow_black.svg);
	  }
	  .swiper-button-prev02 {
		  left: 15px !important;
	  }
	  .swiper-button-next02 {
		  right: 15px !important;
	  }
  
  }
  
  @media screen and (max-width: 600px) {
	  .modal_inner {
		  width: 100%;
		  max-width: initial;
		 }
	  .swiper-button-prev02,
	  .swiper-button-next02 {
		  height: 70px !important;
	  }
	  .swiper-button-prev02 {
		  left: 8px !important;
	  }
	  .swiper-button-next02 {
		  right: 8px !important;
	  }
  }
  
  @media all and (-ms-high-contrast: none) {
	  .box.swiper-slide{
		  display: block;
	  }
	  .sec_copy{
		  font-size: 32px;
	  }
  }


  /*  */
.swiper-slide {
	height: auto;
}
.box.swiper-slide {
	/* width: calc(100vw - 40px); */
	max-width: 1000px;
	/* background: #fff; */
	border-radius: 10px;
	/* 	min-height: 300px; */
	height: auto;
	display: flex;
	justify-content: center;
	padding: 40px 0 !important;
	box-sizing: border-box;
	/* 	box-shadow: 2px 2px 4px rgba(0,0,0,0.5); */
	/* margin: 5px; */
}
.box_inner {
	width: 100%;
	/* max-width: 720px; */
	margin: 0 auto;
	height: 100%;
	/* position:relative; */
}
.box_close._sp {
	display: none;
}
.box_close {
	width: 20px;
	height: 20px;
	position: absolute;
	top: 50%;
	right: -35px;
	transform: translate(0,-50%);
	cursor: pointer;
}
.box_close::after {
	content: "×";
	font-size: 35px;
	color: #fff;
	position: absolute;
	top: -1300%;
	right: 300%;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content:center;
	line-height: 1;
}
.box h5 {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 20px;
	margin-bottom: 20px;
	position: relative;
}
.box h5 .icon {
	width: 1.5em;
	display: inline-block;
}
.box h5 .obi {
	width: calc(100% - 2em);
	letter-spacing: 0.1em;
	padding-left: 1em;
	display: block;
	color: #fff;
	background: linear-gradient(to bottom, #378ca6 25%,#68a0b6 25%,#68a0b6 75%, #378ca6 75% );
}


@media screen and (max-width: 830px) {
	.box_close::after {
		top: -1020%;
	}
}
@media screen and (max-width: 767px) {
	#ck_slide {
		margin-bottom: 90px;
	}
	.ls_ttl {
		font-size: 18px;
	}
	.ls_txt {
		font-size: 15px;
	}
	.box.swiper-slide {
		/* padding: 30px 30px !important; */
		width: 100%;
	}
	.box_inner {
		width: 100%;
	}
	.box h5 {
		font-size: 15px;
	}
	.box_close {
		display: none;
	}
	.box_close::after {
		color: #fff;
	}
	.box_close::after {
		top: -255px;
	}
    .box_close._sp {
	    display: flex;
	    z-index: 10;
	    top: -30px;
	    left: auto;
	    right: 3vw;
	    transform: translate(0,0);

	}
    .box_close._sp::after {
	    color: #fff;
	    top: 160%;
	    right: 100%;
	   }
	.box h5 .obi {
		padding-left: 10px;
	}
    .flex .img {
    	width: 100%;
    	max-width: initial;
    	margin-bottom: 10px;
    }
    .flex .txt {
    	width: 100%;
    	max-width: initial;
    	font-size: 15px;
    }
		.flex .txt br {
			display: none;
		}
    .box._04 .ab_img {
    	min-width: 60px;
    }

}

@media screen and (max-width: 400px) {
	.box_close._sp::after{
		top: 30px;
	}


}


/*====================================================================
/////////////////////////////////////////////モーダルウィンドウ　end
====================================================================*/

/* モーダル追加 */
.modal_flex {
	display: flex;
	justify-content: space-between;
	background: #dbdfef;
}
.modal_flex_inner {
	width: 50%;
}
.modal_flex.b2 {
	background: #93c9de;
}
.modal_flex.b3 {
	background: #d7ebdc;
}
.modal_flex.b4 {
	background: #fcfae0;
}

@media screen and (max-width: 767px) {
	.box_inner_ttl {
		font-size: 15px;
	}
	.box_inner_lead {
		font-size: 12px;
	}
}
@media screen and (max-width: 650px) {
	.modal_flex {
		flex-wrap: wrap;
	}
	.modal_flex_inner {
		width: 100%;
	}
	.box_inner_ttl {
		margin: 30px 0 20px;
		padding: 0 20px;
	}
	.box_inner_lead {
		margin-top: 0px;
		padding: 0 20px 20px;
	}
	.box_one {
		height: 220px;
	}
	.s_09 .accordion_one .accordion_header .i_box {
		width: 45px;
		height: 45px;
	}
	.img_cap.boxarea {
		bottom: 50px;
	}

	.s_09 .accordion_area .accordion_one {
		width: 100%;
	}
	.s_09 .accordion_one .accordion_header {
		height: 100vw;
	}
	.s_09 .accordion_area .accordion_one > div {
		margin-bottom: 0;
	}
}


.modal_img {
	max-width: 1000px;
}




@media(max-width:1830px) {}

@media (max-width: 1600px) {}

@media(max-width:1200px) {

	.br_1200 {
		display: block;
	}
}

@media(max-width:1000px) {
    ul.gnavi li a.select {
        background: #eee;
        color: #000;
    }
	.br_1000 {
		display: block;
	}
    /* 20250826 */
    .sec2_step .txt_ls {
        letter-spacing: -0.05em;
    }
    .sec2_step .txt_ls span {
        letter-spacing: 0.05em;
    }
	#select .sec2_step ul li .kara_height {
		height: 1.5em!important;
	}

}

@media(max-width: 900px) {
	/* .mv {
		height: 450px;
	}
 */
	.flow {
		padding: 50px 0 20px;
	}

	.heading_text {
		font-size: 35px;
		font-weight: 500;
		margin-bottom: 45px;
	}

	.heading_sentence {
		line-height: 2.22;
		font-size: 15px;
		margin-bottom: 54px;
	}
	.db900 {
		display: block;
	}

	.ttl_en02 {
		height: 38px;
		width: auto;
		margin: 0px auto;
		text-align: center;
	}

	#slow_white , #french_beige , #cannele_brown {
		margin: -60px 0 0;
		padding:60px 0 0;
	}

}


@media(max-width:864px) {

	#Select02 .block .others .parts {
		margin-bottom: 4.5%;
	}

	.read {
		font-size: 14px;
	}

	.subcopy {
		font-size: 24px;
	}
}


@media(max-width: 767px) {
	.pc_on {
		display: none;
	}
	.sp_on {
		display: block;
	}
	
	.heading_text {
		line-height: 1.9;
		font-size: 30px;
		margin-bottom: 35px;
	}

	.heading_sentence {
		line-height: 2;
		font-size: 14px;
		margin-bottom: 44px;
	}

	#select .select_tit {
		text-align: center;
	}

	#select .select_tit::after {
		left: calc(50% - 25px);
	}

	.com_ttl {
		font-size: 5.33333332vw;
		font-size: clamp(10px, 5.33333332vw, 24px);
	}

	#select .com_ttl {
		font-size: 4.8vw;
		margin-bottom: 30px;
		text-align: center;
	}

	#select .com_ttl {
		font-size: 4.8vw;
		margin-bottom: 30px;
		text-align: center;
	}

	.com_ttl {
		font-size: 5.33333332vw;
		font-size: clamp(10px, 5.33333332vw, 24px);
	}

	.com_lead {
		font-size: 3.99999999vw;
		font-size: clamp(10px, 3.99999999vw, 14px);
	}

	#select .sec2_step ul li {
		width: 100%;
		border-right: none;
		/* background: url(../img/select/sec2_sparrow.svg) no-repeat left center;
		background-size: auto 90%; */
		padding: 5px 0;
	}

	#select .sec2_step ul li figure {
		width: 90%;
		max-width: 300px;
	}

	#select .sec2_step ul li p:nth-of-type(1) {
		font-size: 17px;
	}

	#select .sec2_step ul li figure {
		width: 90%;
		max-width: 300px;
	}

	#select .sec2_step ul li p:nth-of-type(2) {
		width: 90%;
		max-width: 300px;
		height: auto;
	}

	#select .sec2_step ul li p:nth-of-type(3) {
		width: 90%;
		max-width: 300px;
	}

	._sp {
		display: block;
	}

	#select .sec2_step ul li p.note {
		width: 90%;
		max-width: 300px;
	}

	._pc {
		display: none !important;
	}

	.section-block {
		margin-top: 2.5rem;
	}

	.subcopy {
		font-size: 17.5px;
		text-align: center;
	}

	.section-block .subcopy .label {
		margin-bottom: 0.25rem;
	}

	#Select02 .block .color-select-head .text {
		font-size: 1.125em;
		margin-left: 0.5rem;
		padding: 0.125rem 0.5rem;
	}

	#Select02 .block .contents-box .contents-box-inner {
		width: 100%;
		margin-top: 1rem;
	}

	.contents-box .contents-box-inner {
		margin-bottom: 0.5rem;
	}

	#Select02 .block .door {
		width: 36%;
	}

	#Select02 .block .parts .img-box .select_cap.out {
		font-size: 11px;
	}

	#Select02 .block .others {
		width: 62%;
	}

	#Select02 .block .others .parts {
		width: 48%;
	}

	#Select02 .block .parts .img-box .select_cap.out {
		font-size: 11px;
	}

	.section-block .subcopy .label {
		margin-bottom: 0.25rem;
	}

	#Select03 .img-box {
		margin: 1.5rem auto 20px;
	}

	.aw {
		display: initial;
	}


	.stove_img {
		display: none;
	}

	.stove_img_sp {
		display: block;
		margin: 20px 0;
	}

	.kitchen_flex {
		flex-direction: column;
	}
	.kitchen_flex_contents {
		width: 100%;
	}

	.kitchen_img01{
		margin: 25px 0 20px 0;
	}

	.text_area .subttl_top{
		font-size: 18px;
		line-height: 1.4;
		font-weight: 600;
		letter-spacing: 0.085em;
		margin-bottom:15px;
	}
	.text_area .subttl{
		font-size: 28px;
		line-height: 1.4;
		font-weight: 600;
		letter-spacing: 0.1em;
		margin-bottom: 30px;
	}
	.text_area .subttl_un{
		font-size: 16px;
		line-height: 2;
		font-weight: 400;
		letter-spacing: 0.05em;
	}

	.text_area {
		margin-bottom: 45px;
	}
	.text_area.secttl_text {
		margin-top: 25px;
		margin-bottom: 25px;
	}

	.ac_con01.con_bg {
		padding: 40px 0;
	}


	.ttl_en02 {
		height: 28px;
		width: auto;
		margin: 0px auto;
		text-align: center;
	}
	.br_767 {
		display: block;
	}
	/* 20250826 */
	.sec2_step .txt_ls {
		letter-spacing: 0.05em;
	}
	.kara_height{
		height: auto;
	}
	#select .sec2_step ul li .kara_height {
		height: auto!important;
	}
	
}

@media screen and (max-width: 750px) {
	.foot_nav .select a{
		background: #d8d8da;
	}
	.select_lead_bg {
		padding: 40px 0;
	}
}



@media (max-width:550px) {
	.br_550 {
		display: block;
	}
	.text_area{
		margin-bottom:60px;
	}
	.text_area{
		margin-bottom: 60px;
	}
	.text_area .subttl_top{
		font-size: 16px;
		line-height: 1.4;
		font-weight: 600;
		letter-spacing: 0.005em;
		margin-bottom: 15px;
	}
	.text_area .subttl{
		font-size: 21px;
		line-height: 1.4;
		font-weight: 600;
		letter-spacing: 0.1em;
		margin-bottom: 19px;
	}
	.text_area .subttl_un{
		font-size: 14px;
		line-height: 2;
		letter-spacing: 0.05em;
	}


	.select_link_box {
		justify-content: center;
		margin: 20px auto 0;
	}
	.select_link_box li {
		width: 55%;
		margin: 0 auto 20px;
	}
	/* .select_link_box li:nth-of-type(2){
		margin: 0 0 0 1.5%;
	} */
	.select_link_h > div > p {
		font-size: 13.5px;
	}
	.select_link_h span {
		font-size: 10px;
	}
	.select_link_h{
		height: 45px;
	}

}

@media (max-width:450px) {
	.heading_text {
		line-height: 1.85;
		font-size: 25px;
		margin-bottom: 25px;
	}

	.heading_sentence {
		line-height: 1.8;
		font-size: 13px;
		letter-spacing: 0.12em;
		margin-bottom: 34px;
	}

	.read {
		font-size: 1em;
		text-align: center;
	}
}

@media(max-width:400px) {
	#Select02 .block .color-select-head .text {
		font-size: 1em;
		padding: 10px 0;
		line-height: 1.8;
	}

	#Select02 .block .parts .img-box .select_cap.out {
		font-size: 10px;
	}

	#Select02 .block .parts .img-box .select_cap.out {
		font-size: 10px;
	}
}