@charset "UTF-8";

/*共通*/
.noto-sans jp-<uniquifier> {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
html { scroll-behavior: smooth;}
body{
  font-family: "Helvetica Neue",Arial,"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
  color: #780000;
}
p{
	font-size: 15px;
  letter-spacing: 0.02em;
  line-height: 1.5em;
}

.pc_only{display: block;}
.sp_only{display: none;}

/*スライダー*/
.slider_con{
  height: 100vh;
  display: flex;
  align-items: center;
}
.visual_slider{
  height: 95vh;
}
.visual_slider .swiper-wrapper{
  transition-timing-function: linear;
}
.visual_slider .swiper-slide{}
.visual_slider .swiper-slide img{
  width: 95%;
  height: 100%;
  object-fit: cover;
  border-radius: 50px;
}
/*スライダー ここまで*/

.uehara{
  display: flex;
}
.title{
  font-size: 13px;
  line-height: 1.1em;
  padding-bottom: 10px;
  margin-bottom: 20px;
  border-bottom: solid 1px;
}
.title img{
  margin-right: 10px;
}
.title_news{
  max-width: 158px;
  width: 40%;
}
.title_contact{
  max-width: 263px;
  width: 67%;
}
.title_company{
  max-width: 273px;
  width: 69%;
}
.visual{
  width: 30%;
  order: 2;
  position: relative;
}
.visual p{
  font-family: "Zen Maru Gothic", "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "HG丸ｺﾞｼｯｸM-PRO", "HGMaruGothicMPRO";
    font-size: 28px;
    font-weight: 600;
    letter-spacing: 0.07em;
    line-height: 2em;
    writing-mode: vertical-rl;
    position: absolute;
    top: 41%;
    left: 49%;
    transform: translateY(-50%) translateX(-50%);
    z-index: 10;
}
.visual_txt{
  max-width: 280px;
  width: 70%;
  text-align: center;
  position: absolute;
  bottom: 9%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  z-index: 10;
}

.uehara_pc{
  width: 35%;
  height: 100vh;
  order: 1;
  background-color: #F1E5E5;
  padding: 3% 4%;
}
.news{
  margin-bottom: 60px;
}
.news_article{}
.news_article ul{}
.news_article li{
  display: flex;
}
.news_article li .news_date{width: 23%;}
.news_article li .news_text{width: 77%;}
.contact{}
.contact_article{}
.contact_article a{
  display: block;
  text-align: center;
  font-size: 18px;
  color: #fff;
  background-color: #780000;
  padding: 25px 20px;
  margin: 15px 0;
  transition: .6s;
}
.contact_article a:hover{
  opacity: 0.7;
  transition: .6s;
}
.contact_article p{}
.contact_article p.note{
  font-size: 12px;
}
.company{
  width: 35%;
  order: 3;
  padding: 3% 4%;
  height: 100vh;
}
.company_article{
  margin-top: 25px;
}
.company_article dl{
  font-size: 14px;
  line-height: 1.3em;
  display: flex;
  align-items: center;
  padding: 0 3px 12px;
  margin-bottom: 10px;
  border-bottom: solid 1px;
}
.company_article dt{
  width: 30%;
  padding-right: 10px;
  font-weight: normal;
}
.company_article dt span{
  display: inline-block;
}
.company_article dd{
  width: 70%;
  font-weight: bold;
  letter-spacing: 0.01em;
}
.company_map{
  width: 100%;
  height: 300px;
}
.copyright{
  margin-top: 80px;
  padding-top: 3px;
  text-align: center;
  border-top: solid 1px;
}
.copyright p{
  font-size: 12px;
}
.scroll{overflow-y: scroll;}


/*--------------------------------- 調整用  ---------------------------------*/
@media screen and (max-width: 1200px){

  .visual,.news,.company,.contact,.copyright{}
  .uehara{
    flex-direction: column;
    margin: 0 auto;
  }
  .news,.company,.contact{
    width: 100%;
    padding: 5% 20%;
    margin: 0;
  }
  .news,.contact,.copyright{
    background-color: #F1E5E5;
  }
  .visual{
    order: 1;
    width: 100%;
    margin: 0 auto;
  }
  .uehara_pc{
    display: contents;
  }
  .news{
    order: 2;
  }
  .company{
    order: 3;
    height: initial;
  }
  .contact{
    order: 4;
    padding-bottom: 7%;
  }
  .copyright{
    order: 5;
    margin-top: 0;
    padding-bottom: 15px;
    width: 100%;
  }
  .scroll{overflow-y: initial;}

}



/*--------------------------------- ここからTB  ---------------------------------*/
@media screen and (max-width: 768px){

  .visual{
    width: 100%;
  }
  .news,.company,.contact{
    padding: 8% 10%;
  }
  .contact{
    padding-bottom: 10%;
  }

}



/*--------------------------------- ここからSP  ---------------------------------*/
@media screen and (max-width: 600px){

  .pc_only{display: none;}
  .sp_only{display: block;}

  .news,.company,.contact{
    padding: 8% 7%;
  }
  .news_article li{flex-direction: column;}
  .news_article li .news_date{width: 100%;}
  .news_article li .news_text{width: 100%;}
  .contact{
    padding-bottom: 10%;
  }

}