@charset "UTF-8";
/* リード文 */
.catch {
	margin: 10px 20px;
	font-size: 0.8em;
	color: #999;
}
/* トップ画像 */
.topImg {
	margin: 10px 0;
	text-align: center;
}


/* セクションとサブタイトルの背景 */
.subCon {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	width: 1080px;
	background-image: url(../images/header_bg01.png),
					  url(../images/header_bg03.png),
					  url(../images/header_bg05.png),
					  url(../images/header_bg07.png);
	background-repeat: no-repeat;
	background-position: 10px 7px,
					     23px 0px,
					     27px 21px,
					     0px 30px;
	background-size: 27px auto,
					 47px auto,
					 24px auto,
					 35px auto;
}
/* サブタイトル */
.subCon_title {
	width: 100%;
	box-sizing: border-box;
	margin: 0 5px;
	padding: 19px 5px 2px 50px;
	border-bottom: solid 2px #8ddd9c;
	font-size: 1.7em;
	color: #333;
}
/* もっと見る */
.motto {
	width: 100%;
	text-align: right;
}
/* ◇◇◇◇◇◇◇◇◇◇◇◇お知らせ・更新情報◇◇◇◇◇◇◇◇◇◇◇◇ */
ul#newsList {
	width: 100%;
	margin: 0 0 15px;
	padding: 0;
}
ul#newsList li {
	width: 100%;
	margin: 0 0 3px 0;
	padding: 5px 0;
	border-bottom: dashed 1px #c2edca;
}
/* コンテンツ枠 */
.subCon_frame {
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
	width: calc(100% - 40px);
	height: 160px;
	margin: 10px auto;
	padding: 5px;
	overflow: scroll;
	border: dashed 1px #c2edca;
	font-size: .9em;
}
.subCon_frame_list {
	display: flex;
	flex-wrap: wrap;
}
.subCon_frame_list > dt {
	width: 153px;
	padding-left: 22px;
	background: url(../images/header_bg10.png) no-repeat 0 6px;
	background-size: 16px auto;
	line-height: 1.8em;
}
.subCon_frame_list > dd {
	width: calc(100% - 175px);
	line-height: 1.8em;
}
/* ラベル */
.el_label {
	display: inline-block;
	margin-right: 4px;
	padding: 4px 5px 1px;
	border-radius: 6px;
	background-color: #f33d3d;
	line-height: 1em;
	font-size: .75em;
	font-weight: bold;
	color: #fff;
}
.el_label_all {
	background-color: #e60b78;
}
.el_label_cli {
	background-color: #cc6600;
}
.el_label_kaku {
	background-color: #8ab800;
}
.el_label_hp {
	background-color: #9b39e6;
}
.el_label_new {
	background-color: #00a9b8;
}
.comment {
	display: block;
	text-indent: 1em;
}
.newMark{
	margin: 0 0 2px 4px;
	font-weight: bold;
	color: #f33d3d;
}
/* 著作権 */
.copy {
	width: 100%;
	margin-top: 10px;
	text-align: center;
}


/* ◇◇◇◇◇◇◇◇◇◇◇◇スライダー◇◇◇◇◇◇◇◇◇◇◇◇ */
/*
 * jQuery FlexSlider v2.2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */

/* Browser Resets
*********************************/
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}

.slider {
	width: 1080px;
	margin: 10px auto!important;
}

/* レイアウト
***********************/
/*#container {padding: 60px 40px 100px;}*/

/* FlexSlider Necessary Styles
*********************************/
.flexslider {margin: 0; padding: 0;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides li a{
	display: block;
	position: relative;
	width: 270px;
	float: left;
}
.flexslider .slides img {
	width: 250px;
	height: auto;
	margin: 0 10px;
	/*display: block;*/
	}
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
html[xmlns] .slides {display: block;}
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}

