@charset "utf-8";

/*
Theme Name: group_sites
Author: Tokushinkai
Version: 1.0
*/

body {
	font-size: 18px;
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif" ;
	line-height: 180%;
	color: #333;
}

.wrap {
	width: 1200px;
	margin: 0 auto;
}

/*floatとclearfix==============================*/

.float_left {float: left;}
.float_right {float: right;}

.clearfix:after {
  display: block;
  clear: both;
  content: "";
}

/*marginとpadding==============================*/

.mb10 {margin-bottom: 10px;}
.mb20 {margin-bottom: 20px;}
.mb30 {margin-bottom: 30px;}
.mb40 {margin-bottom: 40px;}
.mb50 {margin-bottom: 50px;}
.mb60 {margin-bottom: 60px;}
.mb70 {margin-bottom: 70px;}
.mb80 {margin-bottom: 80px;}

.mt60 {margin-top: 60px;}

.pl30 {padding-left: 30px;}
.pl35 {padding-left: 35px;}
.pl45 {padding-left: 45px;}

/*書式==============================*/

.line_height_160 {line-height: 160%;}
.line_height_150 {line-height: 150%;}
.line_height_140 {line-height: 150%;}
.line_height_20px {line-height: 20px;}

.font_size_20 {font-size: 20px;}

.font_size_17 {font-size: 17px;}
.font_size_16 {font-size: 16px;}
.font_size_15 {font-size: 15px;}
.font_size_14 {font-size: 14px;}
.font_size_13 {font-size: 13px;}

.font_size_32 {font-size: 32px;}
.font_size_40 {font-size: 40px;}

.fw_normal {font-weight: normal;}
.fw_bold {font-weight: bold;}

.ta_center {text-align: center;}

.deco_none, .current, .sidebar_right a, .single .main a, .single .main .page_nav a:hover  {text-decoration: none;}
.deco_underline, .single .main a:hover {text-decoration: underline;}

/*色==============================*/

