@charset "utf-8";
/* --------------mobaile_fast--------------------- */

/* ===================================
  ・ レイアウト (SP)
====================================== */
#wrapContent {
  width: 100%;
  margin: 0 auto;
  background: #fff;
}
#wrapContent aside {
  display: none;
}
/* ===================================
  ・ #pageHeader (SP)
====================================== */
/* ----------▼ヘッダーイメージ用クラス SP ▼----------*/
#pageHeader.bgimage {
  background: url("../img/page_header/page_header_sp.jpg") center top no-repeat;
  background-size: cover;
}
#pageHeader.bgimage_event {
  background: url("../img/page_header/page_header_sp_event.jpg") center top no-repeat;
  background-size: cover;
}
#pageHeader.bgimage_event-photo {
  background: url("../img/page_header/page_header_sp_event-photo.jpg") center top no-repeat;
  background-size: cover;
}
#pageHeader.bgimage_kankoubutsu {
  background: url("../img/page_header/page_header_sp_kankoubutsu.jpg") center top no-repeat;
  background-size: cover;
}
#pageHeader.bgimage_school {
  background: url("../img/page_header/page_header_sp_school.jpg") center top no-repeat;
  background-size: cover;
}
/* ----------▲ヘッダーイメージ用クラス SP ▲---------*/
#pageHeader {
  position: relative;
  width: 100%;
  height: 115px;
  background: #113961;
  padding-top: 40px;
}
#pageHeader h1 {
  position: absolute;
  top: 50%;
	left: 50%;
  transform: translate(-50%,-50%);
  width: 100%;
  font-family: "リュウミン R-KL","ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "游明朝体", "Yu Mincho", "YuMincho", serif;  /* 明朝の場合 */
  font-size: 21px;
  color: #fff;
  text-align: center;
}
/* ===================================
  ・ #pageHeader (PC)
====================================== */
@media screen and (min-width:600px) {
/* ----------▼ヘッダーイメージ用クラス pc ▼----------*/
#pageHeader.bgimage {
  background: url("../img/page_header/page_header_pc.jpg") center top no-repeat;
  background-size: cover;
}
#pageHeader.bgimage_event {
  background: url("../img/page_header/page_header_pc_event.jpg") center top no-repeat;
  background-size: cover;
}
#pageHeader.bgimage_event-photo {
  background: url("../img/page_header/page_header_pc_event-photo.jpg") center top no-repeat;
  background-size: cover;
}
#pageHeader.bgimage_kankoubutsu {
  background: url("../img/page_header/page_header_pc_kankoubutsu.jpg") center top no-repeat;
  background-size: cover;
}
#pageHeader.bgimage_school {
  background: url("../img/page_header/page_header_pc_school.jpg") center top no-repeat;
  background-size: cover;
}
/* ----------▲ヘッダーイメージ用クラス pc ▲---------*/
}
/* ===================================
  ・ 共通 (SP)
====================================== */
p.text_left { text-align: left!important }
p.text_right { text-align: right!important }
p.text_center{ text-align: center!important }
p.text_justify{ text-align: justify!important }

#sub header{
  background: url("../img/back_img.jpg")left top repeat;
}
#sub main {
  padding-top: 30px;
  padding-bottom: 30px;/* 20200327add */
}
#sub main p {
  font-size: 14px;
  color: #3E3A39;
  line-height: 21px;
  margin-bottom: 1.5em;
  text-align: justify;
}
#sub main a {
  color: #0082C9;
  font-size: 14px;
  line-height: 21px;
  text-decoration: none;
}
#sub main a:visited {
  color: #313994;
}
#sub main p strong {
  font-weight: bold;
}
	figcaption {
	margin: 0 0 20px 0;
	font-size: 72%;
	text-align: center;
	}
