@charset "shift_jis";
/* CSS Document 文字コード Shift-jis */


/* body .secTop,body .sec01{  } */


.section-mv { margin: 0 0 30px 0; }

.underline { text-decoration: underline; }
.cb { font-size: 1px; line-height:1px; }

.mv-img-right{ margin-left: 40px; }

.txt-left{ text-align:left; }
.txt-right{ text-align:right; }
.txt-center{ text-align:center; }

table.tbl-lighttype{
	border:0 solid #fff;
	margin-top:10px;
	margin-bottom: 20px;
}
table.tbl-lighttype td { vertical-align:middle; }
table.tbl-lighttype td.fw700 {padding-left: 0.67rem;}

.float2,
.float3 { width:100%; }
.float2 .elm{ float:left; width:49%; }
.float2 .elm:last-child{ float:right; }

.float3 .h4_listtitle{ float:left; }

.pt20 { padding-top:20px; }
.mt_xlarge { margin-top:100px; }

h2.h2_brown{
	display:block;
	font-size:26px;

}
h3.h3_brown{
	background-image: url(/lineup/tile/s/exwalltile/products/pic/lighting/icon_h2_brown.gif);
	margin:20px 0 30px 0;
	padding-left: 26px;
	font-size: 20px;
	line-height: 26px;
	background-position: 0 1px;
	background-repeat: no-repeat;
}

.lighting-column1 {
	background-color: rgba(215,210,203,1);
	padding: 32px 54px;
}
.lighting-column1 img {
	margin-right:20px;
	width: 180px;
}

.lighting-column2 {
	background-color: #fff;
	margin-left:auto;
	margin-right:auto;
	max-width:840px;
}

.lighting-column-borderbox {
	padding: 24px 40px 32px;
	margin-bottom: 24px;
	border: 1px solid #cccccc;
}

span.badge-gray{
	display: inline-block;
	background-color:#666464;
	font-size:14pt;
	line-height:20pt;
	color:#ffffff;
	padding-left:5px;
	padding-right: 5px;
}

.separator{
	border:1px solid #cccccc;
	border-width:1px 0 0 0;
	margin:32px 0 8px 0;
}
.grids { width:840px; margin:0 auto; }
.grid-l{ float:left; margin-right: 24px; }
.grid-c{ float:left; margin-right: 24px; }
.grid-r{ float:right; margin-right: 0; }