.gray_1, .current p, .sidebar_left a:hover, #implant01 .sidebar_left .implant01, .sidebar_right a:hover, .bottom a:hover, .single .main .page_nav a {color: #333;}
.gray_2 {color: #555;}
.gray_3, .sidebar_left a, .sidebar_right a, .bottom a {color: #777;}
.white, .current .tag {color: #FFF;}

.emerald_1 {color: #009688;}
.emerald_2, .single .main a {color: #2FB0BB;}
.emerald_3, .single .main a:active {color: #39C4CE;}

.bg_gray_1, .single .main h2 {background-color: #F5F5F5;}
.tag.active, .tag, .tag_l, .current .tag {background-color: #333333;}
.bg_gray_2 {background-color: #555555;}
.bg_gray_3 {background-color: #777777;}

.bg_cream_1, .sidebar_left a:hover, .bottom ul li a:hover, .cat_main_loop:hover {background-color: #FFF9E1;}
.bg_cream_2, .current, .sidebar_left .current:hover, .page_nav a:hover, .cat_main_loop a:hover {background-color: #FFF3C4;}

.bg_emerald_1 {background-color: #009688;}
.bg_emerald_2 {background-color: #2FB0BB;}
.bg_emerald_3 {background-color: #39C4CE;}


/*header==============================*/

.single header {
	height: 120px;
	background-color: #FFF;
}

.group_logo {
	width: 190px;
	height: 120px;	
	float: left;
}

.group_logo img {
	margin: 30px 0;
}

.area {
	width: auto;
	float: right;
}

.area ul li {
	display: block;
	float: left;
	width: auto;
}

.area ul li a{
	display: block;
	width: auto;
	height: 50px;
	padding: 35px 30px 35px;
	border-bottom: 2px solid rgba(255,255,255,0);
}

.area ul li a:hover{
	border-bottom: 2px solid rgba(0,0,0,1);
}

/*アイキャッチ==============================*/

.cat_eyecatch {
	width: 100%;
	height: 124px;
	background-image: url(images/category_eyecatch_filter.png), url(images/implant_eyecatch.jpg) ;
	background-position: center top;
	background-repeat: no-repeat;
	padding: 83px 0;
}

.cat_frame {
	width: 400px;
	height: 124px;
	margin: 0 auto;
	background-color: rgba(255,255,255,0.8);
	outline-offset: 2px;
	outline: 1px double rgba(255,255,255,0.8);
}

.categories {
	padding-top: 40px;
	line-height: 80%;
}


/*左サイドバー==============================*/

.sidebar {
	width: 290px;
	position: absolute;
	top: 0;
}

.sidebar_left {
	left: 0;
	min-height: 100%;
}

.sidebar_left ul li a {
	display: block;
	padding: 30px 35px;
}

.sidebar_left ul li {
	border-bottom: 1px solid #FFF;
}

.tag {
	padding: 0 15px;
	height: 20px;
	line-height: 20px;
	display: inline-block;
}

/*右サイドバー==============================*/

.sidebar_right {
	right: 0;
	background-color: #fff;
}

.sidebar_right ul {
	border-left: 1px dotted #CCC;
}

.sidebar_right ul li a {
	display: block;
	height: 50px;
	line-height: 50px;
	padding-left: 25px;
    margin-left: -1px;
	border-left: 1px solid rgba(0,0,0,0);
}

.sidebar_right, .sidebar_right ul{
	height: 100%;
	z-index: 1;
}

.sidebar_right ul li a:hover {
    	border-left: 1px solid #555;
}

.sidebar_right .current-cat a, .sidebar_right .current-cat a:hover {
	border-left: 1px solid #2FB0BB;
	color: #2FB0BB;
}

/*アイキャッチより下、フッターより上==============================*/
.wlole_contents {position: relative;}

/*センター==============================*/

.center {
	width: 770px;
	margin: 0 auto;
	padding-bottom: 120px;
}

.tag_l {
	display: inline-block;
	padding: 0 30px;
	height: 30px;
	line-height: 30px;
}


/*メイン(記事部分)==============================*/

.main {
	padding-top: 100px;
}

.main time {
	margin-left: 10px;
}

.single .main ol {
	counter-reset: li;
}
 
.single .main ol li {
	list-style: none;
	position: relative;
	padding-left: 2.5em;
	height: 40px;
	line-height: 40px;
}

.single .main ol li:before {
	counter-increment: li;
	content: counter(li);
	margin-right: 1em;
	background: #333;
	color: #fff;
	text-align: center;
	width: 30px;
	height: 30px;
	position: absolute;
	left: 0em;
	top: 2px;
	line-height: 30px;
	font-size: 16px;
}

.single .main .column_contents h2 {
	height: 75px;
	line-height: 75px;
	padding-left: 30px;
	margin-top: 60px;
	font-weight: bold;
	font-size: 25px;
	margin-bottom: 30px;
}

.single .main .column_contents h3 {
	padding: 10px 30px;
	margin-top: 45px;
	font-weight: bold;
	font-size: 20px;
	border-bottom: 7px solid #F5F5F5;
	margin-bottom: 30px;
}

.main .column_contents p, .single .main .column_contents ul, .single .main .column_contents ol {
	margin-bottom: 30px;
	padding-left: 30px;
}

.page_nav a {
	display: inline-block;
	width: 30px;
	height: 30px;
	color: #333;
}

/*ページナビゲーション==============================*/

.page_nav a:first-child {
	margin-right: 10px;
}

.page_nav a:last-child {
	margin-left: 10px;
}


/*中央下部のおすすめ記事==============================*/

.bottom ul {
	border-top: 1px solid #BBB;
	margin-top: 10px;
}

.bottom img {
	width: 150px;
	height: 100px;
	display: inline;
}

.bottom ul li {
	border-bottom: 1px dotted #CCC;
}

.bottom ul li a{
	display: block;
	padding: 25px 30px;
	width: 710px;
	height: 100px;
}

.bottom ul li:last-child {
	border: none;
}

.btm-li-inner {
	display: table-row;
}

.va_middle {
	display: table-cell;
	vertical-align: middle;
}


/*フッター==============================*/

footer {
	width: 100%;
	height: 110px;
	padding-top: 50px;
	border-top: 1px solid #DDD;
	position: relative;
	z-index: 50;
	background-color: #FFF;
}

footer p {
	text-align: center;
}

/*カテゴリーページ==============================*/

.category .center {
    padding-top: 30px;
	min-height: 500px;
}

.category .center li {
    border-bottom: dotted 1px #DDD;
}

.category .center li:last-child {
    border-bottom: none;
}

.cat_main_loop {
    display: block;
    width: 710px;
    height: 190px;
    padding: 30px;
}

.cat_main_loop img {
	width: 285px;
	height: 190px;
	float: left;
}

.cat_main_loop .right {
    width: 380px;
	height: 190px;
}
