@charset "utf-8";

/* 見出し */
#contentsarea #information h2,
#contentsarea #service h2,
#contentsarea #aboutus h2{
  font-weight:400;
  font-size:4rem;
  background:url("/common/img/pulse_o.svg") no-repeat center bottom;
  background-size:75px;
  padding-bottom:45px;
  line-height:120%;
  text-align:center;
}
#contentsarea #aboutus h2{
  background:url("/common/img/pulse_w.svg") no-repeat center bottom;
  background-size:75px;
}

/* メインイメージ */
#contentsarea #main{
  background:#ffffff url("/img/img_TOP.png") no-repeat center;
  background-size:350%;
  text-align:center;
  padding:60px 20px 60px 20px;
}
#contentsarea #main .copy{
  font-size:1.8rem;
  color: white;
    font-weight: bold;
}
#contentsarea #main .ls_logo{
  margin:30px auto 10px auto;
  max-width:180px;
}
#contentsarea #main .servicename{
  font-weight:700;
  font-size:4.6rem;
  line-height:110%;
  margin-bottom:30px;
  margin-top:40px;
}
#contentsarea #main .text{
  line-height:150%;
  text-align:left;
    color: white;
}

/* Security information */
#contentsarea #information{
  background:#efefef;
  padding:30px 0;
}
#contentsarea #information p.lead{
  margin:30px 0;
  padding:0 20px;
  text-align:left;
}
#contentsarea #information ul{
  padding:0 20px;
  text-align:left;
}
#contentsarea #information ul li{
  margin-top:20px;
}
#contentsarea #information ul li a{
  display:block;
  color:#000000;
}
#contentsarea #information ul li span.image{
  float:left;
  width:48%;
}
#contentsarea #information ul li span.text{
  float:right;
  width:52%;
  box-sizing:border-box;
  padding-left:10px;
  line-height:140%;
}
#contentsarea #information .more_info{
  text-align:center;
}
#contentsarea #information .more_info a{
  display:inline-block;
  margin-top:50px;
  border:1px solid #000000;
  padding:10px 75px;
  color:#000000;
}

/* Service */
#contentsarea #service{
  padding-top:30px;
}
#contentsarea #prevention{
  background:url(/img/img_service01.png) no-repeat right top;
  background-size:80% auto;
  padding-top:80px;
  margin:30px 0 50px 0;
}
#contentsarea #incident{
  background:url(/img/img_service02.png) no-repeat left top;
  background-size:80% auto;
  padding-top:80px;
  margin-bottom:40px;
}
#contentsarea #prevention .prevention_inner,
#contentsarea #incident .incident_inner{
  width:80%;
  box-sizing:border-box;
  padding:30px;
}
#contentsarea #prevention .prevention_inner{
  background:#009fe8cf;
}
#contentsarea #incident .incident_inner{
  background:#009fe8cf;
  margin-left:20%;
}
#contentsarea #prevention .prevention_inner h3,
#contentsarea #incident .incident_inner h3{
  font-size:2.4rem;
  color:white;
  margin-bottom:30px;
}

#contentsarea #service ul li{
  margin-bottom:30px;
}
#contentsarea #service a{
  color:white;
  line-height:130%;
}

/* About us */
#contentsarea #aboutus{
  padding-top:40px;
  margin-top:-40px;
}
#contentsarea #aboutus_inner{
  background:#83c8be url(/img/back_Aboutus.png) no-repeat top center;
  padding:30px 0 40px 0;
  background-size:cover;
  color:#ffffff;
  text-align:center;
}
#contentsarea #aboutus_inner .ls_logo{
  margin:30px 0;
}
#contentsarea #aboutus_inner .ls_logo img{
  max-width:320px;
}
#contentsarea #aboutus_inner p.summary{
  text-align:left;
  padding:0 20px;
  line-height:150%;
}
#contentsarea #aboutus_inner p.summary br{
  display:none;
}
#contentsarea #aboutus_inner p.link_corporate{
  padding:0 20px;
}
#contentsarea #aboutus_inner p.link_corporate a{
  display:block;
  margin-top:30px;
  border:1px solid #ffffff;
  color:#ffffff;
  padding:25px 0;
}



