/*
当サイトのテキスト及び画像、それに伴う全ての無断転載は禁止いたします。
発見した場合は法的処置も視野にいれております。絶対に無断転載はお止めください。
*/

/* CSS Document */
* {
	margin: 0px;
	padding: 0px;
}
body {
	word-break: break-all;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, Helvetica;
	font-size: 14px;
	line-height: 18px;
	background-color: #E3E3E3;
}
#header {
	background: rgb(69,72,77); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(69,72,77,1) 0%, rgba(0,0,0,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(69,72,77,1)), color-stop(100%,rgba(0,0,0,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%); /* W3C */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
	height: 100px;
}
#logo{
	width: 1040px;
	margin-right: auto;
	margin-left: auto;
}
#footer{
	color: #fff;
	line-height: 40px;
	font-size: 12px;
	font-weight: bold;
	text-shadow: 0px -1px 1px rgba(0,0,0,0.5);
	background-color: #000000;
}
#content {
	padding-top: 10px;
	width: 1160px;
	margin-right: auto;
	margin-left: auto;
}
#right_box {
	float: left;
	width: 220px;
}
#left_box {
	width: 340px;
	float: left;
}
#center_box {
	margin-left:20px;
	float: left;
	width: 800px;
}
.title {
	font-size: 18px;
	font-weight: bold;
	padding-left: 15px;
	line-height: 30px;
	margin-bottom: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-right: 5px;
	margin-right: auto;
	margin-left: auto;
	background-color: #E9E9E9;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-color: #A8A8A8;
	border-width: 2px;
}
.title p {
	margin-bottom: 0px;
	color: #333;
}.box,
#comment,
#anc a {
	padding: 10px;
	margin-bottom: 20px;
	margin-right: auto;
	margin-left: auto;
	border: 1px solid #969696;
	background-color: #FFFFFF;
}
.sub_box {
	background-color: #f7f7f7;
	border: 1px dashed #C3C3C3;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	padding-top: 15px;
	margin-bottom: 100px;
}
.ad_box_200 {
	width: 200px;
	margin-bottom: 15px;
	margin-left: 10px;
	border: 2px solid #A8A8A8;
	background-color: #FFF;
}
.ad_box_320 {
	width: 320px;
	margin-bottom: 15px;
	margin-left: 10px;
	border: 2px solid #A8A8A8;
	background-color: #FFF;
}
.s_title {
	font-size: 13px;
	background-color: #E9E9E9;
	margin-right: auto;
	margin-left: auto;
	padding: 5px 0px;
	line-height: 20px;
	color: #333;
	font-weight: bold;
	text-align: center;
	border-bottom: 2px solid #A8A8A8;
}
.ad_box_320 .s_title {
	margin-bottom: 10px;
}

.source_link {
	text-align: right;
	margin: 15px 10px;
	font-size: 11px;
}
.source_link:before {
	content: "</>";
    margin-right: 5px;
	color: #FFF;
	background-color: #888;
	font-weight: bold;
	font-size: 9px;
	padding: 5px 2px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	-o-border-radius: 15px;
	-ms-border-radius: 15px;
	border-radius: 15px;
}
.addition {
	color: #666;
	padding: 0px 5px;
	font-size: 11px;
}
#center_box .addition {
	float: left;
}
#right_box .addition {
	margin-bottom: 10px;
}
#right_box .banner {
	text-align: center;
}
/*----------fam_news----------*/
#fam_news {
	margin-bottom: 10px;
}
#fam_news ul{
	list-style-type: none;
	width: 750px;
	padding-left: 10px;
	padding-right: 10px;
}
#fam_news ul li{
	border-bottom: 1px dashed #C4C4C4;
	padding: 5px 20px;
	background-image: url(../news_arrow.png);
	background-repeat: no-repeat;
	background-position: 5px center;
}
#fam_news ul li a {
	font-size: 100%;
	color: #333;
	text-decoration: none;
}

