@charset "utf-8";
/* CSS Document */
body, html {
 min-width: 100%;
 padding: 0;
 margin: 0;
 font-size: 16px;
 font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
 color: #333;
 line-height: 1.6
}
* {
 box-sizing: border-box;
}
h1, h2, h3, h4, p {
 margin: 0px;
 padding: 0px;
}
ul, li, dl, dt, dd {
 margin: 0px;
 padding: 0px;
 list-style-type: none;
}
img {
 margin: 0px;
 padding: 0px;
 border: none;
}
a, a:visited {
 color: #333;
 text-decoration: none;
}
table {
 margin: 0px auto;
 border-collapse: collapse;
 border: 1px solid #ccc;
}
th, td {
 border: 1px solid #ccc;
 padding: 4px;
}
h1 {
 font-size: 18px;
 margin-bottom: 30px;
}
p {
 margin-bottom: 16px;
}
.mb_only {
 display: none;
}
#SiteHeader {
 width: 100%;
 position: absolute;
 overflow: hidden;
 top: 0;
 left: 0;
 z-index: 100;
 display: flex;
 justify-content: space-between;
 align-items: center;
 padding: 10px 0px 10px 4vw;
}
#SiteName {
 width: 464px;
 height: 54px;
 display: flex;
 align-items: center;
}
#SiteName a img {
 display: block
}
#CorporateSite {
 display: flex;
 justify-content: center;
 flex-direction: column;
 background: #fff;
 transition: all 0.5s ease;
 padding: 0px 0 0px 20px;
}
#CorporateSite:hover {
 background: #49ab4e;
}
#CorporateSite a {
 display: block;
 width: 300px;
 height: 70px;
 background: url("../img/header_link.png") no-repeat;
 background-size: 198px 18px;
 background-position: left top 26px;
 transition: all 0.5s ease;
}
#CorporateSite a:hover {
 background: url("../img/header_link_on.png") no-repeat;
 background-position: left top 26px;
 background-size: 198px 18px;
}
footer {
 width: 100%;
 max-width: 1200px;
 padding: 50px 20px;
 margin: 0 auto
}
footer div {
 display: flex;
 justify-content: flex-start;
 align-items: center
}
footer img {
 display: block;
 margin-right: 30px;
}
footer a {
 background: url("../img/link_arrow.gif") right center no-repeat;
 padding-right: 20px;
}
footer a:hover {
 text-decoration: underline
}
small {
 display: block;
 text-align: right;
 color: #8a8a8a;
}
.PageTop {
 right: 20px;
 bottom: 60px;
 position: fixed;
 z-index: 1000;
}
.PageTop a {
 background-image: url("../../img/pagetop.png");
 background-repeat: no-repeat;
 text-indent: -9999px;
 display: block;
 height: 51px;
 width: 51px;
}
#ProgressNav {
 opacity: 0
}
#ProgressNav.active {
 opacity: 1;
 position: fixed;
 top: 50%;
 transform: translateY(-50%);
 left: 0px;
 z-index: 100;
}
#ProgressNav ul {
 position: relative
}
#ProgressNav li {
 margin-bottom: 30px;
 margin-left: 50px;
}
#ProgressNav li a {
 display: block;
 width: 11px;
 height: 11px;
 border-radius: 50%;
 transition: all 0.3s;
 background: rgba(122, 122, 122, 0.5);
}
#ProgressNav li a:hover, #ProgressNav li.active a {
 background: #08b2c3;
}
#Thanks {
 width: 100%;
 max-width: 900px;
 margin: 20vw auto;
 padding: 10px 50px;
}
@media screen and (max-width: 1400px) {
 #SiteHeader {
  position: static;
  background: #fff;
  padding-left: 2vw
 }
 #CorporateSite a {
  width: 230px;
 }
}
@media screen and (max-width: 1200px) {
 #SideNav li {
  margin-left: 10px;
 }
}
@media screen and (max-width: 767px) {
 .pc_only {
  display: none;
 }
 .mb_only {
  display: block;
 }
 #SiteHeader {
  padding: 0 0 0 2vw;
  height: 70px
 }
 #SiteName {
  width: 65vw;
  padding: 5px 0;
  height: auto;
  display: flex;
  align-items: center;
 }
 #SiteName a {
  display: block;
  width: 100%;
  height: auto
 }
 #SiteName img {
  width: 100%;
  height: auto
 }
 #CorporateSite {
  padding: 0
 }
 #CorporateSite a {
  display: block;
  width: 70px;
  height: 70px;
  background: url("../img/header_link_sp.png") no-repeat center;
  background-size: 70px 70px;
 }
 #CorporateSite a:hover {
  background: url("../img/header_link_sp.png") no-repeat center;
 }
 footer div {
  display: block;
  padding: 50px 20px 10px;
 }
 footer img {
  margin: 0 auto 30px;
 }
 footer a {
  display: block;
  width: 170px;
  margin: 0 auto 30px;
 }
 small {
  text-align: center;
 }
 #ProgressNav, #ProgressNav.active {
  width: 100%;
  position: fixed;
  top: auto;
  bottom: 0;
  left: 0;
  z-index: 100;
  opacity: 1;
 }
 #ProgressNav ul {
  display: flex;
  justify-content: space-between;
  background: #ededed;
  height: 5px;
  width: calc(100% - 40px);
  margin: 0 auto 20px;
 }
 #ProgressNav ul li {
  margin-bottom: 0;
  margin-left: 0;
  flex: 1
 }
 #ProgressNav ul li a {
  background: #ededed;
  display: block;
  width: 100%;
  height: 5px;
  border-radius: 0;
 }
}