/* FlexSlider Default Theme
*********************************/
.flexslider { margin: 0 0 30px; background: #fff; position: relative; zoom: 1; }
/*.flexslider { margin: 0 0 60px; background: #fff; border: 4px solid #fff; position: relative; border-radius: 4px; -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.2); -moz-box-shadow: 0 1px 4px rgba(0,0,0,.2); -o-box-shadow: 0 1px 4px rgba(0,0,0,.2); box-shadow: 0 1px 4px rgba(0,0,0,.2); zoom: 1; }*/
.flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; }
.loading .flex-viewport { max-height: 300px; }
.flexslider .slides { zoom: 1; }
.carousel li { margin-right: 5px; }

/* スライダーキャプション上部 */
.flexslider .slides li p.flex-caption{
	width: 244px;
	position: absolute;
	top: 0;
	left: 10px; 
	padding: 3px;
	background: rgba(27,187,57,0.5);
	line-height: 0.9rem;
	font-size: 0.7rem;
	color: #fff;
}
.flexslider .slides li p.flex-caption span{
	display: inline-block;
}
.flexslider .slides li p.flex-caption .keitai{
	font-size: 0.6rem;
}
.flexslider .slides li p.flex-caption .keitai:after {
	content: "　";
}
/* スライダーキャプション下部 */
.flexslider .slides li p.flex-caption2{
	position: absolute;
	bottom: 2px;
	left: 10px; 
	width: 246px;
	padding: 2px;
	text-align: right;
	line-height: 0.9rem;
	font-size: 0.6rem;
	color: #fff;
	background: rgba(27,187,57,0.5);
}

/* ラジオボタンナビ */
.flex-control-nav {width: 100%; position: absolute; bottom: -30px; text-align: center;}
.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 14px; height: 14px; display: block; background: #666; background: rgba(0,0,0,0.5); background: ; cursor: pointer; text-indent: -9999px; background: url(../images/radio01.png) no-repeat 0 0; }
/*.flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); background: url(../images/rediob_h.gif) no-repeat 0 0; }*/
.flex-control-paging li a.flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; background: url(../images/radio02.png) no-repeat 0 0; }

/* ◇◇◇◇◇◇◇◇◇◇◇◇スライダー終わり◇◇◇◇◇◇◇◇◇◇◇◇ */


/* ◇◇◇◇◇◇◇◇◇◇◇◇カード◇◇◇◇◇◇◇◇◇◇◇◇ */
.bl_card {
	position: relative;
	width: 270px;
}
.bl_card_imgWrapper {
	width: 250px;
	margin: 10px;
}
.bl_card_imgWrapper a {
	display: block;
}
.bl_card_imgWrapper figcaption {
	position: absolute;
	left: 30px;
	top: 20px;
	font-size: 1rem;
	color: #000;
	text-shadow: 0px 0px 3px #fff,0px 0px 3px #fff,0px 0px 3px #fff,0px 0px 3px #fff,0px 0px 3px #fff,0px 0px 3px #fff,0px 0px 3px #fff; 
}
.bl_card_imgWrapper figcaption span {
	display: block;
	margin: 10px 0 0 10px;
	line-height: 1.3rem;
	font-size: 0.7rem;
	color: #121d6e;
}
.bl_card_txt {
	margin: 0 5px;
	font-size: 0.95em;
}