/*----------fam_rec----------*/
.fam_rec {
	margin-bottom: 10px;
	margin-left: auto;
	margin-right: auto;
}
.fam_rec a {
	width: 250px;
	height: 208px;
	float: left;
	display: block;
	margin-left: 2px;
	margin-right: 2px;
	border: 2px solid #BBBBBB;
	overflow: hidden;
}
.fam_rec a div span {
	width:240px !important;
	margin-left:-125px !important;
}
/*----------fam_hover_banner----------*/
#fam_hover_banner a div > img {
	-moz-transition: all 0.3s linear;
	-webkit-transition: all  0.3s linear;
	-o-transition: all 0.3s linear;
	-ms-transition: all  0.3s linear;
	transition: all  0.3s linear;
}
#fam_hover_banner a div > img:hover {
	opacity: 0.7;
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
}

/*----------fam_hover_txt----------*/
#fam_hover_txt a {
	position: relative;
}
#fam_hover_txt a span {
	height: 56px;
}
#fam_hover_txt a .next {
	color: #FFF;
	font-weight: bold;
	font-size: 16px;
	text-align: center;
	position: absolute;
	bottom: 0px;
	width: 250px;
	z-index: 10;
	opacity: 0;
}

/*----------fam_thumb_left----------*/
.fam_thumb_left {
	margin-bottom: 10px;
}
.fam_thumb_left a {
	display: block;
	padding: 10px;
	border-bottom: dashed 1px #D0D0D0;
	text-decoration: none;
	font-size: 18px;
	font-weight: bold;
	line-height: 25px;
	color: #333;
}
.fam_thumb_left a div div {
	border: solid 2px #555;
}
.fam_thumb_left a .fam_time {
	font-size: 14px;
	color: #888;
	margin-bottom: 5px;
}
/*----------fam_thumb_top----------*/
.fam_thumb_top {
	margin-bottom: 10px;
	margin-left: 10px;
}
.fam_thumb_top a {
	display: block;
	padding: 10px;
	width: 350px;
	border: solid 2px #D0D0D0;
	float: left;
	margin-right: 10px;
	text-decoration: none;
	font-size: 18px;
	font-weight: bold;
	line-height: 25px;
	color: #333;
}
.fam_thumb_top a div span {
	display: block;
	min-height: 100px;
}
.fam_thumb_top a div div img,
.fam_thumb_top a div div {
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius: 10px;
}
.fam_thumb_top a .fam_time {
	font-size: 14px;
	color: #888;
	padding-top: 10px;
	text-align: right;
	border-top: solid 1px #d0d0d0;
}
/*----------fam_rec_s ----------*/
.fam_rec_s {
	margin-bottom: 10px;
}
.fam_rec_s a {
	width: 180px;
	height: 150px;
	display: block;
	margin: 10px auto 0px;
	overflow: hidden;
	font-size: 11px;
	line-height: 15px;
}
.fam_rec_s a div span {
	width:170px !important;
	margin-left:-90px !important;
	background-color: rgba(255,255,255,0.7) !important;
	color: #333 !important;
}
.fam_rec_s a div span img {
	vertical-align: middle;
}

/*----------fam_hover_txt----------*/
#fam_hover_txt_s a {
	position: relative;
}
#fam_hover_txt_s a span {
	height: 45px;
}
#fam_hover_txt_s a .next {
	color: #333;
	font-weight: bold;
	font-size: 16px;
	text-align: center;
	position: absolute;
	bottom: 0px;
	width: 180px;
	z-index: 10;
	opacity: 0;
}

/*----------fam_thumb_left_s----------*/
.fam_thumb_left_s {
	margin-bottom: 10px;
}
.fam_thumb_left_s a {
	display: block;
	padding: 10px 5px;
	margin: 0px 5px;
	border-bottom: dotted 1px #D0D0D0;
	text-decoration: none;
	font-size: 11px;
	font-weight: bold;
	line-height: 15px;
	color: #333;
}
.fam_thumb_left_s a div div {
	border: solid 2px #CCC;
}

