@charset "utf-8";
/* CSS Document */

/**********************************************************/
/* PC */
/**********************************************************/

/**********************************
　ファーストビュー
**********************************/
.fv{
  height: 734px;
  margin-bottom: 0;
}
.mv-picture{
  position: absolute;
  width: 57%;
  height: 734px;
  top:0;
  right: 0;
  z-index: -1;
}

/**********************************
  MESSAGE
**********************************/
.message{
  background: #000;
  margin: 0 50px 0 0;
  padding-top: 78px;
  z-index: 1;
}
.m__inner:first-of-type{
  width: 72%;
}
.m__inner:last-of-type{
  width: 28%;
}

.message h2{
  margin-top: -44px;
  font-family:'Roboto', sans-serif;
  color: #fff;
}
.message h2,
.message h3{
  margin-left: -32px;
}
.message h3 {
  margin-bottom: 40px;
}
.message .m__inner:first-of-type{
  margin: 0 0 56px 72px;
  
}
.message .m_list{
  margin: 45px auto 40px;
}
.message .m_list li{
  font-size: 2rem;
  color: #fff;
  font-weight: bold;
  background: #BE0000;
  margin-bottom: 23px;
  line-height: 2;
  width: 327px;
  padding-left: 10px;
}
.message p{
  color: #fff;
  line-height: 2;
  margin-bottom: 26px;
}
.message .m__inner:last-of-type{
  position: relative;
}
.message .m__inner:last-of-type img  {
  position: absolute;
  top: 30px;
  left: 43px;
  width: 306px;
}
.message .m__inner:last-of-type p  {
  position: absolute;
  top: 457px;
  left: 43px;
  width: 306px;
}



/**********************************
  NEWS
**********************************/
.news-sec{
  margin-top: 55px;
}
.news-sec .ttl-box{
  margin:0 114px 66px auto;
  width: 437px;
}
.news-sec .sec-ttl {
  margin-bottom: 43px;
}
.news-sec li{
  width: 33.3%;
  text-align: center;
  margin-bottom: 70px;
  line-height: 1.5;
  font-size: 1.8rem;
}
.news-sec li span{
  font-size: 1.2rem;
  line-height: 1;
}

.news-sec li img{
  margin-bottom: 23px;
}
.news-sec li:first-of-type img{
  width: 349px;
}
.news-sec li:nth-of-type(2) img{
  width: 348px;
}
.news-sec li:nth-of-type(3) img{
  width: 196px;
}
.news-sec li:last-of-type img{
  width: 405px;
}

/**********************************
  会社概要
**********************************/
.company-sec h2{
  font-size: 3.6rem;
  position: relative;
  text-align: center;
}
.company-sec h2::after{
  content: "";
  position: absolute;
  width: 408px;
  height: 1px;
  background: #707070;
  top:50px;
  left:50%;
  transform: translateX(-50%);
}
.company-sec h3{
  font-size: 2.2rem;
  color: #BE0000;
  text-align: center;
  margin: 30px auto 90px;
}
.company-sec h4{
  font-size: 2.2rem;
  color: #BE0000;
  font-weight: bold;
  margin:44px auto  66px 40px;
  position: relative;
}
.company-sec h4::after{
  content: "";
  position: absolute;
  width: 437px;
  height: 1px;
  background: #707070;
  top:44px;
  left:0;
}
.company-sec h5{
  font-size: 2.2rem;
  font-weight: bold;
  border: solid 1px #333;
  height: 65px;
  width: 254px;
  text-align: center;
  padding: 22px 0;
  margin-bottom: 12px;
}
.company-sec .box4 dt,
.company-sec .box4 dd{
  padding: 12px 0 12px 20px;
  letter-spacing: 0;
}

.company-sec .box4 dt{
  width: 17%;
  font-weight: bold;
}
.company-sec .box4 dd{
  width: 83%;
}


.company-sec ul{
  margin: 0 auto;
}
.company-sec .box1,
.company-sec .box5{
  background: #f0f0f0;
  padding: 63px 50px 66px 0;
  margin-left: 50px;
}
.company-sec .box2{
  margin-bottom: 72px;
}
.company-sec .box3{
  background: #f0f0f0;
  padding: 63px 0 66px 50px;
  margin-right: 50px;
}
.company-sec .box4{
  margin-top: 7px;
}
.company-sec .box5{
  margin-top: 65px;
}

.company-sec .box4 div.flex{
  margin-top: 43px;
  justify-content: flex-start;
}
/*.company-sec .box4 div.flex:last-of-type{
  margin-top: 43px;
  justify-content: flex-start;
}
.company-sec .box4 div.flex:last-of-type div{
    margin-right: 23px;
}
*/
.company-sec .box4 .flex div{
  width: 33%;
  max-width: 398px;
	padding: 0 10px;
}