/* ===================================
  ・ .sec_jump (SP)
====================================== */
#sub main .sec_jump {
  margin-bottom: 30px;
}
#sub main .sec_jump>ul {
  margin-bottom: 0;
}
#sub main .sec_jump>ul li {
  float: left;
  position: relative;
  margin-right: 2em;
  margin-bottom: 0;
}
#sub main .sec_jump>ul li a {
  padding-left: 1em;
  text-decoration: none;
  line-height: 2;
}
#sub main .sec_jump>ul li::before {
  position: absolute;
  bottom: 1em;
  margin: auto;
  content: "";
  vertical-align: middle;
  left: 0;
  width: 6px;
  height: 6px;
  background: transparent;
  border-right: 1px solid #113961;
  border-bottom: 1px solid #113961;
  transform: rotate(45deg);  
}
/* 見出し
---------------------------------------*/
#sub main h2 a,
#sub main h3 a,
#sub main h4 a,
#sub main h5 a,
#sub main h6 a {
  font-size: inherit;
}
#sub main h2 {
  margin-bottom: 25px;
  background: #133B63;
  padding: 13px 1em;
  font-family: "リュウミン R-KL","ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "游明朝体", "Yu Mincho", "YuMincho", serif;  /* 明朝の場合 */
  font-size: 18px;
		font-weight: bold;
  line-height: 1.5;
  color: #fff;
  text-align: left;
}
#sub main h3 {
  width: 100%;
  height: auto;
  padding-top: 10px;
  padding-left: 1.5em;
  padding-bottom: 10px;
  margin-top: 25px;
  margin-bottom: 25px;
  border-top: 1px solid #113961;
  border-bottom: 1px solid #113961;
  font-family: "リュウミン R-KL","ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "游明朝体", "Yu Mincho", "YuMincho", serif;  /* 明朝の場合 */
  font-size: 18px;
		font-weight: bold;
  text-indent: -1.5em;
  color: #3E3A39;
  line-height: 1.4;
  text-align: left;
}
#sub main h3 span{
	margin: 0 0 0 15px;
 font-size: 14px;
}
#sub main h3::before {
  display: inline-block;
  content: "";
  width: 10px;
  height: 10px;
  margin: 0 .5em 2px;
  background: #113961;
  transform: rotate(45deg);
}
#sub main h4 {
  position: relative;
  padding-bottom: .1em;
  border-bottom: 2px solid #113961;
  margin-bottom: 24px;
  font-size: 16px;
  line-height: 1.5;
  color: #3E3A39;
  text-align: left;
}
#sub main h5 {
  padding-left: .3em;
  border-left: 3px solid #113961;
  margin-bottom: 35px;
  font-size: 16px;
  color: #3E3A39;
}
#sub #main h6 {
  margin-bottom: 15px;
  font-size: 15px;
  color: #3E3A39;
}
/* table
---------------------------------------*/
#sub main table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #9B9E9E;
  margin: 0 auto 35px;
}
#sub main th,
#sub main td {
  padding: 5px;
  border: 1px solid #9B9E9E;
  vertical-align: top;/* 20200330 add */
}
#sub main thead th {
  background: #113961;
  color: #fff;
  text-align: center;
  vertical-align: middle;
  font-weight: bold;
  white-space: nowrap;
}
#sub main table tbody th {
  background: #E5E5E5;
}
#sub main td {
  text-align: left;
}
#sub main th img {/* 20200330 add */
  width: 100%;
  max-width: 110px;
}
/* リスト
---------------------------------------*/
#sub main ul {
  margin-bottom: 20px;
  text-align: left;
}
#sub main ul li {
  text-indent: -1em;
  padding-left: 1em;
  margin-bottom: .8em;
}
#sub main ul li::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  background: #113961;
  margin-right: .5em;
}
#sub main ol {
  padding-left: 1em;
  margin-bottom: 20px;
  text-align: left;
}
#sub main ol li{
  list-style: decimal;
  margin-bottom: .8em;
}
/* ===================================
  ・ .sec_index (SP)
====================================== */
#sub main .sec_index {
  margin-bottom: 35px;
}
#sub main .sec_index>ul {
  list-style: none;
}
#sub main .sec_index>ul>li::before {
  content: none;
  display: none;
}
#sub main .sec_index>ul li {
  position: relative;
  border: 2px solid #113961;
  border-left: 7px solid #113961;
  padding-left: 0;
  margin-bottom: 15px;
}
#sub main .sec_index>ul li::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
  right: 1em;
  width: 7px;
  height: 7px;
  border-top: 1px solid #113961;
  border-right: 1px solid #113961;
  transform: rotate(45deg);
}
#sub main .sec_index>ul li a {
  display: block;
  width: 100%;
  padding: 21px 2em 21px 1em;
  text-indent: 0;
  text-decoration: none;
  font-size: 14px;
  box-sizing: border-box;
}