/*----------fam_thumb_top_s----------*/
.fam_thumb_top_s {
	margin-bottom: 10px;
}
.fam_thumb_top_s a {
	display: block;
	padding: 10px 5px;
	margin: 0px 5px;
	border-bottom: dotted 1px #D0D0D0;
	text-decoration: none;
	font-size: 11px;
	font-weight: bold;
	line-height: 15px;
	color: #333;
}
.fam_thumb_top_s a div div img,
.fam_thumb_top_s a div div {
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius: 10px;
}

/*----------fam_thumb_728----------*/
.fam_thumb_728 {
	background-color: #FFF;
	width: 726px;
	height: 88px;
	border: solid 1px #D0D0D0;
}
.fam_thumb_728 a {
	font-weight: bold;
	font-size: 13px;
	line-height: 16px;
	color: #333;
	float: left;
	display: block;
	padding: 0px 5px;
	margin: 4px 0px;
	width: 230px;
	height: 80px;
	border-right: solid 3px #D0D0D0;
	text-decoration: none;
	overflow: hidden;
}
.fam_thumb_728 a:last-child {
	border-right-style: none;
}

/*----------fam_thumb_468----------*/

.fam_thumb_468 {
	background-color: #FFF;
	width: 466px;
	height: 58px;
	border: solid 1px #D0D0D0;
}
.fam_thumb_468 a {
	font-weight: bold;
	font-size: 13px;
	line-height: 17px;
	color: #333;
	float: left;
	display: block;
	padding: 0px 5px;
	margin: 4px 0px;
	width: 222px;
	height: 50px;
	border-right: solid 2px #D0D0D0;
	text-decoration: none;
	overflow: hidden;
}
.fam_thumb_468 a:last-child {
	border-right-style: none;
}

/*----------fam_thumb_300----------*/

.fam_thumb_300 {
	background-color: #FFF;
	width: 298px;
	height: 248px;
	border: solid 1px #D0D0D0;
	margin-left: auto;
	margin-right: auto;
}
.fam_thumb_300 a {
	font-weight: bold;
	font-size: 13px;
	line-height: 16px;
	color: #333;
	float: left;
	display: block;
	padding: 0px 4px;
	margin: 4px 0px;
	width: 140px;
	height: 240px;
	border-right: solid 2px #D0D0D0;
	text-decoration: none;
	overflow: hidden;
}
.fam_thumb_300 a:last-child {
	border-right-style: none;
}

/*----------fam_thumb_300_600----------*/
.fam_thumb_300_600 {
	background-color: #FFF;
	width: 298px;
	height: 598px;
	border: solid 1px #D0D0D0;
	margin-left: auto;
	margin-right: auto;
}
.fam_thumb_300_600 a {
	font-weight: bold;
	font-size: 13px;
	line-height: 16px;
	color: #333;
	display: block;
	padding: 4px 0px;
	margin: 0px 5px 1px 5px;
	height: 90px;
	border-bottom: dotted 1px #D0D0D0;
	text-decoration: none;
	overflow: hidden;
}
.fam_thumb_300_600 a:last-child {
	border-bottom-style: none;
	margin-bottom: 0px;
}

/*----------fam_thumb_160_600----------*/
.fam_thumb_160_600 {
	background-color: #FFF;
	width: 158px;
	height: 598px;
	border: solid 1px #D0D0D0;
	margin-left: auto;
	margin-right: auto;
}
.fam_thumb_160_600 a {
	font-weight: bold;
	font-size: 13px;
	line-height: 16px;
	color: #333;
	display: block;
	padding: 5px 0px;
	margin: 0px 4px 1px 4px;
	height: 288px;
	border-bottom: dotted 1px #D0D0D0;
	text-decoration: none;
	overflow: hidden;
}
.fam_thumb_160_600 a:last-child {
	border-bottom-style: none;
	margin-bottom: 0px;
}

/*----------fam_thumb_200_200----------*/
.fam_thumb_200_200 {
	background-color: #FFF;
	width: 198px;
	height: 198px;
	border: solid 1px #D0D0D0;
	margin-left: auto;
	margin-right: auto;
}
.fam_thumb_200_200 a {
	font-weight: bold;
	font-size: 11px;
	line-height: 15px;
	color: #333;
	display: block;
	padding: 4px 0px;
	margin: 0px 4px 1px 4px;
	height: 90px;
	border-bottom: dotted 1px #D0D0D0;
	text-decoration: none;
	overflow: hidden;
}
.fam_thumb_200_200 a:last-child {
	border-bottom-style: none;
	margin-bottom: 0px;
}