.withcaption{ position:relative; }
.caption-gy,.caption-wh{ position:absolute; top:10px; left:10px; font-weight:700; }
.caption-gy{ color:#333333; }
.caption-wh{ color:#ffffff; }

.grids2_1{ width:408px; }
.grids3_1{ width:264px; }
.grids3_2{ width:552px; }
.grids4_1{ width:192px; }
.grids_lightingtype{ position:relative; width:170px; height:120px; }

.grids5{ display:inline-block; width:100%; }
.grids5-square{ float:left; width:194px; margin:0 20px 20px 0; }
.grids5-d{ float:right; width:84px; margin:0; text-align:center; }

.grids4{ width:100%; }
.grids4-square{ float:left; width:231px; height:auto; margin:0 20px 20px 0; }
.grids4-wide{ float:left; width:336px; height:auto; margin:0 20px 20px 0; }
.grids4-d{ float:right; width:84px; height:auto; margin:0; text-align:center; }





.lighttypecaption{ position:absolute; top:40%; }

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

.lighting-column1 .img-right,
.img-right {
	float:right;
	margin-right: 0;
	margin-left: 20px;
}

.h4_listtitle{
	font-size:20px;
	font-weight: 700;
}
.h4_listtitle .list_number{
	font-size:28px;
	padding-right:0.3em;
	font-weight:700;
}
.listtitle_wrap {
	width:840px;
	margin:0 auto 18px auto;
}
.lighting_wallbar {
	font-size: 12px;
	font-weight: bold;
	color: #43688c;
	margin-top:0.5rem;
}
.lighting_spot {
	font-size: 12px;
	font-weight: bold;
	color: #EF7B00;
	margin-top:0.5rem;
}
.grids_inner-lighting {
	float: right;
	width: 84px;
	text-align: center;
}
.model-number { margin-top: 12px; }
.model-number-responsive{ width:840px; margin:-1rem auto 0 auto; }


.grids_border {
	position: relative;
	height: 420px;
}
.grids_border .grids_inner-lighting {
	float: none;
}
.txt-bottom {
	position: absolute;
	bottom: 0;
}
.half_title_wrap {
	margin-bottom: 12px;
}
.second_stage {
	margin-top: 40px;
}

a.largearrow{
	background: url(/common/pic/icon_link_l.gif) 0 0 no-repeat;
	padding-left:24px;
}


ul.icon-link.large li a {
	font-size: 95%;
}

.lxl-reform-linkSetCol3 li {
	width: 308px;
	margin-right: 12px;
}

.lxl-reform-linkSetCol3 li.lastchild {
	margin-right: 0px;
}

.lxl-reform-linkSet .lxl-itm-linkSet-cb-copy p {
	text-align: center;
	font-size: 100%;
}

.lxl-reform-linkSet .lxl-itm-linkSet-cb-img {
	margin-top: 10px;
	background: #000;
}

.lxl-reform-linkSet .lxl-itm-linkSet-cb-img a:hover img{
	opacity: 0.6;
	filter:alpha(opacity=60);
	-ms-filter:"alpha(opacity=60)";
	zoom:1;
}


/*** import common css rules ***/
/*** nav ***/
.section {
	margin-bottom: 60px;
	padding: 52px;
	background-color: #FFFFFF;
	border: 1px solid #e6e6e6;
}

.section.page-link { padding: 32px 52px 14px 52px; }
.section.page-link.w-col3 ul li { width:239px; }
.section.page-link ul { margin:0; }

.section.page-link ul li {
	float: left;
	display: inline-block;
	width: 169px;
	margin-right: 18px;
	margin-bottom: 8px;
	padding-left: 20px;
	background: url(/common/pic/icon_page_link.gif) no-repeat 0 5px;
	vertical-align: top;
}
.section.page-link ul li a {
	text-decoration: none;
	color: #4b4949;
}

/*** floating menu ***/
.subnav-recommend{
	display: flex;
	position: absolute;
	justify-content: space-between;	
	transition: all 700ms 0s ease;	
}

.subnav-recommend.fixed{
	position: fixed;
	top: 0;
}

.subnav-relative{ position: relative; top:auto; left:auto; z-index:1; margin-top:0;  }
.subnav-fixed{ position: fixed; top:0; z-index:9; margin-top:0; width:842px; height:auto; }
.subnav-over{ position: fixed; top:0; z-index:9; margin-top:0; width:842px; height:0; }


/*******************************************************************************
*  MV クロスフェード
********************************************************************************/


#mv-crossfade{
/* 948 x 534 */
	position:relative;
	width:100%;
	background-size: cover;
	background-image: url(/lineup/tile/s/exwalltile/products/pic/lighting/mv_lighting_01.jpg);
}

.mv-crossfade-panel{
	height:100%;
	width:100%;
	background-size: cover;
	position: absolute;
	top:0;
	left:0;
	display:none; 
}

#mv-crossfade-panel-01{ background-image: url(/lineup/tile/s/exwalltile/products/pic/lighting/mv_lighting_01.jpg); }
#mv-crossfade-panel-02{ background-image: url(/lineup/tile/s/exwalltile/products/pic/lighting/mv_lighting_02.jpg); }
#mv-crossfade-panel-03{ background-image: url(/lineup/tile/s/exwalltile/products/pic/lighting/mv_lighting_03.jpg); }

#mv-crossfade:before {
	content:"";
	display: block;
	padding-top: 56.3%; /* 高さを幅に対して固定 */
}

.hdn{ display:none; width:1px; height:1px; }

h5 { background-image: none; }


