@charset "utf-8";

.pc { display: block !important; }
.sp { display: none !important; }
@media only screen and (max-width: 768px) {
.pc { display: none !important; }
.sp { display: block !important; }
}
@media (min-width: 1200px) {
#wrapper {  overflow-x: hidden;
position: relative;
width: 100%;
}
#wrapper::before {
content: '';
position: absolute;
width: 100%;
height:100%; 
background-image: url(https://led.minamihara.co.jp/wp-content/themes/admin2021/illumination_img/bg.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
background-attachment: fixed;
mix-blend-mode: color-dodge;
pointer-events: none;
z-index: 1;
}
}
@media (max-width: 1200px) { #wrapper {  overflow-x: hidden;
position: relative;
width: 100%;
}
#wrapper::before {
content: "";
display: block;
position: fixed;
left: 0px;
width: 100%;
height: 100vh;
background-image: url(https://led.minamihara.co.jp/wp-content/themes/admin2021/illumination_img/bg.jpg);
mix-blend-mode: color-dodge;
background-size: cover;
background-repeat: no-repeat;
}
}
.web_text{
color: #fff;
font-size: 0.9rem;
text-align: center;
line-height: 150%;
letter-spacing: .1em;
text-decoration: none !important;
margin-top: 1rem;
}
.web a{ overflow:hidden; }
.web a img:hover{
transform:scale(1.1);
transition:0.4s;
}
@media (max-width: 768px) {
.web_text{
margin-top: 1rem;
margin-bottom: 3rem;
}
}
.web-item{
width: 90%;
border-radius: 10px;
}
.bg-blue{
opacity: .85;
mix-blend-mode: lighten;
z-index: 1;
background-image: linear-gradient(180deg, rgba(32, 36, 97, 1) 93%, rgba(0, 0, 0, 0));
}
.web{
display: flex;
position: relative;
justify-content: space-evenly;
text-align: center;
}
@media (max-width: 768px) {
.web{
display: block;
justify-content: space-evenly;
}
}
.bg-blue2{
mix-blend-mode: lighten;
z-index: 1;
background-color: rgba(32, 36, 97, 1);
}
.bg-black{
background-color: #000;
}
@media (min-width: 1090px){
.service_text{
color: #fff;
font-size: 1.0rem;
text-align: left;
line-height: 308%;
letter-spacing: .2em;
}
}
@media (min-width: 1000px) and (max-width: 1090px)  {
.service_text{
color: #fff;
font-size: 1.0rem;
text-align: left;
line-height: 250%;
letter-spacing: .2em;
}
}
@media (max-width: 1000px) {
.service_text{
color: #fff;
font-size: 0.9rem;
text-align: left;
line-height: 250%;
letter-spacing: .2em;
}
}
@media (min-width: 991px) {
.container2 {
width: 90%;
max-width: 1000px;
margin: 0 auto;
}
}
@media (max-width: 991px) {
.container2 {
width: 90%;
margin: 0 auto;
}
}
@media (min-width: 991px) {
.container3 {
width: 90%;
max-width: 820px;
margin: 0 auto;
}
}
@media (max-width: 991px) {
.container3 {
width: 90%;
margin: 0 auto;
}
}
@media (min-width: 991px) {
.container4 {
width: 90%;
max-width: 820px;
margin: 0 auto;
}
}
@media (max-width: 991px) {
.container4 {
width: 95%;
margin: 0 auto;
}
}
.section{
width: 50%;
min-width: 300px;
}
.section2{
width: 40%;
min-width: 300px;
}
.contact{
display: block;
position: relative;
}
.contact img{
width: 60%;
height: auto;
min-width: 350px;
display: block;
}
.pc_contact {
position: absolute;
left: 50%;
top: 85%;
width: 50%;
transform: translate(-50%,-50%);
display: block;
width: 200px;
box-sizing: border-box;
background: #2F3C7D;
padding: 7px;
text-align: center;
color: #FFF;
transition: .3s;
text-decoration: none;
border-radius: 10px;
transition: 0.3s ease-in-out;
font-size: 1.0rem;
text-align: center;
line-height: 250%;
letter-spacing: .2em;
z-index: 999;
}
.pc_contact:hover {
background: #F5C580;
color: #FFF;
}
.sp_contact {
position: absolute;
left: 50%;
top: 85%;
width: 50%;
transform: translate(-50%,-70%);
display: block;
width: 150px;
box-sizing: border-box;
background: #2F3C7D;
padding: 4px;
text-align: center;
color: #FFF;
transition: .3s;
text-decoration: none;
border-radius: 10px;
transition: 0.3s ease-in-out;
font-size: 0.8rem;
text-align: center;
line-height: 250%;
letter-spacing: .2em;
z-index: 999;
}
.sp_contact:hover {
background: #F5C580;
color: #FFF;
}
.s_center{
text-align: center;
}
.scroll_img{
width: 60px;
display: block;
padding-top: 2em;
padding-bottom: 3em;
margin: 0 auto;
}
.d-inline-block{
display: inline-block;
}
header a {
color: #444444 !important;
text-decoration: none !important;
}
.btn_txt{
color: #fff !important;
}
#main_header{
padding: 8px 0 !important;
}
header .border{
border: 0px !important;
}
body {
color: #fff;
font-family: "yu-gothic-pr6n", sans-serif;
font-weight: 400;
font-style: normal;
}
.p_text{
color: #fff;
font-size: 1.0rem;
text-align: left;
line-height: 250%;
letter-spacing: .2em;
}
.p_text2{
color: #fff;
font-size: 1.0rem;
text-align: left;
line-height: 220%;
letter-spacing: .2em;
}
.p_text3{
color: #fff;
font-size: 1.0rem;
text-align: left;
line-height: 280%;
letter-spacing: .2em;
}
.sp_text{
color: #fff;
font-size: 0.8rem;
text-align: left;
line-height: 250%;
letter-spacing: .2em;
}
footer a {
text-decoration: none !important;
}
.row2{
display: flex;
flex-wrap: wrap;
}
body .small_text{
font-size: 10px;
text-align: right !important;
}
.hinmeri{
width: 80px;
position: absolute;
right: 10%;
z-index: 0;
}
.list {
display: grid;
width: fit-content;
column-gap: 1.5em;
grid-template-columns: repeat(4, auto);
padding-right: 2rem;
}
.list li.hidden {
opacity: 0;
height: 0;
margin: 0;
}
.list_sp {
display: grid;
width: fit-content;
column-gap: 0.5em;
grid-template-columns: repeat(2, auto);
padding-right: 1rem;
padding-left: 1rem !important; 
}
.list_sp li.hidden {
opacity: 0;
height: 0;
margin: 0;
}
.list2 {
display: grid;
width: fit-content;
column-gap: 1.5em;
grid-template-columns: repeat(4, auto);
padding-right: 2rem;
}
.list2 li.hidden {
opacity: 0;
height: 0;
margin: 0;
}
.list2_sp {
display: grid;
width: fit-content;
column-gap: 0.5em;
grid-template-columns: repeat(2, auto);
padding-right: 1rem;
padding-left: 1rem !important; 
}
.list2_sp li.hidden {
opacity: 0;
height: 0;
margin: 0;
}
.list3 {
display: grid;
width: fit-content;
column-gap: 1.5em;
grid-template-columns: repeat(4, auto);
padding-right: 2rem;
}
.list3 li.hidden {
opacity: 0;
height: 0;
margin: 0;
}
.list3_sp {
display: grid;
width: fit-content;
column-gap: 0.5em;
grid-template-columns: repeat(2, auto);
padding-right: 1rem;
padding-left: 1rem !important; 
}
.list3_sp li.hidden {
opacity: 0;
height: 0;
margin: 0;
}
.list4 {
display: grid;
width: fit-content;
column-gap: 1.5em;
grid-template-columns: repeat(3, auto);
padding-right: 2rem;
}
.list4 li.hidden {
opacity: 0;
height: 0;
margin: 0;
}
.list4_sp {
display: grid;
width: fit-content;
column-gap: 0.5em;
grid-template-columns: repeat(2, auto);
padding-right: 1rem;
padding-left: 1rem !important; 
}
.list4_sp li.hidden {
opacity: 0;
height: 0;
margin: 0;
}
.content{
text-align: center;
}
.content img{
width: 92%;
margin-bottom: 15%;
border-radius: 15px;
}
.content video{
width: 92%;
margin-bottom: 15%;
border-radius: 15px;
}
.more{
position: relative;
left: 50%;
transform: translate(-50%,0%);
display: block;
width: 230px;
box-sizing: border-box;
background-color: transparent;
padding: 4px;
text-align: center;
color: #FFF;
transition: .3s;
text-decoration: none;
border-radius: 100vh;
transition: 0.3s ease-in-out;
font-size: 1.0rem;
text-align: center;
line-height: 250%;
letter-spacing: .2em;
border: 2px solid #fff;
z-index: 99;
}
.more:hover {
background: rgba(255,255,255,0.5);
color: #FFF;
}
.more_sp{
position: relative;
left: 50%;
transform: translate(-50%,0%);
display: block;
width: 200px;
box-sizing: border-box;
background-color: transparent;
padding: 3px;
text-align: center;
color: #FFF;
transition: .3s;
text-decoration: none;
border-radius: 100vh;
transition: 0.3s ease-in-out;
font-size: 0.9rem;
text-align: center;
line-height: 250%;
letter-spacing: .2em;
border: 2px solid #fff;
z-index: 99;
}
.more_sp:hover {
background: rgba(255,255,255,0.5);
color: #FFF;
}
@media (min-width: 600px){
.product_text{
padding-left: 2rem;
color: #fff;
font-size: 1.0rem;
text-align: left !important;
line-height: 250%;
letter-spacing: .25em;
}
}
@media (max-width: 600px){
.product_text{
padding-left: 0rem;
color: #fff;
font-size: 0.8rem;
text-align: left !important;
line-height: 250%;
letter-spacing: .25em;
}
}
.cp_hr02 {
margin: 1rem;
height: 12px !important;
background-image: repeating-linear-gradient(45deg,#FFC59A 0, #FFC59A 1.2px, transparent 0, transparent 50%);
background-size: 5px 5px;
}
.ex{
width: 92%;
border-radius: 15px;
}
.li_ex .ex_b{
margin: 10px 0;
display: flex;
flex-wrap: wrap;
width: 100%;
}
@media (min-width: 768px){
.li_ex .ex_b img{
width: calc(100% / 2 - 20px);
margin-right: 30px;
margin-bottom: 30px;
height: 370px;
object-fit: cover;
height: 280px;
}
}
.li_ex .ex_b img:nth-child(2n){
margin-right: 0;
}
.li_ex .ex_b{
margin-bottom: 0;
}
.li_ex p{
font-weight: bold;
font-size: 1.5em;
color: #fff;
padding: 1em 0 0.5em 0;
text-align: center;
}
@media (max-width: 768px){
.li_ex .ex_b img{
width: 100%;
height: auto;
margin-right: 0;
margin-bottom: 2rem;
}
}
@media (min-width: 600px){
.pad-l{
padding-left: 5%;
}
}
.mb-6{
margin-bottom: 5rem;
}
@media (min-width: 600px){
.mb-works{
margin-bottom: 5rem;
}
}
@media (max-width: 600px){
.mb-works{
margin-bottom: 2.4rem;
}
}
@media (min-width: 600px){
.mb-sonota{
margin-bottom: 6rem;
}
}
@media (max-width: 600px){
.mb-sonota{
margin-bottom: 3rem;
}
}
@media (min-width: 600px){
.flow_top{
margin-top: 6rem;
}
}
@media (max-width: 600px){
.flow_top{
margin-top: 4rem;
}
}
@media (min-width: 600px){
.flow_pc_top{
margin-top: 2rem;
}
}
@media (max-width: 600px){
.flow_pc_top{
margin-top: 0.5rem;
}
}
@media (min-width: 600px){
.produ_mt{
margin-top: 3.5rem;
}
}
@media (max-width: 600px){
.produ_mt{
margin-top: 0.5rem;
}
}
@media (max-width: 600px){
.height_img{
width: 60%;
text-align: left;
}
}