/*----------------------------code----------------------------*/
#code_info #content {
	width: 1020px;
}
.fam_area {
	width: 380px;
	float: left;
}
.fam_area:last-child{
	float: right;
}
.code_title {
	background-color: #e6e6e6;
	padding: 10px 15px;
	margin-top: 20px;
	color: #555;
	border-bottom: solid 1px #ccc;
}
.code_title.last {
	margin-top: -30px;
}
.code_title span {
	color: #444;
}
#content pre {
	background-color:#f3f3f3;
	line-height: 1.5;
	overflow-x: scroll;
	padding: 15px;
	margin-bottom: 30px;
}
#content pre code {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	white-space: pre;
	word-break: normal;
	word-wrap: normal;
}
#content pre code.none {
	font-size: 11px;
	color: #999;
}
#code_info p {
	margin-top: 60px;
	margin-left: 10px;
	font-size: 22px;
}
#code_info p.first {
	margin-top: 30px;
}

#code_info p.sub_txt {
	font-size: 14px;
	line-height: 18px;
	margin-top: 10px;
	margin-right: 10px;
	padding: 5px;
	color: #666;
	margin-left: 2em;
	text-indent: -1.5em;
}
#code_info p.sub_txt:before {
	content: "●";
	color: #2e73b9;
	font-weight: bold;
	margin-right: 0.5em;
}

#top_btn,
#sp_btn {
	display: block;
	background-color: #111;
	border: solid 3px #666;
	color: #FFF;
	line-height: 80px;
	font-size: 35px;
	margin: 10px 60px 0px 20px;
	padding-top: 20px;
	width: 100px;
	text-align: center;
	text-decoration: none;
	background-image: url(../images/arrow_top.png);
	background-repeat: no-repeat;
	background-position: center 10px;
	-webkit-border-radius: 53px;
	-moz-border-radius: 53px;
	-o-border-radius: 53px;
	-ms-border-radius: 53px;
	border-radius: 53px;
}
#sp_btn {
	background-image: url(../images/arrow_top.png);
}

/* font color use */

a {
	color: #0083FF;
}
a:hover{
	color: #FFA600;
}
.green {
	color: #008000;
}
.red {
	color: #FF0000;
}
.gray {
	color: #999999;
}
.blue {
	color: #3300FF;
}
.orange {
	color: #F60;
}
.pink {
	color: #F3F;
}
.purple {
	color: #90F;
}
.dark_blue {
	color: #000099;
}
.txt18 {
	font-size: 18px;
}
.txt20 {
	font-size: 20px;
}
.txt24 {
	font-size: 24px;
}
.txt28 {
	font-size: 28px;
}
.txt32 {
	font-size: 32px;
}
.txt36 {
	font-size: 36px;
}
.txt40 {
	font-size: 40px;
}
.center {
	text-align: center;
}

/*--------------------clearfix--------------------*/
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
* html .clearfix { zoom: 1; } /* IE6 */
.clear {
	clear: both;
}
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
/*--------------------20161017追加---------------------------*/
.sample_title{
	background-color: rgba(36, 0, 255, 0.13);
	font-size: 18px;
	font-weight: bold;
	padding-left: 15px;
	line-height: 30px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-right: 5px;
	margin-right: auto;
	margin-left: auto;
	border-top-style: solid;
	border-bottom-style: solid;
	border-color: #A8A8A8;
	border-width: 2px;
}
.sample_title:first-child{
	border-top-style: none;
	
}
#right_box .ad_box_200 .sample_link a{
	color: #0000ff;
}
#right_box .ad_box_200 .sample_link a p{
	padding: 20px 0 20px 5px;
	font-weight: bold;
	font-size: 16px;
	background-image: url(../images/news_arrow.png);
	background-repeat: no-repeat;
	background-position: right center;
}