@charset "utf-8";

/* base.css の #sections a 青リンクを上書き（テキストと同色） */
#sections .mod_section a:not(.btn_link),
#sections .mod_section a:not(.btn_link):link,
#sections .mod_section a:not(.btn_link):visited,
#sections .mod_section a:not(.btn_link):hover,
#sections .mod_section a:not(.btn_link):focus,
#sections .mod_section a:not(.btn_link):active,
#sections .mod_all_section a:not(.btn_link),
#sections .mod_all_section a:not(.btn_link):link,
#sections .mod_all_section a:not(.btn_link):visited,
#sections .mod_all_section a:not(.btn_link):hover,
#sections .mod_all_section a:not(.btn_link):focus,
#sections .mod_all_section a:not(.btn_link):active {
	color: inherit;
	text-decoration: none;
}

#sections .slider_indoor div.img a,
#sections .slider_outdoor div.img a {
	color: #000;
}

/* conversion（カタログダウンロード等） */
#sections .bottom_nav a,
#sections .bottom_nav a:link,
#sections .bottom_nav a:visited,
#sections .bottom_nav a:hover,
#sections .bottom_nav a:focus,
#sections .bottom_nav a:active {
	color: #333;
	text-decoration: none;
}

/* nav ボタン（link_wrapper）
   - index: <a class="btn_link">
   - feature等: <a><div class="btn_link">
*/
#sections .link_wrapper .btn_link_column a.btn_link,
#sections .ex_marginTM > a.btn_link,
#sections .link_wrapper .btn_link_column a:has(.btn_link),
#sections .ex_marginTM > a:has(.btn_link) {
	display: block;
	width: 100%;
	color: #fff;
	text-decoration: none;
}

/* btn_link のみ白（link_wrapper内の他リンクは対象外） */
#sections .link_wrapper .btn_link_column a.btn_link,
#sections .link_wrapper .btn_link_column a.btn_link:link,
#sections .link_wrapper .btn_link_column a.btn_link:visited,
#sections .link_wrapper .btn_link_column a.btn_link:hover,
#sections .link_wrapper .btn_link_column a.btn_link:focus,
#sections .link_wrapper .btn_link_column a.btn_link:active,
#sections .link_wrapper .btn_link_column a.btn_link p,
#sections .link_wrapper .btn_link_column a.btn_link:hover p,
#sections .link_wrapper .btn_link_column a .btn_link,
#sections .link_wrapper .btn_link_column a .btn_link p,
#sections .link_wrapper .btn_link_column a:hover .btn_link,
#sections .link_wrapper .btn_link_column a:hover .btn_link p,
#sections .link_wrapper .btn_link_column .btn_link,
#sections .link_wrapper .btn_link_column .btn_link p,
#sections .link_wrapper .btn_link_column .btn_link:hover,
#sections .link_wrapper .btn_link_column .btn_link:hover p,
#sections .ex_marginTM > a.btn_link,
#sections .ex_marginTM > a.btn_link:link,
#sections .ex_marginTM > a.btn_link:visited,
#sections .ex_marginTM > a.btn_link:hover,
#sections .ex_marginTM > a.btn_link:focus,
#sections .ex_marginTM > a.btn_link:active,
#sections .ex_marginTM > a.btn_link p,
#sections .ex_marginTM > a.btn_link:hover p,
#sections .ex_marginTM > a:has(.btn_link),
#sections .ex_marginTM > a:has(.btn_link):hover,
#sections .ex_marginTM > a .btn_link,
#sections .ex_marginTM > a .btn_link p,
#sections .ex_marginTM > a:hover .btn_link,
#sections .ex_marginTM > a:hover .btn_link p {
	color: #fff !important;
	text-decoration: none;
}

#sections .link_wrapper .btn_link_column a.btn_link:hover,
#sections .ex_marginTM > a.btn_link:hover {
	background: rgb(34,175,227);
	background: linear-gradient(90deg, rgba(34,175,227,1) 0%, rgba(108,196,214,1) 100%);
	opacity: 0.8;
}