/* タブレット
-------------------------------------------------- */
@media only screen and (min-width: 667px) {

  /* 見出し */
  #contentsarea #information h2,
  #contentsarea #service h2,
  #contentsarea #aboutus h2{
    font-size:4.8rem;
  }

  /* メインイメージ */
  #contentsarea #main{
    background-size:cover;
    text-align:left;
    padding:30px 20px 30px 50%;
    box-sizing:border-box;
  }
  #contentsarea #main .ls_logo{
    margin:30px 0 10px 0;
    max-width:180px;
  }

  /* Security information */
  #contentsarea #information{
    padding:40px 0 50px 0;
  }
  #contentsarea #information p.lead{
    text-align:center;
  }
  #contentsarea #information ul{
    display:flex;
  }
  #contentsarea #information ul li{
    width:32%;
    margin-right:2%;
  }
  #contentsarea #information ul li:last-child{
    margin-right:0;
  }
  #contentsarea #information ul li span.image,
  #contentsarea #information ul li span.text{
    float:none;
    display:block;
    width:100%;
  }
  #contentsarea #information ul li span.text{
    padding-left:0;
    margin-top:10px;
  }

  /* Service */
  #contentsarea #service{
    padding:40px 20px 50px 20px;
  }
  #contentsarea #prevention,
  #contentsarea #incident{
    background-size:70% auto;
  }
  #contentsarea #prevention .prevention_inner,
  #contentsarea #incident .incident_inner{
    width:70%;
  }
  #contentsarea #incident .incident_inner{
    margin-left:30%;
  }
  #contentsarea #prevention .prevention_inner h3,
  #contentsarea #incident .incident_inner h3{
    font-size:3.6rem;
  }

  /* About us */
  #contentsarea #aboutus_inner{
    padding:40px 20px 50px 20px;
  }
  #contentsarea #aboutus_inner p.summary{
    text-align:center;
  }
  #contentsarea #aboutus_inner p.summary br{
    display:inline;
  }
  #contentsarea #aboutus_inner p.link_corporate{
    text-align:center;
  }
  #contentsarea #aboutus_inner p.link_corporate a{
    display:inline-block;
    width:31rem;
  }
}

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

  /* メインイメージ */
  #contentsarea #main{
    padding:50px 30px 50px 50%;
  }
}



/* PC
-------------------------------------------------- */
@media only screen and (min-width: 769px) {

  /* メインイメージ */
  #contentsarea #main .copy{
    font-size:24px;
  }

    #contentsarea #main .copy br{
        display: none;
    }

  #contentsarea #main .ls_logo{
    max-width:200px;
  }
  #contentsarea #main .servicename{
    font-size:5.4rem;
    margin-bottom:50px;
    margin-top:40px;
  }
  #contentsarea #main .text{
    line-height:180%;
        font-size: 20px;
  }

  /* Security information */  
  #contentsarea #information ul{
    max-width:1000px;
    margin:0 auto;
  }
  #contentsarea #information ul li a:hover{
    color:#555555;
  }
  #contentsarea #information ul li a:hover span.image{
    opacity:0.8;
  }
  #contentsarea #information .more_info a:hover{
    background:#E16C00;
    border:1px solid #E16C00;
    color:#ffffff;
  }

  /* Service */
  #contentsarea #service{
    max-width:1000px;
    margin:0 auto;
  }
  #contentsarea #prevention,
  #contentsarea #incident{
    background-size:55% auto;
  }
  #contentsarea #prevention .prevention_inner,
  #contentsarea #incident .incident_inner{
    width:55%;
    padding:60px;
  }
  #contentsarea #incident .incident_inner{
    margin-left:45%;
  }
  #contentsarea #service a:hover{
    text-decoration:underline;
  }

  /* About us */
  #contentsarea #aboutus{
    padding-top:76px;
    margin-top:-76px;
  }
  #contentsarea #aboutus_inner p.link_corporate a:hover{
    background:#ffffff;
    color:#E16C00;
  }
}

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

  /* メインイメージ */
  #contentsarea #main{
    padding:120px 50px 120px 50%;
  }
  #contentsarea #main .servicename br{
    display:none;
  }
}
