@charset "UTF-8";

/****************************************************************************************************************************/
/*
/*
/* = Satelite 20260401UP
/*
/*
/****************************************************************************************************************************/
/*
/* = Common
/*
/* ---------------------------------------------------------------------------------------------------------------------- */
/* visual */
.inner-wrapper .visual-inner h2{line-height: 1.4; }
.inner-wrapper .visual-inner h2 small{ display: block; }
@media screen and (max-width: 767px) {
  .inner-wrapper .visual-inner h2{font-size: 2.4rem; }
  .inner-wrapper .visual-inner h2 small{font-size: 1.6rem; }
}
/* main-side */
.main-side .side-nav--satellite{ padding: 0; }
.main-side .side-nav--satellite > li{ line-height: 1.2; }
.main-side .side-nav--satellite > li > ul{ padding:0; background-color: rgba(0, 153, 255, 1); border-top: 1px solid rgba(255,255,255,1); }
.main-side .side-nav--satellite > li > ul > li{}
.main-side .side-nav--satellite > li > ul > li + li{ border-top: 1px dotted rgba(255,255,255,1); }
.main-side .side-nav--satellite > li > ul > li > a,
.main-side .side-nav--satellite > li > ul > li > span{ position: relative; display: block; padding: 1em 2.4em 1em 0.8em; color: rgba(255,255,255,1); }
.main-side .side-nav--satellite > li > ul > li > a::before{ position: absolute; right: 0.8em; top: 50%; display: block; content: ""; transform: translateY(-50%) rotate(45deg); width: 8px; height: 8px; border-top: 1px solid rgba(255,255,255,1); border-right: 1px solid rgba(255,255,255,1);}
.main-side .side-nav--satellite > li > ul > li > a > small{ display: block; }
.main-side .side-nav--satellite > li > ul > li.item--application > a{ background-color: #DA9B2D; }
.main-side .side-nav--satellite > li > ul > li > ul{ padding:0 10px 10px 10px;}
.main-side .side-nav--satellite > li > ul > li > ul > li{ background-color: rgba(255,255,255,1);}
.main-side .side-nav--satellite > li > ul > li > ul > li + li{ border-top: 1px solid rgba(204, 204, 204, 1); }
.main-side .side-nav--satellite > li > ul > li > ul > li > a{ position: relative; display: block; padding: 0.8em 0.8em 0.8em 2.4em;}
.main-side .side-nav--satellite > li > ul > li > ul > li > a > small{ display: block; }
.main-side .side-nav--satellite > li > ul > li > ul > li > a::before{ position: absolute; left: 0.8em; top: 50%; transform: translateY(-50%); }
.main-side .side-doctors{ margin-top: 20px; margin-bottom:20px; }
.main-side .side-satellite { display: none; }

/* main parts */
.list--num02{ padding-left: 1.5em; list-style-type: decimal;}

.list--tbl{}
.list--tbl span{ display: inline-block; position: relative;}
.list--tbl span::after{ position: absolute; right: 0; content: "：";}
.list--tbl.list--th3 span{ width: 3em; }
.list--tbl.list--th4 span{ width: 4em; }
.list--tbl.list--th5 span{ width: 5em; }
.list--tbl.list--th6 span{ width: 6em; }
.list--tbl.list--th7 span{ width: 7em; }
.list--tbl.list--th8 span{ width: 8em; }
.list--tbl.list--th9 span{ width: 9em; }

.fig--basic{}
.fig--basic figcaption{ margin-top: 0.5em;}

.mailaddress::after{
  content: "@fukushimas.johas.go.jp";
}
.telnumber{
  font-size: 1.4em;
  font-weight: bold;
}

.btn--link{
  position: relative;
  display: inline-block;
  padding: 1em 2.4em 1em 1.6em;
  background-color: rgba(0, 153, 255, 1); 
  color: rgba(255,255,255,1) !important;
}
.btn--link::before{ 
  position: absolute; 
  right: 0.8em; 
  top: 50%; 
  display: block; 
  content: ""; 
  transform: translateY(-50%) rotate(45deg); 
  width: 8px; 
  height: 8px; 
  border-top: 1px solid rgba(255,255,255,1); 
  border-right: 1px solid rgba(255,255,255,1);
  transition: 0.3s;
}
.btn--link:hover::before{ 
  right: 0.6em; 
}

/*
/* = Section
/*
/* ---------------------------------------------------------------------------------------------------------------------- */

/* = intoro
/* ---------------------------------------------------------------------------------------------------------------------- */
.intoro{}
.intoro-txt{}

/* = topics
/* ---------------------------------------------------------------------------------------------------------------------- */
.topics{}
.topics-ttl .btn{ position:absolute; right:15px; top:0; bottom:0; width:110px; height:30px; line-height:30px; margin-top:auto; margin-bottom:auto; font-size:1.3rem; }
.topics-ttl .ico::before{ color:rgba(0,178,236,1); }
.topics-list{}


/* = advice
/* ---------------------------------------------------------------------------------------------------------------------- */
.advice{}
/* TOP */
.advice-dtl{}
.advice-dtl .topic_release_date{margin-top: 1em; text-align: right;}
.advice-btn{ margin-top: 30px; text-align: right;}
.advice-btn a{ padding: 1em 1.5em; }
.advice-btn a span::before{ margin-right: 0.5em; color: rgba(255,255,255,1);}
/* アーカイブ */
.advice-list{}
.advice-list li{ }
.advice-list li + li{ margin-top: 0.5em;}
.advice-list li a{ position: relative; display: block;  border:1px solid rgba(0,153,255,1); height: 100%; padding:0.5rem 2.5rem 0.5rem 1rem ; }
.advice-list li a::after{position: absolute; top:0; bottom: 0; right: 10px; margin: auto; height: 20px; }
.advice-list li a span{ display: inline-block; }
.advice-list li a span.date{ margin-right: 1em;}
.advice-list li a span.title{}
.advice-list li a span.new{ margin-left: 1em;padding: 0 0.5rem; background-color: rgba(250,15,0,1); font-size: 1.0rem; color: rgba(255,255,255,1); text-align: center; text-transform:uppercase;}
.advice-pager{ margin-top: 30px; display: flex; flex-wrap: nowrap; flex-direction: row; justify-content: center; align-items: center;}
.advice-pager .pagination{ display: flex; flex-wrap: nowrap; flex-direction: row; justify-content: center; align-items: stretch; border:1px solid rgba(0,153,255,1); }
.advice-pager .pagination li{}
.advice-pager .pagination li + li{ border-left: 1px solid rgba(0,153,255,1);}
.advice-pager .pagination li span{ color: rgba(204,204,204,1);}
.advice-pager .pagination li.page span,
.advice-pager .pagination li.page a,
.advice-pager .pagination li.prev span,
.advice-pager .pagination li.prev a,
.advice-pager .pagination li.next span,
.advice-pager .pagination li.next a,
.advice-pager .pagination li:not([class]) span{ display: flex; flex-direction: row; justify-content: center; align-items: center; width: 3em; aspect-ratio: 1/1; font-size: 0.9em; }
.advice-pager .pagination li.page.active span{ background-color: rgba(0,153,255,1); color: rgba(255,255,255,1); }
@media screen and (max-width: 767px) {
.schedule-list--scroll{ overflow-x: scroll;}
.schedule-list--scroll_inner{ min-width: 780px; }
.advice-pager .pagination li.page{ display: none;}
.advice-pager .pagination li.page.active, 
.advice-pager .pagination li.page.first, 
.advice-pager .pagination li.page.last{ display: block !important;}
}

/* = information
/* ---------------------------------------------------------------------------------------------------------------------- */
.information{}
.information-panel{ margin-bottom: 30px; }
.information-name{ display: flex; flex-direction:column; align-items: flex-end; justify-content: flex-start;}



/* = outline
/* ---------------------------------------------------------------------------------------------------------------------- */
.outline{}


/* = schedule
/* ---------------------------------------------------------------------------------------------------------------------- */
.schedule{}
.schedule-ttl{}
.schedule-txt{ margin-bottom: 30px; }
.schedule-list{}

/* 通常HTMLの場合　*/
.schedule-list--thead{ background-color: rgba(172,211,240,1); }
.schedule-list--tbody{ }
.schedule-list--tr{ display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: stretch;}
.schedule-list--thead .schedule-list--tr .month,
.schedule-list--thead .schedule-list--tr .day,
.schedule-list--thead .schedule-list--tr .place,
.schedule-list--tbody .schedule-list--tr .month,
.schedule-list--tbody .schedule-list--tr .day ul li,
.schedule-list--tbody .schedule-list--tr .place ul li{ padding: 0.8em; border-bottom:1px solid rgba(204,204,204,1); }
.schedule-list--tr .month{ width: 120px; text-align: center; }
.schedule-list--tr .day{ width: 80px; text-align: center; border-left: 1px solid rgba(204,204,204,1); }
.schedule-list--tr .place{ width:calc(100% - (120px + 80px)); border-left: 1px solid rgba(204,204,204,1); }
.schedule-list--thead .schedule-list--tr .place{ text-align: center; }
.schedule-list--tbody .schedule-list--tr .month{ background-color:rgba(238,238,238,1); }
@media screen and (max-width: 767px) {
.schedule-list--scroll{ overflow-x: scroll;}
.schedule-list--scroll_inner{ min-width: 780px; }
}

/* プラグイン利用の自動出力用CSS */
.schedule-list--thead .date,
.schedule-list--thead .venue{  padding: 0.8em; border-bottom:1px solid rgba(204,204,204,1); text-align: center; }
.schedule-list--thead .date{  width: 200px;  }
.schedule-list--thead .venue{  width: calc(100% - 200px); border-left: 1px solid rgba(204,204,204,1);  }
.schedule-list--tbody .topiclist { width: 100%; }
.schedule-list--tbody .topiclist td{ padding: 0.8em; border-bottom:1px solid rgba(204,204,204,1); }
.schedule-list--tbody .topiclist td.date{ width: 200px; }
.schedule-list--tbody .topiclist td.title{ width: calc(100% - 200px); border-left: 1px solid rgba(204,204,204,1); }
.schedule-list--tbody .topiclist td.title a{ color: rgba(0, 134, 223, 1); }
@media screen and (max-width: 767px) {
.schedule-list--tbody .topiclist td{ display: table-cell; } 
}
/* = seminar
/* ---------------------------------------------------------------------------------------------------------------------- */
.seminar{}
.seminar-txt{ margin-bottom: 30px; }
.seminar-fig{ margin-bottom: 30px; }
.seminar-blc{}
.seminar-blc--cnt{ padding-left: 1.5em; }
.seminar-blc--btn{margin-top: 30px; text-align: center; }