/* --------------------------------------------------------
page title
-------------------------------------------------------- */
/* ページタイトル部分 */
.page-title {
  text-align: center;
  margin: 40px auto 30px;
  padding: 0;
  border-top: 3px solid #00b5f6;
  border-bottom: 3px solid #00b5f6;
/*  background-color: #ffffff; */
  width: 90%;
  max-width: 640px;
}

/* タイトル画像 */
.page-title img {
  width: 320px;       /* PC用基本サイズ */
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
  /* フェードイン効果 */
  opacity: 0;
  transform: translateY(8px);
  animation: fadeInTitle 0.9s ease-out forwards;
}

/* フェードインアニメーション定義 */
@keyframes fadeInTitle {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* モバイル（〜480px）向け */
@media screen and (max-width: 480px) {
  .page-title {
    margin: 25px auto 20px;
    padding:0;
    border-top: 2px solid #00b5f6;
    border-bottom: 2px solid #00b5f6;
  }
  .page-title img {
    width: 280px; /* モバイル時は小さく */
  }
}


/* --------------------------------------------------------
global menu
-------------------------------------------------------- */
.header-wrap{background-color:#d3eef5;}
.w-icon-nav-menu{
width:48px;
height:48px;
background-image: url('../images/hamburger_menu.png?20251016');
background-size: 48px 48px;
}
.w-icon-nav-menu::before {
content: " ";
}
.menu,.menu-2,.menu-3,.menu-4,.menu-5{width:16.6%}
.menu-6{
display: block;
width:16.6%;
height: 100px;
float: left;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
background-image: url('../images/to_slogan202512.png');
background-position: 50% -10%;
background-size: 198px;
background-repeat: no-repeat;
background-attachment: scroll;
}
.menu-6:hover {
background-position: 50% 102%;
}

@media screen and (max-width: 991px) {
.menu-wrap {width: 98%;}
}

@media screen and (min-width: 1064px) {
.grid-3{width:100%;grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;}
}

/* --------------------------------------------------------
footer menu
-------------------------------------------------------- */
.footer-menu-6 {
height: 35px;
background-image: url('../images/to_slogan202512_2.png?20251016');
background-position: 50% 0%;
background-size: 130px;
background-repeat: no-repeat;
}
.footer-menu-6:hover {
background-position: 50% 100%;
}

/* --------------------------------------------------------
mobile menu
-------------------------------------------------------- */
/* webflowで注意 : モバイルメニューの最大高さを画面に収めるように */
/* 長すぎると見切れた部分は表示されない */
.w-nav{width:100%} /* モバイルMENUの横幅を横いっぱいに */

@media screen and (max-width: 479px) {
.slider {margin-top:0;} /* slideshow と header の間が空かないように */
}

/* モバイルメニューが開いたときにメニュー内の縦スクロールを有効にする */
@media screen and (max-width: 767px) {
.w-nav-menu { /* 縦長が短くメニューが表示しきれない場合にscrollbar表示 */
overflow-y: auto !important;
max-height: 100% !important; /* ビューポートではなく 100% にした */
box-sizing: border-box;      /* padding を含めて計算 */
-webkit-overflow-scrolling: touch;
}
.nav-menu-2 {
box-sizing:border-box;
width:100%;
/* background-color: #b9e0f3; */
background-color: #d3eef5;
border-bottom:1px solid #2c688f;
filter: drop-shadow(5px 5px 10px rgba(0, 0, 0, 0.5));
}
a.nab-link-text{
font-weight:600;
color: black;
text-shadow:
-1px -1px 0 white,
1px -1px 0 white,
-1px  1px 0 white,
1px  1px 0 white;
}
nav a.w-nav-link{padding:14px 20px;}
nav a.w-nav-link:first-child{padding-top: 8px;}
nav a.w-nav-link:last-child{padding-bottom: 24px;}
 .nab-link-text {border:none;}
}

/* --------------------------------------------------------
top page information
-------------------------------------------------------- */
ul.taglist {
width: 100%;
margin: 12px 0 0;
padding: 0;
list-style: none;
overflow: hidden;
}
ul.taglist > li {
box-sizing:border-box;
width:100%;
float: left;
/*  width: 20%; */
margin: 0 10px 16px 0;
padding: 0;
}
ul.taglist > li > a, ul.taglist li div.noref {
box-sizing: border-box;
display: block;
width: 100%;
height: 48px;
line-height: 40px;
padding: 6px 1em;
background-color: #ffffff;
/* border: 2px solid #6fd486; */
border-radius: 3px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
color:#0080ff;
/*  font-size: 13px;*/
text-decoration: none;
-webkit-transition: .2s;
transition: .2s;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
ul.taglist > li > a { /* for qa.html */
position:relative;
}
ul.taglist > li > a:after { /* for qa.html */
content: "";
position: absolute;
right: 12px;
top: 18px;
transition: all 0.2s ease-in-out;
width: 8px;
height: 8px;
/* border-top: solid 3px #2c688f;
border-left: solid 3px #2c688f; */
border-top: solid 3px #00b5f6;
border-left: solid 3px #00b5f6;
border-right: none;
border-bottom: none;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
}
ul.taglist > li {
box-sizing:border-box;
border-radius: 3px;
/* border: 2px solid #2c688f; */
border: 2px solid #00b5f6;
background-color:#ffffff;
font-weight:555;
}
ul.taglist > li a:hover {
/* background-color: #f8ce5b; */
color: #3498db;
}
ul.taglist > li > a.article-title {
position: relative;
padding-right: 32px;
white-space: normal;
line-height:1.4em;
height: auto;
min-height:48px;
padding:12px 32px 6px 12px;
/* color:#348ABA; */
color:#121212;
}
ul.taglist > li > a.article-title:hover {
/* background-color: #fff799; */
color: #0604ff;
}
ul.taglist > li > a.article-title:after {
content: "";
position: absolute;
right: 12px;
top: 32%;
transition: all 0.2s ease-in-out;
width: 8px;
height: 8px;
/* border-top: solid 3px #2c688f;
border-right: solid 3px #2c688f; */
border-top: solid 3px #00b5f6;
border-right: solid 3px #00b5f6;
border-left: none;
border-bottom: none;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
}
ul.taglist > li > a.article-title.open:after {
display:block;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
top: 45%;
}
ul.taglist > li.stretch {
width:100%;
}
.accordion-content {
display: none;
margin:12px 0 32px;
padding:0 12px 0;
box-sizing:border-box;
font-weight:normal;
/* URL等の英文字無改行対応 */
overflow-wrap: break-word;
word-wrap: break-word;
word-break: break-all;
white-space: normal;
}
.accordion-content > h4 {
position: relative;
font-size: 1.2rem;
margin: 0;
padding: 16px 0 8px 24px;
color: #820C0C;
}
.accordion-content a {
color:#0080ff;
}
.accordion-content img{max-width:96%;}
ul.taglist .sme-badge {
/* font-family: "Noto Sans JP", sans-serif; */
align-items: center;
border-radius: 6px !important;
color: #fff;
display: inline-flex;
font-size: calc(1em - 2px);
font-size: 12px;
font-weight: 700;
height: 1.8rem;
line-height: 1;
padding: 0 .5em;
transform: translateY(-2px);
vertical-align: middle;
white-space: nowrap;
}
ul.taglist .bl {background-color:#2560ea;}
ul.taglist .gr {background-color:#008c46;}
ul.taglist .rd {background-color:#cc0000;}
ul.taglist .yl {background-color:#fbc114;}
ul.taglist .dt {
display: inline-flex;
color:#333;
padding:0 12px;
font-size:14px;
font-family: 'Ubuntu Condensed', sans-serif;
}
ul.taglist .ttl {
display: inline-flex;
color:#121212;
font-weight:bold;
padding:0;
}


/* --------------------------------------------------------
fade-in contents
-------------------------------------------------------- */
#fade_in {
opacity: 0;
transition: opacity 1.5s ease; /* フェード時間：1.5秒 */
}
#fade_in.show {
opacity: 1;
}


/* --------------------------------------------------------
hours table
-------------------------------------------------------- */
table.timeTable{
width: 90%;
border-collapse: collapse;
border-spacing: 0;
margin: 0 0 10px 0;
}
table.timeTable tr th {
/*background-color: #3d8eae;
color: #ffffff;*/
color: #121212;
border-bottom: 1px solid #121212;
padding: 8px 3px;
font-family: "Noto Sans JP", sans-serif;
font-weight: bold;
text-align:center;
}
table.timeTable .footInfoTimeHead {
/*width: 8em;*/
width: 28%;
line-height: 1.3em;
white-space: nowrap;
}
table.timeTable .footInfoTimeHead div {
display: inline;
}
table.timeTable tr td {
background-color: #fff;
border-bottom: 1px solid #121212;
padding: 8px 3px;
text-align: center;
vertical-align: middle;
line-height: 2.0;
color: #121212;
}
table.timeTable tr td.day {
width: 12%;
font-family: "Noto Sans JP", sans-serif;
}
@media screen and (max-width: 767px){
.html-embed {
  font-size: 16px;
}
table.timeTable{width: 100%;margin: 0 auto 10px;}
}
table.timeTable.dispBig{max-width:600px;margin:0 auto 24px;}
@media screen and (max-width: 767px) {
table.timeTable.dispBig{max-width:400px;}
}


/* --------------------------------------------------------
questonaire
-------------------------------------------------------- */
@media screen and (max-width: 767px) {
.section-3 {padding-top: 0px;}
}
.q_content{
box-sizing:border-box;
width:100%;
max-width:1000px;
margin:0 auto 24px;
padding:12px;
text-align:left;
}
.q_index{
width: 100%;
box-sizing:border-box;
background: #0078d4;
margin:24px auto 12px;
padding: 0.5em;
line-height:1;
color:#fff;
font-weight:bold;
font-size:18px;
}
table.q_table{
max-width: 96%;
border-collapse: collapse;
border-spacing: 0;
margin:16px 0;
}
table.q_table tr th {
/*background-color: #3d8eae;
color: #ffffff;*/
color: #67603f;
border-bottom: 1px solid #736c4b;
padding: 8px 8px;
font-family: "Noto Sans JP", sans-serif;
font-weight: bold;
text-align:center;
}
table.q_table tr td {
background-color: #fff;
  border-bottom: 1px solid #736c4b;
  padding: 8px 3px;
  text-align: center;
  vertical-align: middle;
  line-height: 2.0;
  color: #121212;
}
table.q_table tr th.c2,table.q_table tr td.c2 {width:50%;}
table.q_table tr th.c3,table.q_table tr td.c3 {width:33%;}
table.q_table tr th.c4,table.q_table tr td.c4 {width:25%;}
table.q_table tr th.c5,table.q_table tr td.c5 {width:20%;}
table.q_table tr th.c6,table.q_table tr td.c6 {width:16.6%;}
table.q_table tr th.c7,table.q_table tr td.c7 {width:14.3%;}
table.q_table tr th,table.q_table tr td{min-width:120px; max-width:130px;}
table.q_table tr th.min80,table.q_table tr td.min80{min-width:80px;}
table.q_table tr th.nw,table.q_table tr td.nw {white-space: nowrap;}
table.q_table tr th.rdtl,table.q_table tr td.rdtl {border-right:1px dotted #736c4b;}
table.q_table tr th.rdbl,table.q_table tr td.rdbl {border-right:3px double #736c4b;}
@media screen and (max-width: 800px) {
table.q_table tr th,table.q_table tr td{min-width:auto; max-width:auto;}
table.q_table tr th,table.q_table tr td{font-size:14px;}
}
table.q_table .footInfoTimeHead div {
display: inline;
}

table.q_table tr td.day {
width: 12%;
font-family: "Noto Sans JP", sans-serif;
}
.table-scroll{
width: 100%;/* 画面幅にフィット */
margin:0;
padding:0;
overflow-x: auto;/* 横スクロールを有効化 */
-webkit-overflow-scrolling: touch; /* iOSでスムーズスクロール */
}



/* olのスタイル */
ol.num_list {
  margin: 24px 0 0;
  padding: 0;
  list-style: none; /* デフォルトの数字を非表示に */
  counter-reset: li;
}
/* ol内のliのスタイル */
ol.num_list li {
  position: relative;
  font-size: 15px;
  padding: 0 0 16px 28px;
  line-height: 1.5;
}
ol.num_list li b {
font-size: 17px;
line-height:1.3;
}
/* 2つ目以降のliにmargin-topを指定 */
ol.num_list li:not(:first-child) {
  margin-top: 0.5em;
}
/* 数字のスタイル */
ol.num_list li::before {
  counter-increment: li;
  content: counter(li);
  position: absolute;
  left: 0;
  top: 2px; /* 数字のY軸線上の位置を調整 */
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #0078d4;
  background-color: #fff;
border:1px solid #121212;
  font-size: 12px;
  color: #fff;
  color: #121212;
  line-height: 20px;
  text-align: center;
}
@media screen and (max-width: 800px) {
ol.num_list li {font-size:14px;}
ol.num_list li b{font-size:16px;}
}

div.review {
position : relative;
padding : 18px 10px;
margin : 20px auto;
width : 100%;
text-align :left;
background : #fff;
border:solid 2px #736c4b;
border-radius:8px;
}
.list_check {
padding: 0px;
margin: 0px;
list-style: none;
}
.list_check > li {
position: relative;
padding: 0px 0px 1em 1.8em;
margin: 0px;
/*  line-height: 1.6em; */
  line-height: 1.7em;
}
.list_check > li::before {
position: absolute;
left: 0;
font-family: "Font Awesome 5 Free";
font-weight: 900;
font-size:20px;
content: '\f4ad';
color: #0078d4;
}
/*
.list_check > li::before,
.list_check > li::after {
position: absolute;
top: 12px;
height: 1em;
content: "";
}
.list_check > li::before {
left: 0px;
transform: translateY(-50%);
width: 1em;
border: 1px solid #3388dd;
}
.list_check > li::after {
left: 0.5em;
transform: translateY(-75%) rotate(45deg);
width: 0.5em;
border-bottom: 3px solid #3388dd;
border-right: 3px solid #3388dd;
}
.list_check > li + li {
margin: 1em 0px 0px;
}
*/