/******************************************************************************
******************************************************************************
**
** style.cssにおいて
** -- styleではコンテンツ（データ入れ）で使用する基本タグのCSS指定
** -- headerではヘッダーのCSS指定
** -- global navではグローバルナビのCSS指定
** -- contentではコンテント・メイン・サイドナビのCSS指定
** -- footerではフッターのCSS指定
** -- pagetopではページトップボタンのCSS指定
** -- homeではトップページのCSS指定
** -- pageでは汎用ページのCSS指定
**
** 注意事項
** -- CSSの命名規則はApplicatsオリジナルの命名規則を採用しています。
** -- 初期フォントサイズはreset.cssにて13pxにリセットしています。
** -- 行間は1.6にリセットしています。
**        単位は不要です。(スタイル崩れする可能性有)
** -- コンテンツ内のフォントサイズ・行間は
**        [ base ]のcontentsクラスで指定しています。
**        変更する場合はこちらを変更してください。
**
******************************************************************************
******************************************************************************/

/*-------------------------------------------------------------------------------------------------------
*********************************************************************************************************
*********************************************************************************************************
******
****** PCスタイル
******
*********************************************************************************************************
*********************************************************************************************************
-------------------------------------------------------------------------------------------------------*/
body { background: url(../images/body_bg.jpg) repeat-x #F5F5F5; }
.base_con {
	background-color: #FFF;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
	margin: 0 auto;
	width:960px;
}
/*----------------------------------------------------------------------------
******************************************************************************
** style
******************************************************************************
----------------------------------------------------------------------------*/
.mcon { word-wrap:break-word }
.mcon a img:hover {
	opacity:0.8;
	-webkit-transition:all 0.3s ease;
	transition:all 0.3s ease
}
.mcon h1 {
	background-color: #008DC9;
	border-radius: 5px;
	color: #FFF;
	font-size: 23px;
	padding: 5px 20px;
	margin-bottom: 20px;
	margin-top: -30px;
	position: relative;
}
.mcon .h1_num {
	background-color: #FC0;
	border-radius: 50%;
	font-size: 14px;
	color: #008DC9;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	left: -13px;
	top: -13px;
	position: absolute;
}
.mcon h2 {
     border-bottom: 5px solid rgba(0, 170, 230, 1);
     color: rgba(0, 170, 230, 1);
     font-size: 20px;
     line-height: 1.2;
     margin-bottom: 20px;
     padding-bottom: 5px;
     position: relative;
}
.mcon h2:before {
     border-bottom: 5px solid rgba(255, 255, 255, 0.4);
     content: "";
     bottom: -5px;
     position: absolute;
     width: 30%;
}
.mcon h3 {
	color: #008DC9;
	font-size: 16px;
	padding-bottom: 5px;
	margin-bottom:10px;
	margin-top:16px;
}
.mcon h4 {
	font-size: 1.1em;
	margin-bottom:5px;
	margin-top:5px;
}
.mcon h5, .mcon h6 {
	margin-bottom:2px;
	margin-top:5px;
}
.mcon hr {
	border:none;
	border-top:1px dotted #000
}
.mcon iframe { max-width:100% }
.mcon img {
	max-width:100%;
	height:auto
}
.mcon ol {
	margin-top: 1em;
	margin-bottom:0.7em
}
.mcon ol li {
	margin-left:1.5em;
	margin-bottom:0.5rem
}
.mcon p { margin-bottom:1em }
.mcon ul {
	margin-top:1.2em;
	margin-bottom:0.7em
}
.mcon ul li {
	list-style-type:disc;
	margin-left:1.5em;
	margin-bottom:0.5rem
}
/*----------------------------------------------------------------------------
******************************************************************************
** header
******************************************************************************
----------------------------------------------------------------------------*/
.hd {
	border-top: 5px solid #008DC9;
	height:100px;
	padding: 30px 20px 0;
	position: relative;
}
.hd_logo { display: inline-block; }
.hd_logo a{ 
	background:url(../images/logo.jpg) no-repeat top left;
	display: block;
	width: 450px;
	height: 30px;
	padding-top: 30px;
	overflow: hidden;
}

/*----------------------------------------------------------------------------
******************************************************************************
** content
******************************************************************************
----------------------------------------------------------------------------*/
.con_bg { background:url(../images/con_bg.png) no-repeat; }
.con { padding: 30px; }
.main { }
.sub { margin-top: 30px;}
.sub h3 {
	background-color: #008DC9;
	color: #FFF;
	font-size: 17px;
	padding: 5px 16px;
	margin-bottom: 20px;
}
.sub_nav_list {
	display:flex;
	flex-wrap: wrap;
}
.sub_nav_list li {
	border: 1px solid #008DC9;
	border-radius: 5px;
	margin: 0 10px 10px 0;
	width: calc( (100% - 50px ) / 5);
	position: relative;
}
.sub_nav_list a {
	border-radius: 5px;
	color: #008DC9;
	display: flex;
	font-size: 15px;
	font-weight: bold;
	line-height: 1.2;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	text-align: center;
	height: 60px;
}
.sub_nav_list a:hover,
.sub_nav_list a.current {
	background-color: #D8E7F3;
	text-decoration: underline;
}
.sub_nav_list_num {
	background-color: #008DC9;
	border-radius: 50%;
	color: #FFF;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	left: -8px;
	top: -8px;
	position: absolute;
}
/*----------------------------------------------------------------------------
******************************************************************************
** footer
******************************************************************************
----------------------------------------------------------------------------*/
.ft_bg { background:url(../images/ft_bg_bg.png) no-repeat; }
.ft {
	background-color: #008DC9;
	padding: 20px 0;
}
.ft_copy, .ft_disc {
	color: #FFF;
	font-size: 11px;
	text-align:center;
}
.ft_disc { margin-bottom: 5px; }
/*----------------------------------------------------------------------------
******************************************************************************
** pagetop
******************************************************************************
----------------------------------------------------------------------------*/
.pagetop {
	border-radius:50%;
	background-color:#FFF;
	bottom:30px;
	height:70px;
	right:30px;
	position:fixed;
	width:70px;
	z-index:100
}
.pagetop_btn {
	background-color: #008DC9;
	border-radius:50%;
	color:#FFF;
	cursor:pointer;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align:center;
	-ms-flex-align:center;
	align-items:center;
	-webkit-box-pack:center;
	-ms-flex-pack:center;
	justify-content:center;
	font-size: 9px;
	height:100%;
	opacity: 0.8;
	-webkit-transition:all 0.3s ease;
	transition:all 0.3s ease;
	text-decoration:none;
	text-align:center;
	width:100%
}
.pagetop_btn:hover { opacity: 0.6; }
/*----------------------------------------------------------------------------
******************************************************************************
** index
******************************************************************************
----------------------------------------------------------------------------*/
.index_bnr_list li { margin-bottom:4px }
.index_bnr_btn {
	padding:16px 16px 16px 42px;
	border:1px solid #000000;
	border-radius:3px;
	display:block;
	text-decoration:none;
	background:url(../images/common/icon_elink_black.png) no-repeat 16px center;
	color:#000000;
}
.index_bnr_btn:hover {
	background-color:#000;
	background-image:url(../images/common/icon_elink_white.png);
	color:#FFF
}
.index_greet {
	background-color: #E5F3F9;
	padding: 20px;
	margin-bottom: 30px;
}
.index_greet h2 {
	color: #008CC9;
	font-size: 18px;
}
.index_greet p { margin-top: 8px; }
.index_news h2 { margin-bottom:0px }
.index_news_table { width:100% }
.index_news_date {
	display: block;
	font-size: 11px;
	padding-top: 8px;
}
.index_news_title {
	border-bottom:1px dotted #999;
	display: block;
	font-size: 12px;
	padding-bottom: 8px;
}
.index_news_icon_new {
	display:inline-block;
	color:#C00;
	font-weight:bold;
	margin-left:0.5em
}
.index_news_icon_new:before { content:"NEW" }
.index_news_scroll {
	max-height:170px;
	overflow:auto
}
.index_slide_bg { }
.index_slide { }
.index_slide img {
	width:960px;
	height:300px;
	-o-object-fit:cover;
	object-fit:cover;
	font-family:'object-fit: cover;'
}
.index_web_contents { width: 640px; }
.index_web_contents h2 {
	background-color: #008DC9;
	color: #FFF;
	font-size: 17px;
	padding: 5px 16px;
	margin-bottom: 20px;
}
.index_web_contents_list {
	display:flex;
	flex-wrap: wrap;
}
.index_web_contents_list li {
	border: 1px solid #008DC9;
	border-radius: 5px;
	margin: 0 10px 10px 0;
	width: calc( (100% - 30px ) / 3);
	position: relative;
}
.index_web_contents_list a {
	border-radius: 5px;
	color: #008DC9;
	display: flex;
	font-size: 15px;
	font-weight: bold;
	line-height: 1.2;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	text-align: center;
	height: 60px;
}
.index_web_contents_list a:hover {
	background-color: #D8E7F3;
	text-decoration: underline;
}
.index_web_contents_list_num {
	background-color: #008DC9;
	border-radius: 50%;
	color: #FFF;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	left: -8px;
	top: -8px;
	position: absolute;
}
.index_side { width: 240px; }
.index_side h3 { color: #008DC9; }
.index_side_addr {
	background-color: #E5F3F9;
	font-size: 12px;
	padding: 10px 20px;
	margin-bottom: 10px;
	margin-top: 5px;
}
/*----------------------------------------------------------------------------
******************************************************************************
** page
******************************************************************************
----------------------------------------------------------------------------*/
.cmn_fstyle_blue_01{
	color: #008DC9;
	font-size: 16px;
	font-weight: bold;
	padding-bottom: 5px;
	margin-bottom:10px;
	margin-top:16px;
	text-indent:-1em;
	margin-left:1em;
}
/*----------------------------------------------------------------------------
******************************************************************************
** common
******************************************************************************
----------------------------------------------------------------------------*/