/* 現在ページ（active）はホバーでも見た目を変えない */
#sections .link_wrapper .btn_link_column .btn_link_active:hover {
	background: rgb(34,175,227);
	background: linear-gradient(90deg, rgba(34,175,227,1) 0%, rgba(108,196,214,1) 100%);
	opacity: 1;
}

#sections .link_wrapper .btn_link p::before,
#sections .link_wrapper .btn_link p::after,
#sections .ex_marginTM .btn_link p::before,
#sections .ex_marginTM .btn_link p::after {
	content: none !important;
	display: none !important;
}

#sections .link_wrapper .btn_link::after,
#sections .ex_marginTM .btn_link::after {
	display: block !important;
	content: "" !important;
	font: 0/0 a !important;
	color: transparent !important;
	speak: never;
	text-indent: -9999px;
	overflow: hidden;
	background: url("/jp/lighting/home/customer/flatlamp/feature/img/icon_btn_link.png") no-repeat center !important;
	background-size: contain !important;
}


/* link_wrapper 外の btn_link もホバーで白維持 */
#sections a.btn_link,
#sections a.btn_link:link,
#sections a.btn_link:visited,
#sections a.btn_link:hover,
#sections a.btn_link:focus,
#sections a.btn_link:active,
#sections a.btn_link p,
#sections a.btn_link:hover p,
#sections a .btn_link,
#sections a .btn_link p,
#sections a:hover .btn_link,
#sections a:hover .btn_link p {
	color: #fff !important;
	text-decoration: none;
}


/* btn_link テキストは常に白（#container a:hover p の灰上書き対策） */
#page a.btn_link,
#page a.btn_link:link,
#page a.btn_link:visited,
#page a.btn_link:hover,
#page a.btn_link:focus,
#page a.btn_link:active,
#page a.btn_link p,
#page a.btn_link:hover p,
#page a:hover .btn_link p,
#container a.btn_link,
#container a.btn_link:hover,
#container a.btn_link p,
#container a.btn_link:hover p,
#container a:hover .btn_link p,
#sections .two_one_column a.btn_link,
#sections .two_one_column a.btn_link:hover,
#sections .two_one_column a.btn_link p,
#sections .two_one_column a.btn_link:hover p {
	color: #fff !important;
	text-decoration: none !important;
}

#page a.btn_link p::before,
#page a.btn_link p::after,
#sections .two_one_column .btn_link p::before,
#sections .two_one_column .btn_link p::after {
	content: none !important;
	display: none !important;
}


/* case: 空間用途リンクは黒 */
#sections .link_column .column a,
#sections .link_column .column a:link,
#sections .link_column .column a:visited,
#sections .link_column .column a:hover,
#sections .link_column .column a:focus,
#sections .link_column .column a:active,
#sections .link_column .column a span,
#sections .link_column .column a:hover span,
#sections a.anchorlink,
#sections a.anchorlink:link,
#sections a.anchorlink:visited,
#sections a.anchorlink:hover,
#sections a.anchorlink:focus,
#sections a.anchorlink:active,
#sections a.anchorlink span,
#sections a.anchorlink:hover span {
	color: #000 !important;
	text-decoration: none;
}

/*-------------------------
   .top_wrapper
-------------------------*/
.top_wrapper{
	margin: 4em auto 4em;
}
.top_wrapper a{
	color: #000;
	text-decoration: none;
}

.top_wrapper h2{
	font-weight: bold;
	font-size: 175%;
	text-align: center;
	margin-bottom: 1em;
}

@media screen and (max-width: 640px) {
.top_wrapper h2{
	font-size: 5vw
}
}

/*-------------------------
   three_column
-------------------------*/
.three_two_column{
    display : flex;
    flex-wrap : wrap;
    justify-content:space-between;
}

.three_two_column::after{
    content:"";
    display: block;
    width: 32%;
}

.three_two_column .column{
    width: 32%;
}


@media screen and (max-width: 640px) {
.three_two_column::after{
    width: 48%;
}

.three_two_column .column{
    width: 48%;
}
}
.btn_link p {
  background: none !important;
}
