ul { list-style-type: none; }
.nwk5 { position: relative; margin: 0px auto; padding: 50px 0px 0px; width: 98%; max-width: 1120px; background-color: #ffffff; }
.nwk6 { position: relative; margin: 0px auto; padding: 30px 0px; width: 96%; max-width: 1030px; }
#h2cap { position: relative; width: 100%; }
h2 { position: absolute; top: -40px; left: 50%; margin: 0px; padding: 0px; width: 80%; max-width: 330px; font-size: 1rem; line-height: 100%; z-index: 25; transform: translateX(-50%); }
h2 img { width: 100%; opacity: 0; transform: translateY(20px); transition-duration: 1s; }
.msg01 { margin: 0px auto; padding: 5px 0px; width: 96%; max-width: 1000px; flex-flow: wrap; justify-content: space-between; }
.msg01 h3 { margin: 0px; padding: 0px; width: 90px; height: 90px; text-align: center; font-size: 0.944rem; line-height: 90px; font-weight: normal; display: none; }
.infobx { margin: 0px auto; padding: 17px 0px 0px; width: 96%; flex-flow: wrap; justify-content: space-between; align-items: flex-start; }
.infobx h3 { margin: 0px; padding: 5px 0px 3px; width: 100%; text-align: center; font-size: 0.9rem; line-height: 100%; font-weight: normal; }
.infobx .infoz { padding: 6px 0px 0px; flex-basis: 100%; box-sizing: border-box; }
.infobx .rgt { padding: 15px 0px 0px; text-align: right; font-size: 0.9rem; line-height: 100%; }
#topinfoz1 { margin: 0px; padding: 3px 0px 0px; }
#topinfoz1 li { margin: 0px; padding: 0px; border-bottom: 1px dashed #777777; }
#topinfoz1 a { position: relative; display: block; padding: 0px 0px 0px 16px; width: 100%; text-decoration: none; flex-flow: wrap; box-sizing: border-box; }
#topinfoz1 a::before { content: ""; position: absolute; top: 21px; left: 5px; width: 0px; height: 0px; border-width: 6px; border-style: solid; border-color: transparent transparent transparent #333333; }
#topinfoz1 a .bold { padding: 19px 0px 0px; width: 92px; font-size: 0.83rem; line-height: 125%; display: none; }
#topinfoz1 a .mo { flex: 1 1 0%; padding: 15px 0px 12px; font-size: 1rem; line-height: 150%; }
#calendar { margin: 20px auto 0px; width: 100%; max-width: 360px; }
.cldrv { text-align: center; line-height: 100%; padding: 10px; border: 1px solid #999999; }
.cldrv > div:first-of-type { position: relative; margin: 0px 0px 10px; padding: 2px 0px 1px; font-size: 0.8rem; line-height: 100%; }
.cldrv img { position: absolute; top: 2px; opacity: 0.5; cursor: pointer; }
.cldrv img:first-of-type { left: 0px; }
.cldrv img:last-of-type { right: 0px; }
.cldrv table { width: 100%; border: 0px; font-size: 0.8rem; line-height: 100%; }
.cldrv th { border-bottom: 1px solid #cccccc; font-weight: normal; }
.cldrv td { padding: 2px; width: 14%; border: 0px; box-sizing: border-box; }
.cldrv .yd { width: 15%; background-color: #eeeeee; }
.cldrv td div { padding: 3px 0px; }
.cldrv td div.v1 { background-repeat: no-repeat; background-position: center center; background-image: url("/hpdata/bg/6.png"); }
.cldrv ul { margin: 0px; padding: 10px 0px 0px; text-align: left; list-style-type: none; font-size: 0.76rem; line-height: 100%; display: flex; flex-flow: wrap; justify-content: flex-start; }
.cldrv li { position: relative; display: inline-block; margin: 0px 0px 0px 5px; padding: 1px 0px 0px 18px; }
.cldrv li::after { content: ""; position: absolute; top: 0px; left: 0px; width: 13px; height: 13px; background-repeat: no-repeat; background-position: center center; background-image: url("/hpdata/bg/6.png"); }
.bnrz { margin: 0px; padding: 20px 0px 0px; width: 100%; display: flex; flex-flow: wrap; justify-content: space-between; align-items: flex-start; box-sizing: border-box; }
.bnrz li { margin: 15px 0px 0px; padding: 0px; border: 1px solid #999999; flex-basis: 48%; box-sizing: border-box; }
.bnrz img { width: 100%; }
.hata3 { position: relative; margin: 0px auto; width: 85%; max-width: 500px; }
.hata3 img { position: absolute; bottom: -9px; right: 20px; width: 20%; max-width: 70px; z-index: 3; }
.hata3 h3 { position: relative; margin: 0px; padding: 0px 30px; width: 100%; text-align: center; font-size: 1rem; line-height: 30px; font-weight: normal; box-sizing: border-box; }
.hata3 h3::before, .hata3 h3::after { position: absolute; top: 0px; width: 30px; height: 30px; background-color: #ffffff; content: ""; transform: rotate(-45deg); }
.hata3 h3::before { left: -20px; }
.hata3 h3::after { right: -20px; }
.sbcolor .hata3 h3::before, .sbcolor .hata3 h3::after { background-color: #06375f; }
.jrei { margin: 0px; padding: 5px 0px; width: 100%; list-style-type: none; text-align: center; display: flex; flex-flow: wrap; justify-content: space-between; }
.jrei li { flex-basis: 48%; margin: 30px 0px 0px; padding: 0px; }
.jrei a { display: block; width: 100%; text-decoration: none; }
.jrei .pht { position: relative; width: 100%; height: 0px; padding-bottom: 66.7%; }
.jrei .pht div { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
.jrei .pht img { width: 100%; height: 100%; object-fit: cover; }
.jrei h4 { margin: 0px; padding: 12px 0px 2px; font-size: 1rem; line-height: 150%; font-weight: normal; }
.jrei p { font-size: 0.88rem; line-height: 150%; color: #7ac3f4; }
.jrei div.ud { padding: 6px 0px 0px; font-size: 0.66rem; line-height: 100%; opacity: 0.8; }
.bun02 { margin: 0px auto; padding: 30px 0px 0px; width: 100%; max-width: 860px; }
.cntrbnr { margin: 0px auto; padding: 40px 0px 50px; width: 96%; max-width: 560px; }
.cntrbnr a { position: relative; display: block; width: 100%; border: 1px solid #777777; box-sizing: border-box; }
.cntrbnr a::before { content: ""; position: absolute; top: 50%; right: 5px; width: 0px; height: 0px; border-width: 7px; border-style: solid; border-color: transparent transparent transparent #06375f; transform: translateY(-50%); }
.cntrbnr img { width: 100%; max-width: 558px; }
.prd { margin: 0px auto; padding: 5px 0px 0px; width: 96%; max-width: 1200px; display: flex; flex-flow: wrap; justify-content: space-between; }
.prd li { position: relative; margin: 20px 0px 0px; padding: 5px 5px 45px; flex-basis: 49%; border: 1px solid #cccccc; box-sizing: border-box; }
.prd li a.pht { position: relative; display: block; width: 100%; }
.prd li h4 { position: absolute; bottom: 0px; left: 0px; margin: 0px; padding: 5px 0px 3px; width: 100%; font-size: 0.944rem; line-height: 125%; text-align: center; background-color: rgba(0, 0, 0, 0.5); color: #ffffff; font-weight: normal; }
.prd li img { width: 100%; }
.prd li p { padding: 10px 5px 0px; font-size: 0.83rem; line-height: 180%; }
.prd li a.btn02 { position: absolute; bottom: 15px; left: 50%; width: 90%; max-width: 138px; padding: 3px 0px; text-align: center; font-size: 0.86rem; line-height: 100%; text-decoration: none; transform: translateX(-50%); }
.prd li a.btn02::before { content: ""; position: absolute; top: 50%; right: 5px; width: 0px; height: 0px; border-width: 5px; border-style: solid; border-color: transparent transparent transparent #ffffff; transform: translateY(-50%); }
.prd .red { color: #dd3300; }
.bnrz2 { margin: 0px auto; padding: 20px 0px 50px; width: 96%; max-width: 690px; flex-flow: wrap; justify-content: space-between; }
.bnrz2 li { margin: 20px 0px 0px; padding: 0px; flex-basis: 48%; max-width: 400px; border: 1px solid #999999; }
.bnrz2 li a { display: block; width: 100%; }
.bnrz2 img { width: 100%; max-width: 330px; }
.notoppad { padding-top: 15px; }
.blog { margin: 0px; padding: 0px; width: 100%; list-style-type: none; display: flex; flex-flow: wrap; justify-content: space-between; }
.blog li { flex-basis: 48%; margin: 20px 0px 0px; padding: 0px; }
.blog a { display: block; width: 100%; text-decoration: none; }
.blog .pht { position: relative; width: 100%; height: 0px; padding-bottom: 66.6%; }
.blog .pht div { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
.blog .pht img { width: 100%; height: 100%; object-fit: cover; }
.blog h4 { margin: 0px; padding: 12px 0px 6px; font-size: 1rem; line-height: 175%; color: #53471d; }
.blog p { font-size: 0.9rem; line-height: 175%; color: #333333; display: none; }
.btn03 { position: relative; display: block; margin: 30px auto 0px; padding: 15px 0px; width: 100%; max-width: 350px; text-align: center; text-decoration: none; line-height: 100%; border: 1px solid #06375f; box-sizing: border-box; }
.btn03::before { content: ""; position: absolute; top: 50%; right: 5px; width: 0px; height: 0px; border-width: 5px; border-style: solid; border-color: transparent transparent transparent #06375f; transform: translateY(-50%); }
.sbcolor .btn03 { border-color: rgba(255, 255, 255, 0.5); }
.sbcolor .btn03::before { border-left-color: #ffffff; }
.bun01 { padding: 20px 0px 0px; }
.bgcolor1 { background-color: #f9f5ea; }
.bun03 { margin: 0px auto; padding: 5px 0px 0px; width: 100%; max-width: 860px; }
.hx02 { margin: 0px auto; padding: 0px; width: 90%; max-width: 409px; font-size: 1rem; line-height: 100%; }
.books { padding: 0px; flex-flow: wrap; justify-content: space-between; }
.books .pht img { margin: 0px auto 30px; width: 100%; max-width: 236px; }
.books .bun { flex: 1 1 0%; box-sizing: border-box; }
.books h3 { margin: 0px 0px 15px; padding: 0px 0px 10px; font-size: 1.4rem; line-height: 110%; font-weight: normal; text-align: center; color: #e0d463; border-bottom: 1px solid rgba(224, 212, 99, 0.7); }
.books h3 span.sml { font-size: 0.9rem; }
.books h3 br { display: none; }
.books .clearfix img { float: right; margin: 0px 0px 0px 20px; width: 111px; display: none; }
.prs { padding: 20px 0px 0px; flex-flow: wrap; justify-content: space-between; }
.prs .pht { margin: 15px auto 0px; width: 100%; max-width: 400px; font-size: 0.94rem; line-height: 150%; text-align: center; }
.prs .pht img { margin: 0px 0px 8px; width: 100%; }
.bnrbx1 { margin: 0px auto; padding: 20px 0px 0px; list-style-type: none; width: 100%; max-width: 1000px; flex-flow: wrap; justify-content: space-between; }
.bnrbx1 li { margin: 20px 0px 0px; padding: 0px; flex-basis: 49%; border: 1px solid #999999; box-sizing: border-box; }
.lnks { padding: 40px 0px 0px; flex-flow: wrap; justify-content: space-between; align-items: flex-start; }
.lnks .pht { margin: 0px auto 20px; width: 238px; font-size: 0.94rem; line-height: 150%; text-align: center; border: 1px solid #999999; }
.lnks .hata { margin: 0px; padding: 0px 60px 0px 45px; }
.lnks .hata::before { display: none; }
.lnks .bun > div { padding: 10px 20px 20px; border: 1px solid #999999; }
.lnks .bun ul { margin: 0px; padding: 0px; list-style-type: none; width: 100%; font-size: 0.94rem; line-height: 100%; display: flex; flex-flow: wrap; justify-content: flex-start; }
.lnks .bun li { position: relative; margin: 20px 25px 0px 0px; padding: 0px 0px 0px 18px; }
.lnks .bun li::before { position: absolute; content: ""; top: 1px; left: 0px; width: 14px; height: 14px; border-radius: 50%; }
.nn1 { display: none; }
.hosok { margin: 0px auto; padding: 20px 0px 0px; list-style-type: none; width: 100%; max-width: 760px; font-size: 0.944rem; line-height: 100%; flex-flow: wrap; justify-content: space-between; text-align: center; }
.hosok li { position: relative; margin: 10px 0px 0px; padding: 0px; flex-basis: 31%; border: 1px solid #888888; box-sizing: border-box; }
.hosok li a { display: block; width: 100%; padding: 16px 0px 14px; text-decoration: none; }
.hosok li::before { content: ""; position: absolute; top: 50%; right: 5px; width: 0px; height: 0px; border-width: 5px; border-style: solid; border-color: transparent transparent transparent #06375f; transform: translateY(-50%); }
.nwk7 { margin: 0px auto; padding: 30px 0px; width: 96%; max-width: 1140px; }
.picz { padding: 5px 0px; flex-flow: wrap; justify-content: space-between; }
.picz .pht { margin: 20px 0px 0px; flex-basis: 46%; }
.picz .bun { margin: 20px 0px 0px; flex-basis: 50%; font-size: 0.9rem; line-height: 225%; }
.picz .bun h4 { margin: 0px 0px 1px; padding: 5px 0px; font-size: 1.2rem; line-height: 175%; }
.picz .bun ul { margin: 0px; padding: 5px 0px 0px; list-style-type: none; display: flex; flex-flow: wrap; justify-content: space-between; }
.picz .bun li { margin: 20px 0px 0px; padding: 0px; flex-basis: 32.5%; }
.picz .bun li img { width: 100%; }
.btn a { position: relative; display: block; margin: 18px 0px 0px; padding: 7px 0px 5px; width: 100%; text-align: center; text-decoration: none; color: #ffffff; font-size: 0.9rem; line-height: 100%; }
.btn a::before { content: ""; position: absolute; top: 50%; right: 5px; width: 0px; height: 0px; border-width: 6px; border-style: solid; border-color: transparent transparent transparent #ffffff; transform: translateY(-50%); }
.cvkhbx { position: relative; margin: 20px auto 30px; padding: 15px; width: 94%; max-width: 1030px; border: 1px solid #999999; font-size: 0.944rem; line-height: 225%; box-sizing: border-box; display: none; }
.cvkhbx .bun .pht { float: left; margin: 10px 30px 5px 0px; width: 45%; max-width: 277px; }
.cvkhbx .bun .pht img { width: 100%; }
.cvkhbx .btn a { margin: 22px 0px 0px auto; padding: 7px 0px; }
.covrkj { margin: 0px auto; padding: 30px 0px 10px; }
.cktz { position: relative; width: 100%; max-width: 450px; }
.cktz > div { position: relative; width: 100%; height: 0px; padding-bottom: 16%; }
.cktz img { position: absolute; }
.cktz .ckt1 { bottom: 0px; left: 0px; width: 74%; }
.cktz .ckt2 { top: 5%; left: 0px; width: 38%; }
.cktz .ckt3 { bottom: 0px; right: -4%; width: 29%; }
.ckt4 { padding: 20px 0px 10px; font-size: 1.1rem; line-height: 150%; }
@media print, screen and (min-width: 400px) {
  .cvkhbx { padding: 20px; }
  .btn a { width: 200px; }
}
@media screen and (min-width: 420px) and (max-width: 599px) {
  h2 { width: 85%; }
}
@media print, screen and (min-width: 460px) {
  .nwk5 { padding-top: 40px; }
  #topinfoz1 { padding-top: 10px; }
  #topinfoz1 li:first-of-type { border-top: 1px dashed #777777; }
  #h2cap { height: 5px; }
  .prd, .books { display: flex; }
  .blog { padding-bottom: 20px; }
  .blog p { display: block; }
  .blog li { margin: 30px 0px 0px; }
  .books .pht { width: 30%; }
  .books .pht img { margin: 0px; }
  .books .bun { padding: 0px 0px 0px 50px; }
  .books h3 { padding: 0px 0px 15px; text-align: left; font-size: 1.7rem; line-height: 110%; }
  .books h3 br { display: inline; }
  .books .btn03 { margin-left: 0px; }
}
@media print, screen and (min-width: 501px) {
  .cktz .ckt1 { bottom: 3%; left: 0px; width: 68%; }
  .cktz .ckt3 { bottom: 0px; right: 0px; width: 31%; }
  .ckt4 { font-size: calc(0.01rem + 3vw); line-height: 150%; }
  .covrkj { display: none; }
  .cvkhbx { display: block; }
}
@media print, screen and (min-width: 580px) {
  .infobx { display: flex; }
  #calendar { margin: 20px 0px 0px; width: 40%; }
  .bnrz { width: 57%; }
}
@media print, screen and (min-width: 600px) {
  #h2cap { height: 12px; }
  h2 { width: 80%; }
  .msg01, .hosok { display: flex; }
  .msg01 h3 { display: block; }
  .msg01 div { flex: 1 1 0%; padding: 0px 0px 0px 30px; box-sizing: border-box; }
  .infobx h3 { display: none; }
  #topinfoz1 a { display: flex; }
  #topinfoz1 a { padding: 0px 0px 0px 24px; }
  #topinfoz1 a::before { left: 8px; }
  #topinfoz1 a .bold { display: block; }
  .books h3 { font-size: 2rem; line-height: 100%; }
  .books .pht { width: 236px; }
  .bnrbx1 { display: flex; }
  .bnrbx1 li { max-width: 487px; }
  .bnrz2 { display: flex; }
  .nn1 { display: inline; }
  .jrei li, .blog li { flex-basis: 23%; max-width: 234px; }
  .jrei li img, .blog li img { max-width: 234px; }
  .jrei { padding: 20px 0px; }
}
@media print, screen and (min-width: 680px) {
  .nwk5 { padding-top: 30px; }
  .prs, .lnks, .picz { display: flex; }
  .picz { padding: 20px 0px; }
  .picz .bun h4 { font-size: 1rem; display: none; }
  .picz .bun ul2222 { display: none; }
  .prs .bun { flex: 1 1 0%; padding: 0px 20px 0px 0px; box-sizing: border-box; }
  .prs .pht { margin: 15px 0px 0px; width: 35%; max-width: 300px; }
  .lnks .pht { margin: 0px; }
  .lnks .bun { flex: 1 1 0%; padding: 0px 0px 0px 40px; box-sizing: border-box; }
  .books h3 br { display: none; }
  .prd li { padding: 5px 5px 55px; }
  .hata3 h3 { font-size: 1.2rem; line-height: 40px; }
  .hata3 h3::before, .hata3 h3::after { width: 40px; height: 40px; }
  .hata3 img { right: 32px; max-width: 80px; }
}
@media print, screen and (min-width: 730px) {
  .picz .bun li { max-width: 175px; }
}
@media print, screen and (min-width: 768px) {
  .nwk6, .nwk7 { padding: 50px 0px; }
  .notoppad { padding-top: 15px; }
  .infobx { width: 100%; }
  .infobx .infoz { flex: 1 1 0%; padding-left: 2%; padding-right: 20px; }
  #calendar { margin: 0px 2% 0px 0px; width: 28%; max-width: 270px; }
  #topinfoz1 a .mo { font-size: 0.9rem; line-height: 150%; }
  .bnrz { width: 100%; padding: 20px 0px; }
  .bnrz li { flex-basis: 24%; max-width: 268px; }
  .prd li { flex-basis: 24%; }
  .prd li img { max-width: 276px; }
  h2 { max-width: 385px; }
  .cvkhbx { padding-left: 340px; }
  .cvkhbx .bun .pht { float: none; margin: 0px; position: absolute; top: 20px; left: 20px; width: 277px; }
  .ckt4 { font-size: 1rem; line-height: 150%; }
}
@media print, screen and (min-width: 850px) {
  .nwk5 { padding-top: 20px; }
  #topinfoz1 a .bold { width: 100px; }
  .books .clearfix img { display: block; }
  .picz .bun h4 { display: block; font-size: 1rem; }
  .picz { padding: 30px 0px; }
}
@media print, screen and (min-width: 900px) {
  .nwk5 { padding-top: 15px; }
  .infobx .infoz { padding-right: 50px; }
  .prs .pht { width: 300px; }
  .prs .bun { flex: 1 1 0%; padding-right: 50px; }
  .books h3 span.sml { font-size: 1rem; }
}
@media print, screen and (min-width: 960px) {
  .prd { padding-top: 15px; }
  .prd li p { padding: 15px 15px 0px; }
  .picz .bun { font-size: 1rem; line-height: 225%; }
}
@media print, screen and (min-width: 1020px) {
  #topinfoz1 a .mo { font-size: 1rem; line-height: 150%; }
  .ckt4 { font-size: 1.3rem; line-height: 150%; }
  .picz .bun h4 { font-size: 1.3rem; }
}