@charset "utf-8";
/* CSS Document */

body , html , article , div , p , h1 , h2 , h3 , h4 , h5 , ul , li , table , tr , td , a , label , dl , dt , dd { box-sizing:border-box }
html {  scroll-behavior: smooth;  -webkit-text-size-adjust: 100%; }
*, *::before, *::after {  box-sizing: inherit;}
body {  margin: 0;  padding: 0;  font-family: system-ui, -apple-system, BlinkMacSystemFont,
               "Segoe UI", "Roboto", "Noto Sans JP", "Helvetica Neue",
               Arial, sans-serif;
  font-size: 16px;  line-height: 1.6;  color: #222;  background-color: #fff;
  -webkit-font-smoothing: antialiased;  text-rendering: optimizeLegibility;}
a {  color: inherit;  text-decoration: none;}
a:hover {  text-decoration: underline;}
img {  max-width: 100%;  height: auto;  vertical-align: middle;}
.footer{ background-color:#54b98b; display:flex;flex-flow: row wrap; padding:5px 5%;justify-content: flex-end; }
.footer a{ color:#FFF; background-repeat:no-repeat; display:block; padding:0 35px; text-decoration:none }
footer{ background-color:#606060; padding:20px 5%; color:#FFF; }
footer h1{ font-size:1.4em; line-height:1.6em; margin:0; padding:0}
footer h2{ font-size:0.8em; line-height:1.6em; margin:0; padding:0}
footer span{display: inline-block;} 
.main{ width:90%; max-width:1024px; margin:50px auto }
.subheader {  display: grid;  grid-template-columns: auto auto 1fr auto auto; width:100%;
  align-items: center;  column-gap: 20px;  padding: 10px 20px;  background-color:#47A9D9;}
.subheader .logo,
.subheader .logottl {  justify-self: start;  color: #fff;}
.logottl h3{ font-size:1.4rem; line-height:1.8rem; margin:0; padding:0  }
.logottl h4{ font-size:1.0rem; line-height:1.2rem; margin:0; padding:0; text-indent:10px  }
.button-group {  display: flex;  justify-content: space-between;  align-items: center;
  width: 100%;  margin-top: 10px;  gap: 2%;  flex-wrap: nowrap;}
.btn {  flex: 1;  padding: 10px 12px;  margin: 0 2px;  border-radius: 10px;  border: #FFF 3px solid;
  background-color:#444D5A;  color: #fff;  cursor: pointer;  font-weight: bold;  text-align: left;
  position: relative;  display: flex;  align-items: center;  justify-content: flex-start;  min-height: 45px;
  box-sizing: border-box;}
.btn a:hover { text-decoration:none}/* 追加1226 */
a.btn {
  background-color:#FFF100 !important;  border:#333 3px solid !important;min-height: 45px;
  color:#333;  text-decoration: none;  display: flex;  align-items: center;  justify-content: center;  }
.btn.modal1::before,
.btn.modal2::before,
.btn.modal3::before,
.btn.modal4::before,
.btn.modal5::before,
.btn.modal6::before {
  display: inline-block;  margin-right: 8px;  vertical-align: middle;  height: 20px;}
.btn.modal1::after,
.btn.modal2::after,
.btn.modal3::after {  content: '';  width: 12px;  height: 12px;  border: solid 2px #FFF;
  border-left: none;  border-top: none;  transform: rotate(45deg);  position: absolute;
  top: 50%;  right: 10px;  margin-top: -6px;}
a.btn:hover,
.btn:hover {  opacity: 0.9;}
.btn.modal5, .btn.modal6 { width:160px; justify-self: end;}
.btn.modal5 {  margin-left: auto; }
.btn.modal5 p, .btn.modal6 p { padding:5px 0 0 0 !important; margin:0 !important; }

/* 文頭アイコン */
.btn.modal1::before{ content: url(../img/search3.png);}
.btn.modal2::before{ content: url(../img/search4.png);}
.btn.modal3::before{ content: url(../img/search5.png);}
.btn.modal5::before{ content: url(../img/d-search.png);}
.btn.modal6::before{ content: url(../img/back.png);} 
.btn.modal4{ color:#444D5A; background:url(../img/search6.png) #FFF100 no-repeat 10px 10px; padding-left:50px }
/* 文末矢印アイコン */
.btn.modal1::after,
.btn.modal2::after,
.btn.modal3::after {
  content: '';  width: 13px;  height: 13px;  border: 0;
  border-bottom: solid 2px #FFFFFF;  border-right: solid 2px #FFFFFF;
  transform: rotate(45deg);  position: absolute;  top: 50%;  right: 10px;  margin-top: -6px;}
a.btn {  text-decoration: none;  display: flex;  align-items: center;}
a.btn:hover,
.btn:hover {  opacity: 0.9;}
.btn-download, .btn-form, .bt_select {border:#444D5A 3px solid;  border-radius: 10px; text-align:center; width:100%;
display:block; padding: 10px 20px; height:70px; line-height:30px; box-sizing: border-box;font-size:12px; }
.btn-download{ background-color:#47A9D9;  color:#FFF}
.btn-form{ }
.bt_dl_button, .bt_form {
  flex: 1;   display: flex;  flex-direction: column;  justify-content:center;  
  align-items: center;  cursor: pointer;  text-align: center;  padding: 5px; font-size:1.0em; } 
.bt_dl_button { color:#FFF;  background-color: #47A9D9; border-radius:10px; }
@media screen and (max-width:1024px) {
.subheader { padding-right:50px;}
.btn.modal5 { padding-right:60px; width:60px;  margin-left: auto;  }
.btn.modal6 { padding-right:20px; width:60px }
.btn.modal5 p, .btn.modal6 p { display:none }
}
@media screen and (max-width: 768px) {
  .button-group { flex-wrap: wrap;  gap: 5px;  }
  .btn { flex: 1 1 30%;  min-height: 45px;  }
  a.btn.modal4 {  flex: 1 1 100%;  align-self: flex-start;  }
.search{ position: relative; margin-top:10px }
.footer a{ padding:0 25px;  font-size:0.8em; line-height:1.2em; background-size:20px }
footer h1{ font-size:1.0em; line-height:1.2em;}
footer h2{ font-size:0.6em; line-height:1.2em;}
.logottl { padding-right:30px; }
  .btn { flex: 1 1 48%;  }
  a.btn { flex: 1 1 100%;  }
.logo { width:140px;  }
.btn.modal5, .btn.modal6 { display:none; }
.subheader .logottl { width:100%;  }
.subheader { grid-template-columns:120px auto ; }
.logottl h3{ font-size:1.0rem  }

}

@media screen and (max-width: 600px) {
  .button-group { display: grid;  grid-template-columns: 1fr 1fr; 
    grid-template-rows: repeat(3, auto); gap: 10px;  }
  .button-group .modal1 { grid-column: 1;  grid-row: 1; }
  .button-group .modal2 { grid-column: 1;  grid-row: 2; }
  .button-group .modal3 { grid-column: 1;  grid-row: 3; }
  .button-group .modal4 { grid-column: 2;  grid-row: 3; display: flex;
    align-items: center; justify-content: center; }
  .button-group .btn { width: 100%; box-sizing: border-box;  min-height: 45px;
    text-align: center; justify-content: center; }
	.btn {  padding-left:0; justify-content: flex-start;}
.btn.modal1::before,
.btn.modal2::before,
.btn.modal3::before,
.btn.modal4::before {  margin-right: 6px; }
}
@media screen and (max-width: 425px) {
.search {  padding: 10px 15px;  bottom: 10px;  }
.button-group {  flex-direction: column;  gap: 5px;  }
.search3 , .search4 , .search5 , .search6 { width:100%;}
.search2 { text-align:left;}
footer h1{ font-size:16px; line-height:22px}
footer h2{ font-size:14px; line-height:18px}
.btn, a.btn {  flex: 1 1 100%; }
.logo { width:100%;  }
.bt_dl , .bt_form{ font-size:12px }
}
@media screen and (max-width: 350px) {
}
.header__inner {  display: flex;  justify-content: space-between;  align-items: center;
  padding: 1rem;  background: #fff;  box-shadow: 0 2px 6px rgba(0,0,0,0.05);}
.hamburger,
.nav {  display: none;}  
@media (max-width: 1024px) {
  .hamburger {    display: flex;    flex-direction: column;    justify-content: space-between;
    width: 40px;    height: 20px;    background: none;    border: none;    cursor: pointer;
    position: fixed;     top: 1rem;    right: 1rem;    z-index: 100;   }
  .hamburger__line {    width: 100%;    height: 3px;    background:#FFF;    border-radius: 3px;
    transition: transform 0.3s ease, opacity 0.3s ease;  }
  .hamburger.is-active .hamburger__line:nth-child(1) {    transform: translateY(8px) rotate(45deg);  }
  .hamburger.is-active .hamburger__line:nth-child(2) {    opacity: 0;  }
  .hamburger.is-active .hamburger__line:nth-child(3) {    transform: translateY(-8px) rotate(-45deg);  }
  .nav {    display: flex;    position: fixed;    inset: 0;    background: rgba(51,153,204,0.8);
    justify-content: center;    align-items: center;    opacity: 0; z-index: 90;
    transform: scale(0.95);    pointer-events: none;   transition: opacity 0.3s ease, transform 0.3s ease;}
.nav__item::before {content: ">";  color: #fff;  margin-right: 0.4rem;
  font-size: 0.7em;  transform: rotate(10deg);   display: inline-block;  vertical-align: middle;}
  .nav.is-active {    opacity: 1;    transform: scale(1);    pointer-events: auto;  }
  .nav__list {list-style: none; display: flex; flex-direction: column; gap: 1.5rem; margin: 0; padding: 0;}
  .nav__link {color: #fff;  font-size: 1.2rem; font-weight: 600;  text-decoration: none;  }
  .nav__link:hover {  text-decoration: underline;  }
}
body.is-locked {  overflow: hidden;}