/* アイコンクラス
---------------------------------------*/
#sub main a.pdf::after,
#sub main a.xls::after,
#sub main a.word::after,
#sub main a.link::after {
  content: "";
  display: inline-block;
  width: 36px;
  height: 16px;
  margin-left: .5em;
  background:url(../img/icon_pdf.png) no-repeat;
  background-size: contain;
}
#sub main a.pdf::after {
  background:url(../img/icon_pdf.png) no-repeat;
  background-size: contain;
}
#sub main a.xls::after {
  background:url("../img/icon_excel.png") no-repeat;
  background-size: contain;
}

#sub main a.word::after {
  background:url(../img/icon_word.png) no-repeat;
  background-size: contain;
}
#sub main a.link::after {
  width: 18px;
  height: 18px;
  background:url(../img/icon_dl.png) no-repeat;
  background-size: contain;
}

/* 画像
---------------------------------------*/
#sub main .boxImage,
#sub main .boxImageLeft,
#sub main .boxImageright {
  width: 100%;
  height: auto;
  box-sizing: border-box;
  margin: 0 auto 30px;
  text-align: center;
}
/* 画像サイズ固定 */
.box_col_2 .boxImage {
  max-width: 200px;
}
.box_col_3 .boxImage {
  max-width: 200px;
}
#sub main .boxImage p {
  text-align: justify;
  margin: 1em auto 0;
}
#sub main div.w100 {
  width: 100%;
}
#sub iframe {
  width: 100%;
}
/*================================
  ▼ブレイクポイントのルール▼
  -スマホを基本設計にする-
  *?479px：SP縦
  *480px?：SP横
  *600px?タブレット
  *960px?小型PC
  *1280px?大型PC
================================*/


@media screen and (min-width:480px) { 
	/*　for iPhone (iPhone 横)　*/
}
@media screen and (min-width:600px) {
	/*　for iPad 　*/
  /* ===================================
  ・ #pageHeader (min-width:600px)
  ====================================== */
  #pageHeader {
    position: relative;
    width: 100%;
    height: 230px;
    background: #113961;
    padding-top: 80px;
  }
  /* 画像 (min-width:600px)
  ---------------------------------------*/
  #sub main .boxImage.w100 p {
    max-width: 480px
  }
  #sub main .boxImage {
    /*margin: 0 0 50px;*/
    margin-bottom: 50px;
  }
  /* 画像サイズ固定 */
  .box_col_2 .boxImage {
    max-width: 320px;
  }
  #sub main .box_col_2,
  #sub main .box_col_3 {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
  }
  #sub main .box_col_2 .boxImage {
    width: 50%;
  }
  #sub main .box_col_2 .boxImage:first-of-type {
    width: 50%;
    margin-right: 30px;
  }
  #sub main .box_col_3 .boxImage {
    width: 32%;
  }
#sub iframe {
  width: 640px;
}
}
@media screen and (min-width:960px) {
  /*　for PC　*/
/* ===================================
  ・ レイアウト　(min-width:960px)
====================================== */
  #wrapContent {
    position: relative;
    width: 100%;
    max-width: 980px;
    margin: -265px auto 60px;/* 20200327edit */
    padding: 0 40px;
    background: #fff;
  }
  #wrapContent .secInner {
    width: 100%;
    max-width: 980px;
  }
  #wrapContent main {
    float: right;
    width: 74.44%;
    height: auto;
  }
/* ===================================
  ・ 共通　(min-width:960px)
====================================== */
  #sub main p {
    font-size: 15px;
    line-height: 27px;
  }
  #sub main a {
    font-size: 15px;
    line-height: 27px;
  }
  #sub main a:hover {
    color: #1678b5;
    text-decoration: underline;
  }
figure {
	float: right;
	margin: 0 0 20px 25px;
}
	figure img {
	margin-bottom: 10px;
	max-width: 100%;
	}
	figcaption {
	margin: 0;
	}
/* ===================================
  ・ .sec_jump　(min-width:960px)
====================================== */
  #sub main .sec_jump>ul li a:hover {
    text-decoration: underline;
  }