/********************************************/


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

	.subnav-fixed{ width:90vw; }


	.mainvisual{
		padding-top:100px;
	}
	.mainvisual .kv{
		margin: 20px 20px 0 20px;
		padding: 0 0 0 0;
	}
	.mainvisual .mv-bodycopy{
		margin: 20px 20px 20px 20px;
		padding: 0 0 1rem 0;
	}

	.mv-img-right{
		margin-left: 0;
		margin-top:20px;
	}

	.lighting-column1,
	.lighting-column2,
	.lighting-column-borderbox {
		padding: 1rem 10px;
	}
	.lighting-column1 p{
		margin-top: 0;
	}

	.lighting-column1 img{
		width:33%;
		height:33%;
	}
	.lighting-column1 td img{
		width:90%;
		height:90%;
	}

	.list_number{ margin-right:0; }

	.grids{ width:100%; margin:0; }
	.grids2_1{ width:48%; }
	.grids3_1{ width:31%; }
	.grids3_2{ width:64%; }
	.grids4_1{ width:22.5%; }
	
	.grids_lightingtype{ width:22%; height:auto; font-size:90%; margin-right:1% !important; }
	.grids_lightingtype:first-child{ margin-right:5% !important; }
	.grids_lightingtype:nth-child(2n){ display: none; }
	.grids_lightingtype:nth-child(2n+1){ width:40%; margin-left:20px; }
	.grids_lightingtype img{ width:100%; height:auto; margin-right:0; }
	
	.grids5{ display:inline-block; width:100%; }
	.grids5-square{ float:left; width:calc(20% - 21px); margin:0 20px 20px 0; }
	.grids5-d{ float:right; width:84px; margin:0; text-align:center; }
	
	.grids4{ width:100%; }
	.grids4-square{ float:left; width:calc(24% - 21px); height:auto; margin:0 15px 20px 0; }
	.grids4-wide{ float:left; width:calc(33% - 21px); height:auto; margin:0 15px 20px 0; }
	.grids4-d{ float:right; width:75px; margin:0; text-align:center; }

	.grids5{ display:inline-block; width:100%; }
	.grids5-square{ float:left; width:calc(19% - 15px); margin:0 15px 20px 0; }
	.grids5-d{ float:right; width:75px; margin:0; text-align:center; }
	.lighting_wallbar,.lighting_spot { font-size:75%; margin-bottom:1em; }
	
	

	.grid1_1_sm{ width: 100%; }
	.grid1_1_sm .grids4_1{ width:48%; }

	.grid-l,.grid-c{ margin-right:3.5%; }
	
	.second_stage,
	.second_stage_sm{ margin-top: 24px; }
	.model-number{margin-top: 0.25rem; }
	.model-number-responsive{ width:100%; margin:0 auto 18px; }

	.grids_border{height: auto;}
	.grids_border .txt-bottom{position: static;}

	.separator { margin: 0; }
	.mt_xlarge { margin-top: 50px; }

	.h4_listtitle { font-size: 1rem; }
	.h4_listtitle .list_number { font-size: 1.35rem;}
	.lighting-column-borderbox { margin: 0;}
	.listtitle_wrap { width: 100%; }
	.half_title_wrap ,
	.listtitle_wrap { margin-bottom: 0.5rem; }
	.grids_inner-lighting {
		width: 72px;
	}
	.grids_inner-lighting .lighting_wallbar,
	.grids_inner-lighting .lighting_spot {
		font-size: 0.6rem;
	}

	.lxl-contents-inner .img-responsive-half_sm {
		display: block;
		width: 80%;
		margin: 0.5rem auto 0;
	}

	.caption-gy,.caption-wh{ position:absolute; top:0.67rem; left:0.33rem; }

	.btn-basic li.btn-small a{
	   padding: 9px 24px 11px 24px;
	}
	.btn-basic li a{
		text-align: left;
	}
	.lxl-itm-linkSet-cb-imgSet {
	margin-top: 10px;
	}
	.lxl-reform-linkSet .lxl-itm-linkSet-cb-img {
	margin-top: 0px;
	}
	.lxl-reform-linkSet .lxl-itm-linkSet-cb-p p:first-child {
	   font-size: 100%;
	}

}