/* ====== スマートフォン用（小）用の設定 ====== */
@media only screen and (max-width:569px) {
/* ◇◇◇◇◇スライダー◇◇◇◇◇ */
.slider {
	width: 300px;
	
}
.flexslider .slides li a{
	width: 150px;
}
.flexslider .slides img {
	width: 130px;
	height: auto;
	margin: 10px;
}
.flexslider .slides li p.flex-caption{
	top: 10px;
	width: 126px;
	padding: 2px;
	line-height: 0.7rem;
	font-size: 0.55rem;
}
.flexslider .slides li p.flex-caption .keitai{
	font-size: 0.4rem;
}
.flexslider .slides li p.flex-caption2{
	bottom: 12px;
	width: 126px;
	line-height: 0.7rem;
	font-size: 0.4rem;
}
/* ◇◇◇◇◇スライダー終わり◇◇◇◇◇ */
.subCon {
	/*width: 280px;*/
}
.subCon_title {
	/*width: 270px;*/
}
.bl_card {
	width: 250px;
}
}
/* ====== スマートフォン（大）用の設定 ====== */
@media only screen and (min-width: 570px)
and (max-width: 767px) {
/* ◇◇◇◇◇スライダー◇◇◇◇◇ */
.slider {
	width: 368px;
	
}
.flexslider .slides li a{
	width: 184px;
}
.flexslider .slides img {
	width: 164px;
	height: auto;
	margin: 10px;
}
.flexslider .slides li p.flex-caption{
	top: 10px;
	width: 158px;
	line-height: 0.8rem;
	font-size: 0.6rem;
}
.flexslider .slides li p.flex-caption .keitai{
	font-size: 0.5rem;
}
.flexslider .slides li p.flex-caption2{
	width: 160px;
	font-size: 0.5rem;
	line-height: 0.8rem;
	bottom: 12px;
}
/* ◇◇◇◇◇スライダー終わり◇◇◇◇◇ */
.subCon {
	/*width: 550px;*/
}
.subCon_title {
	/*width: 540px;*/
}
.bl_card {
}
.bl_card_imgWrapper {
	width: 250px;
}
}
/* ====== スマートフォン用の設定 ====== */
@media only screen and (max-width: 767px) {

.topImg {
	margin: 10px;
}
.topImg img {
	width: 100%;
}
.subCon {
	width: 100%;
	background-position: 7px 4px,
					    17px 0px,
					    20px 17px,
					    0px 22px;
	background-size: 21px auto,
					 39px auto,
					 18px auto,
					 27px auto;
}
.subCon_title {
	padding: 10px 5px 2px 43px;
	font-size: 1.55em;
}
/* コンテンツ枠 */
.subCon_frame {
	height: 180px;
}
.subCon_frame_list > dt {
	width: 100%;
	margin: 5px 0 0;
}
.subCon_frame_list > dd {
	width: 100%;
	margin: 0 0 15px 30px;
}
}
/* ====== タブレット用の設定 ====== */
@media only screen and (min-width: 768px)
and (max-width: 991px) {
/* ◇◇◇◇◇スライダー◇◇◇◇◇ */
.slider {
	width: 736px;
	
}
.flexslider .slides li a{
	width: 184px;
}
.flexslider .slides img {
	width: 164px;
	height: auto;
	margin: 0 10px;
}
.flexslider .slides li p.flex-caption{
	width: 158px;
	line-height: 0.8rem;
	font-size: 0.6rem;
}
.flexslider .slides li p.flex-caption .keitai{
	font-size: 0.5rem;
}
.flexslider .slides li p.flex-caption2{
	width: 160px;
	line-height: 0.8rem;
	font-size: 0.5rem;
}
/* ◇◇◇◇◇スライダー終わり◇◇◇◇◇ */

.topImg {
	margin: 10px;
}
.topImg img {
	width: 100%;
	max-width: 800px;
}
.subCon {
	width: 100%;
	background-position: 8px 5px,
					    20px 0px,
					    24px 17px,
					    0px 25px;
	background-size: 26px auto,
					 43px auto,
					 23px auto,
					 33px auto;
}
.subCon_title {
	font-size: 1.6em;
	padding: 15px 5px 2px 45px;
	/*width: 735px;*/
}
.bl_card {
	width: 245px;
}
.bl_card_imgWrapper {
	width: 225px;
}
.cardImg {
	width: 225px;
}
}
/* ====== pc用の設定 ====== */
@media only screen and (min-width: 992px)
and (max-width: 1199px){
.subCon {
	/*width: 910px;*/
	width: 100%;
}
.subCon_title {
	font-weight: bold;
	/*width: 900px;*/
}
/* ◇◇◇◇◇スライダー◇◇◇◇◇ */
.slider {
	width: 880px;
	
}
.flexslider .slides li a{
	width: 220px;
}
.flexslider .slides img {
	width: 200px;
	}
.flexslider .slides li p.flex-caption{
	width: 194px;
}
.flexslider .slides li p.flex-caption2{
	width: 196px;
}
}
/* ====== ワイド画面用の設定 ====== */
 @media only screen and (min-width: 1200px) { 
.subCon_title {
	font-weight: bold;
}
}