/* ===================================
  ・ aside　(min-width:960px)
====================================== */
  #wrapContent aside {
    float: left;
    width: 21.11%;
    height: auto;
    min-height: 600px;/* 高さ調整用 */
    margin-right: 4.44%;
    display: block;
    margin-top: 30px;
    text-align: center;
  }
  #wrapContent aside>h2 {
    vertical-align: middle;
    width: 100%;
    height: 85px;
    padding-top: 30px;
    background: url("../img/aside_title.jpg") center top no-repeat;
    background-size: cover;
    font-size: 17px;
    color: #fff;
  }
  #wrapContent aside>ul{
    width: 100%;
  }
  #wrapContent aside>ul li {
    position: relative;
    width: 100%;
    padding: 1em 0 1em 2em;
    text-align: left;
    
    border-bottom: 1px solid #ccc;
  }
  #wrapContent aside>ul li::after {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
    left: .5em;
    width: 4px;
    height: 4px;
    border-top: 1px solid #113961;
    border-right: 1px solid #113961;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
  }
  #wrapContent aside>ul li a{
    color: #3E3A39;
    text-decoration: none;
  }
  #wrapContent aside>ul li a:hover {
    text-decoration: underline;
  }
/* ===================================
・ #pageHeader (min-width:960px)
====================================== */
  #pageHeader {
    padding-top: 70px;
    height: 455px;
  }
  #pageHeader h1 {
    position: static;
    transform: translate(0);
    font-size: 40px;
  }
/* ===================================
・ #breadcrumb (min-width:960px)
====================================== */
  #breadcrumb {
    position: relative;
    max-width: 980px;
    margin: 0 auto;
    background: transparent;
  }
  #breadcrumb>ul {
    position: absolute;
    left: -40px;
    bottom: 0;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    height: 28px;
    line-height: 28px;
    text-align: center;
    padding-left: 1.5em;
    padding-right: 1.5em;
  }
  #breadcrumb>ul li {
    position: relative;
    margin-right: 2em;
    color: #fff;
  }
  #breadcrumb>ul li a {
    color: #fff;
    text-decoration: none;
    transition: all 0.4s ease-in-out;
  }
  #breadcrumb>ul li a:hover {
    text-decoration: underline;
  }
  #breadcrumb>ul li::after {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
    right: -1em;
    width: 8px;
    height: 8px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: rotate(45deg);
  }
  #breadcrumb>ul li:last-of-type {
    margin-right: 0;
  }
  #breadcrumb>ul li:last-of-type::after {
    display: none;
  }

  /* 見出し (min-width:960px)
  ---------------------------------------*/
  #sub main h2 {
    font-size: 21px;
  }
  #sub main h3 {
    font-size: 20px;
  }
  #sub main h3::before {
    width: 12px;
    height: 12px;
  }
  #sub main h4 {
    font-size: 18px;
  }
  #sub main h5 {
    font-size: 16px;
  }
  #sub #main h6 {
    font-size: 15px;
  }
  
  /* table (min-width:960px)
  ---------------------------------------*/
  #sub main th,
  #sub main td {
    padding: .8em;
  }

/* ===================================
  ・ .sec_index (min-width:960px)
====================================== */
  #sub main .sec_index {
    margin-bottom: 50px;
  }
  #sub main .sec_index>ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  #sub main .sec_index>ul li {
    width: 47%;
    margin-bottom: 35px;
    margin-right: 5.99%;
    box-sizing: border-box;
  }
  #sub main .sec_index>ul li a:hover {
    text-decoration: underline;
  }
  #sub main .sec_index>ul li:nth-of-type(even) {
    margin-right: 0;
  }
  /* 画像 (min-width:960px)
  ---------------------------------------*/
  #sub main .boxImage p {
    text-align: justify;
    margin: 15px auto 0;
  }
  #sub main .boxImage.w100 {
    width: 100%;
    max-width: 980px;
  }
  #sub main .boxImage.w100 img {
    margin-bottom: 0;
  }
  #sub main .boxImage.w100 p {
    width: 100%;
    max-width: 980px;
  }
  #sub main .boxImageLeft img {
    float: left;
    margin-right: 30px;
    margin-bottom: 30px;
  }
  #sub main .boxImageright img {
    float: right;
    margin-left: 30px;
    margin-bottom: 30px;
  }
}