@charset "utf-8";

/**
 * ***************************************
 * ページ全体に関わるCSSの設定
 * ***************************************
 */
 html *,
 ::before,
 ::after {
   box-sizing: border-box;
 }
 /* フォント */
 html {
   font-size: 14px;
 }
 @media (min-width: 768px) {
   html {
     font-size: 16px;
   }
 }
 body {
   font-family: "ＭＳ Ｐゴシック", "MS PGothic", "游ゴシック", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",  sans-serif;
 }

 /* ベースのリンクカラー */
 a {
   color: #f30;
 }
 
 /* レスポンシブイメージと画像下スペース防止 */
 img {
   max-width: 100%;
   height: auto;
   vertical-align: bottom;/* 画像下のスペースを消す */
 }
/**
* ***************************************
* ヘッダー
* ***************************************
**/
@media (min-width: 768px) {
  .header_container {
    margin: 0 auto;
    padding: 0 0 0 22%;
    max-width: 2000px;
  }
}
/* ヘッダーロゴ */
.header-logo {
  margin: 0;
  padding: 10px 0 10px 19px;
  font-size: 0;
  line-height: 0;
}
.header-logo img {
  width: 130px;
}
@media (min-width: 768px) {
  .header-logo {
    padding: 24px 0 24px 20px;
    margin: 0;
    font-size: 0;
    line-height: 0;
  }
  .header-logo img {
    width: 245px;
  }
}
 /**
 * ***************************************
 * メイン(企業情報)
 * ***************************************
 **/
.main_container {
  width: 470px;
  background: url(../images/main_image_bg_sp.jpg) no-repeat right center;
  background-size: auto 550px; 
  height:550px;
  min-width:100%;
  padding: 15px 4% 0 4%;
 }
.companyprofile_logo h2{
  width: 250px;
  margin: 20px 0 5px 5px;
}
@media (min-width: 768px) {
  .main_container {
    background: url(../images/main_image_bg.jpg)no-repeat;
    min-width:100%;
    padding: 30px 0 0 440px;
    height:735px;
  }
  .companyprofile_logo h2{
    width: 374px;
  }
}
.companyprofile_list {
  padding: 6% 4% 4% 4%;
  background:rgba(255, 255, 255, 0.5);
  box-shadow: 6px 6px 6px 0px rgba(0, 0, 0, 0.45);
}
.companyprofile_list dl {
  display: flex;
  margin: 0;
  padding: 20px 0;
  border-top: 1px solid #767373;
  align-items: center;
}
.companyprofile_list dl:first-child {
  border-top:none;
}
.companyprofile_list dl:last-child {
  border-bottom: 1px solid #767373;
}
.companyprofile_list dt {
  margin: 0 20px 0 27px;
  font-size: 1.1rem;
  line-height: 1.1;
  letter-spacing: 0em;
  width: 70px;
}
.companyprofile_list dd {
  margin: 0;
  font-size: 1.1rem;
  line-height: 1.1;
  letter-spacing: 0em;
}
.companyprofile_list dd:last-child{
  line-height: 1;
}
@media (min-width: 768px) {
  .companyprofile_list {
    padding: 40px 75px 44px 75px ;
    background:rgba(255, 255, 255, 0.5);
    box-shadow: 6px 6px 6px 0px rgba(0, 0, 0, 0.45);
    max-width: 940px;
    max-height: 77%;
  }
  .companyprofile_list dl {
    display: flex;
    margin: 0;
    padding: 20px 0;
    border-top: 1px solid #767373;
    align-items: center;
  }
  .companyprofile_list dl:first-child {
    border-top:none;
  }
  .companyprofile_list dl:last-child {
    border-bottom: 1px solid #767373;
  }
  .companyprofile_list dt {
    margin: 0 62px 0 27px;
    font-size: 1.5rem;
    line-height: 1.2;
    letter-spacing: 0em;
    width: 100px;
  }
  .companyprofile_list dd {
    margin: 0;
    font-size: 1.5rem;
    line-height: 1.2;
    letter-spacing: 0em;
  }
  .companyprofile_list dd:last-child{
    line-height: 1;
  }
}
 /**
 * ***************************************
 * ミドル（飾り）
 * ***************************************
 **/
 .page_middle{
    background: url(../images/decorationLine.jpg) no-repeat;

 }
 @media (min-width: 768px) {
  .middle-image{
    height: 88px;
  }
 }
/**
* ***************************************
* ボトム
* ***************************************
**/
 .page_bottom{
    background: #161515;
 }
 .bottom_container {
    padding: 56px 4% 54px 4%;
    color:#ffffff;
    text-align: center;
    width: 350px;
    margin: 0 auto;
  }
.bottom_name {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.footer_cname{
  font-size: 1.5rem;
  letter-spacing: 0em;
}
.bottom_address p{
  font-size: 1rem;
  letter-spacing: 0.07em;
}
@media (min-width: 768px) {
  .bottom_container {
    margin: 0 auto;
    padding: 56px 0px 54px 0px;
    max-width: 2000px;
    color:#ffffff;
    text-align: center;
    width: 407px;
  } 
  .bottom_name {
    display: flex;
    justify-content: space-between;
    align-items: center;
  } 
  .footer_cname{
    font-size: 1.81rem;
    letter-spacing: 0em;
  }
  .bottom_address p{
    font-size: 1.25rem;
    letter-spacing: 0em;
  }
}
/**
* ***************************************
* フッター（copyright）
* ***************************************
**/
 .page_footer{
    background: #171c61;
 }
 .footer_container {
    padding: 23px 4%;
    font-family: 'Bebas Neue', cursive;
    font-weight: normal;
    color: #fff;
    letter-spacing: 1px;
    font-size: 80%;
    text-align: center;
  }
@media (min-width: 768px) {
  .footer_container {
    max-width: 2000px;
    margin: 0 auto;
    padding: 23px 20px;
    font-family: 'Bebas Neue', cursive;
    font-weight: normal;
    color: #fff;
    letter-spacing: 1px;
    font-size: 74%;
    text-align: center;
  }
}