.company-sec .box1 dl,
.company-sec .box2 dl,
.company-sec .box3 dl,
.company-sec .box5 dl{
  margin: 0 auto;
  width: 924px;
}
.company-sec dl{
  border-top:solid 1px #707070;
}
.company-sec dl:last-of-type{
  border-bottom:solid 1px #707070;
}
.company-sec dt{
  font-weight: bold;
}
.company-sec dt,
.company-sec dd{
  padding: 20px 20px;
  line-height: 2;
}
.company-sec .box1 dt,
.company-sec .box3 dt{
  width: 15%;
}
.company-sec .box1 dd
.company-sec .box3 dd{
  width: 85%;
}

/**********************************************************/
/* SP用 */
/**********************************************************/

@media(max-width: 768px) {

/**********************************
　ファーストビュー
**********************************/
.fv {
    width: 100%;
    height: 714px;
    padding-top: 90px;
}
.mv-picture{
    width: 81%;
    height: 561px;
    top:60px;
    right: 0;
}

.fv .ttl-bg {
    margin-top: 0;
}
.fv::before {
    top: 649px;
    width: 60%;
}  
  
  
/**********************************
  MESSAGE
**********************************/
.message {
    background: #000;
    margin: 0 4% 0 0;
    padding-top: 78px;
    z-index: 1;
}  
.message .inner.flex {
    display:block;
}
.message .m__inner:first-of-type {
    margin: 0 0 0 2%;
    padding-bottom: 520px;
    width: 96%;
}
.message h2,
.message h3 {
    margin-left: 2%;
}  
.message h3 {
    margin-bottom: 24px;
    width: 100%;
}
.m__inner:last-of-type {
    width: 100%;
}  
.message .m__inner:last-of-type img {
    position: absolute;
    top: -540px;
    left: 0;
    width: 306px;
}
.message .m__inner:last-of-type p {
    position: absolute;
    top: -120px;
    left: auto;
    right: 0;
    width: auto;
}  
  
  
  
  
  
/**********************************
  NEWS
**********************************/  
.news-sec.inner {
    max-width: 100%;
    margin: 60px auto 0;
  padding: 0 2%;
}  
.news-sec .ttl-box {
    margin: 0 auto 20px 0;
    width: 100%;
}
.news-sec li {
    width: 100%;
    font-size: 1.4rem;
}  
.news-sec li span {
    font-size: 1.0rem;
}


/**********************************
  会社概要
**********************************/
.company-sec h2 {
    font-size: 2.6rem;
}
.company-sec h2::after {
    width: 254px;
    top: 40px;
}
.company-sec h3 {
    margin: 30px auto 18px;
}
.company-sec h4 {
    font-size: 2.2rem;
    color: #BE0000;
    font-weight: bold;
    margin: 32px auto 60px 2%;
    position: relative;
}
.company-sec h4::after {
    width: 257px;
    top: 38px;
}
.company-sec .box1, .company-sec .box5 {
    background: #f0f0f0;
    padding: 30px 0 43px 0;
    margin-left: 0;
}  
.company-sec .box1 dl,
.company-sec .box2 dl,
.company-sec .box3 dl,
.company-sec .box5 dl {
    margin: 0 4% 0 2%;
    width: 94%;
}
.company-sec .box4 .flex div {
    width: 100%;
    max-width: 100%;
}
.company-sec .box1 dt,
.company-sec .box3 dt{
    width: 37%;
}  
.company-sec .box1 dd,
.company-sec .box3 dd {
    width: 63%;
}  
.company-sec dt,
.company-sec dd {
    padding: 20px 2%;
    line-height: 2;
}  
.company-sec .box3 {
    background: #f0f0f0;
    padding: 30px 0 33px 0;
    margin-right: auto;
}  
.company-sec .box4 {
    margin: 0 0 0 2%;
}
.company-sec .box4 div.flex,
.company-sec .box4 div.flex:last-of-type {
    margin-top: 0;
}  
.company-sec .box4 .flex div {
    width: 94%;
    max-width: 94%;
    margin-top: 47px;
}
.company-sec h5 {
    font-size: 2.2rem;
    font-weight: bold;
    border: solid 1px #333;
    height: 55px;
    width: 217px;
    padding: 15px 0;
    margin-bottom: 12px;
}
.company-sec .box5 dt,
.company-sec .box5 dd {
    letter-spacing: 0.05em;
}  
  
  
  
/**********************************
  メディア
**********************************/
.media-under .ttl-box {
    text-align: left;
    margin-left: 2%;
    margin-top: 42px;
}  
  
  

}