@charset "utf-8";

/*===============================================
 *	media_list
===============================================*/
.band-ttl {font-size: 30px;}
.pager .pagination li.pre,.pager .pagination li.next {background: #249db3;}
.pager .pagination li a:hover,.pager .pagination li a.active {color: #249db3;background: #fff;border: #249db3 2px solid;}
.bluebox-normal_ttl {background: #009db3;font-size: 24px;}
.basic-bluebox {border: #009db3 10px solid;}
@media only screen and (max-width: 568px) {
#second-visualcontents {height: 130px;}
.band-ttl {font-size: 20px;}
.bluebox-normal_ttl {font-size: 18px;}
}
/*-----------------------------------------------
 *	一覧 add2024/03/12
-----------------------------------------------*/
.media-list {gap: 30px 1.6%;margin-bottom: 60px;}
.media-list li {width: calc(100% / 3.1);padding: 0 1em 1.2em;border-radius: 10px;border: solid 2px #346bb6;background: #fff;box-sizing: border-box;display: flex;flex-direction: column;overflow: hidden;box-shadow: 0 0 10px rgba(0,0,0,.3);}
.media-list li .ttl {background: #346bb6;color: #fff;font-size: 20px;font-weight: bold;margin: 0 -1em 1em;padding: 18px 20px;line-height: 1.45;display: flex;flex: 2;justify-content: center;align-items: center;text-align: center;}
.media-list li .ttl a{color: #fff;text-decoration: underline;}
.media-list li .ttl a:hover{text-decoration: none;}
.media-list li p {margin-top: 18px;}
.section-map {background: #d5efff;}
@media screen and (max-width: 960px) {
.media-list li {padding: 0 20px 20px;}
.media-list li .ttl {font-size: 18px;padding: 15px 15px;margin: 0 -20px 20px;}
}
@media screen and (max-width: 568px) {
.media-list {gap: 20px 0;margin: 0 0 30px;}
.media-list li {width: 100%;}
.media-list li .ttl {font-size: 19px;padding: 10px 12px 12px;}
}

/*-----------------------------------------------
 *	一覧-archives用
-----------------------------------------------*/
.ttl-main_media{max-width: 980px;margin: 0 auto;}
.media-box{display: flex;justify-content:space-between;flex-wrap: wrap;}
.media-box figure {line-height: 0;border: #fff 8px solid;box-shadow: 0 0 10px #ccc;margin: 5%;}
.media-box figure img{object-fit: contain;height: 180px;}
.media-box .article {background: #fff;max-width: 310px;box-shadow: 0 0 10px rgba(0,0,0,.3);margin-bottom: 2vw;display: flex;flex-direction: column;}
.media-box .article {background: #fff;border: #249db3 2px solid;max-width: 310px;box-shadow: 0 0 10px rgba(0,0,0,.3);margin-bottom: 2vw;display: flex;flex-direction: column;position: relative;}
.media-box .article::before, .media-box .article::after {content: '';width: 30px;height: 30px;position: absolute;}
.media-box .article::before {border-left: solid 6px #249db3;border-top: solid 6px #249db3;top: 0;left: 0;}
.media-box .article::after {border-right: solid 6px #249db3;border-bottom: solid 6px #249db3;bottom: 0;right: 0;}
@media all and (-ms-high-contrast: none) {
.media-box .article {display: block;}
}
.media-box .article-info{padding: .5em 1em 0;}
.media-box .article-ttl{font-size: 16px;font-weight: bold;margin-bottom: 1em;}
/*.media-box .article-ttl:after {content: "";display: block;background: #249db3;width: 50px;height: 4px;border-radius: 2px;margin-top: .7em;}*/
.article-date{color: #249db3;display: block;text-align: right;margin-bottom: 10px;position: relative;}
.article-date::before {content: "";background: url("../img/icon-clock_gre.png") left no-repeat;background-size: contain;display: inline-block;width: 15px;height: 15px;padding-right: 5px;vertical-align: middle;}
.media-box p{margin-bottom: 1em;}
.articleBtn{display: block;background: #fff;color: #249db3;margin: auto 1em 1em auto;border: #249db3 2px solid;padding: 10px 0;text-align: center;width: 150px;}
.articleBtn:hover{background: #249db3;color: #fff;}
@media only screen and (max-width: 768px) {
.ttl-main_media {margin: 0 3%;}
}
@media only screen and (max-width: 568px) {
.media-box .article {max-width: inherit;margin-bottom: 6vw;}
}
/*-----------------------------------------------
 *	詳細
-----------------------------------------------*/
.pic {display: table;float: right;width: 270px;margin: 0 0 25px 25px;height: 272px;border: 1px solid #dcdcdc;box-shadow: 0 0 0 4px #fff inset;background: #eee;box-sizing: border-box;text-align: center;}
.pic a {display: table-cell;position: relative;height: 100%;padding: 10px 20px;vertical-align: middle;}
.pic a:after {position: absolute;bottom: -1px;right: -1px;width: 30px;height: 30px;background: url(../img/icon-glass.png) no-repeat;content: '';}
.detail-txt{margin-bottom: 1em;}
.post_under_nav {color: #fff;background: #009db3;margin: 0 0 15px;}
.post_under_nav ul {display: table;width: 100%;table-layout: fixed;}
.post_under_nav li {display: table-cell;text-align: center;}
.post_under_nav li span, .post_under_nav li a {display: block;padding: 15px;color: #fff;}
.post_under_nav li a:hover {background: rgba(255, 255, 255, 0.3);}
.post_under_nav .nav-left {text-align: left;}
.post_under_nav .nav-center {text-align: center;border-right: 1px solid rgba(255, 255, 255, 0.3);border-left: 1px solid rgba(255, 255, 255, 0.3);}
.info {padding: 10px 30px 0;border-top: 1px dotted #b2b2b2;text-align: right;}
.info::before {content: "";background: url("../img/icon-clock_blk.png") left no-repeat;background-size: contain;display: inline-block;width: 15px;height: 15px;padding-right: 5px;vertical-align: middle;}
@media only screen and (max-width: 568px) {
.pic {width: 160px;margin: 0 0 10px 10px;height: initial;}
.pic a {padding: 10px;}
}
/*-----------------------------------------------
 *	Detail pager
-----------------------------------------------*/
.post_under_nav {color: #fff;background: #249db3;margin: 0 0 15px;}
.post_under_nav ul {display: table;width: 100%;table-layout: fixed;}
.post_under_nav li {display: table-cell;text-align: center;}
.post_under_nav li span, .post_under_nav li a {display: block;padding: 15px 2px;color: #fff;}
.post_under_nav li a:hover {background: rgba(255, 255, 255, 0.3);}
.post_under_nav .nav-left {text-align: left;}
.post_under_nav .nav-center {text-align: center;border-right: 1px solid rgba(255, 255, 255, 0.3);border-left: 1px solid rgba(255, 255, 255, 0.3);}