@charset "UTF-8";  /* clearfix */ .cf { zoom: 1; } .cf:before, .cf:after { content: ""; display: table; } .cf:after { clear: both; }  @import url(https://fonts.googleapis.com/css?family=Lato:400,700); body{ 	font-family: Lato, "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; 	background-color:#252d33; 	word-break : break-all; 	word-wrap : break-word; 	overflow-wrap : break-word; }  a { outline-style: none; text-decoration: none; color: #0066cc; } a:hover { color:#74bc47; } a:active {}  img { border: none; } img:hover { opacity: 0.7 ; }  #contents { max-width:1200px; margin:15px auto 15px auto; background-color:#e3e7ea; }  #heads { background:#3f5465; text-align: center; } #foots { background:#3f5465; text-align: center; } .footsbar { padding:10px; } .footsbar a { color:#FFF; }  #footercode { text-align: center; color:#000000; font-size:80%; }  .images { max-width:320px; min-width:240px; }  ol.normail_ol { margin: 1em 0; padding-left: 40px; list-style-type: decimal; } .top5 { padding-top:5px; }     /*font-awesome custom*/ .faten { padding-right:10px; } .fanone { padding-right:2px; }  /*Change icons size here*/ .social-icons .fa { 	font-size: 16px; } /*Change icons circle size and color here*/ .social-icons .fa { 	width: 40px; 	height: 40px; 	line-height: 40px; 	text-align: center; 	color: #FFF; 	color: rgba(255, 255, 255, 0.8); 	-webkit-transition: all 0.3s ease-in-out; 	-moz-transition: all 0.3s ease-in-out; 	-ms-transition: all 0.3s ease-in-out; 	-o-transition: all 0.3s ease-in-out; 	transition: all 0.3s ease-in-out; }  .social-icons.icon-circle .fa{  	border-radius: 50%; } .social-icons.icon-rounded .fa{ 	border-radius:5px; } .social-icons.icon-flat .fa{ 	border-radius: 0; }  .social-icons .fa:hover, .social-icons .fa:active { 	color: #FFF; 	-webkit-box-shadow: 1px 1px 3px #333; 	-moz-box-shadow: 1px 1px 3px #333; 	box-shadow: 1px 1px 3px #333;  } .social-icons.icon-zoom .fa:hover, .social-icons.icon-zoom .fa:active {   	-webkit-transform: scale(1.1); 	-moz-transform: scale(1.1); 	-ms-transform: scale(1.1); 	-o-transform: scale(1.1); 	transform: scale(1.1);  } .social-icons.icon-rotate .fa:hover, .social-icons.icon-rotate .fa:active {  	-webkit-transform: scale(1.1) rotate(360deg); 	-moz-transform: scale(1.1) rotate(360deg); 	-ms-transform: scale(1.1) rotate(360deg); 	-o-transform: scale(1.1) rotate(360deg); 	transform: scale(1.1) rotate(360deg); }   .social-icons .fa-adn{background-color:#504e54;}  .social-icons .fa-apple{background-color:#aeb5c5;}  .social-icons .fa-android{background-color:#A5C63B;}   .social-icons .fa-bitbucket,.social-icons .fa-bitbucket-square{background-color:#003366;}  .social-icons .fa-bitcoin,.social-icons .fa-btc{background-color:#F7931A;}  .social-icons .fa-css3{background-color:#1572B7;}  .social-icons .fa-dribbble{background-color:#F46899;}   .social-icons .fa-dropbox{background-color:#018BD3;} .social-icons .fa-facebook,.social-icons .fa-facebook-square{background-color:#3C599F;}   .social-icons .fa-flickr{background-color:#FF0084;} .social-icons .fa-foursquare{background-color:#0086BE;} .social-icons .fa-github,.social-icons .fa-github-alt,.social-icons .fa-github-square{background-color:#070709;}  .social-icons .fa-google-plus,.social-icons .fa-google-plus-square{background-color:#CF3D2E;}  .social-icons .fa-html5{background-color:#E54D26;} .social-icons .fa-instagram{background-color:#A1755C;} .social-icons .fa-linkedin,.social-icons .fa-linkedin-square{background-color:#0085AE;}  .social-icons .fa-linux{background-color:#FBC002;color:#333;} .social-icons .fa-maxcdn{background-color:#F6AE1C;} .social-icons .fa-pagelines{background-color:#241E20;color:#3984EA;} .social-icons .fa-pinterest,.social-icons .fa-pinterest-square{background-color:#CC2127;}  .social-icons .fa-renren{background-color:#025DAC;} .social-icons .fa-skype{background-color:#01AEF2;} .social-icons .fa-stack-exchange{background-color:#245590;} .social-icons .fa-stack-overflow{background-color:#FF7300;} .social-icons .fa-trello{background-color:#265A7F;} .social-icons .fa-tumblr,.social-icons .fa-tumblr-square{background-color:#314E6C;}  .social-icons .fa-twitter,.social-icons .fa-twitter-square{background-color:#32CCFE;}  .social-icons .fa-vimeo-square{background-color:#229ACC;} .social-icons .fa-vk{background-color:#375474;} .social-icons .fa-weibo{background-color:#D72B2B;} .social-icons .fa-windows{background-color:#12B6F3;} .social-icons .fa-xing,.social-icons .fa-xing-square{background-color:#00555C;}  .social-icons .fa-youtube,.social-icons .fa-youtube-play,.social-icons .fa-youtube-square{background-color:#C52F30;} .social-icons .fa-get-pocket{background-color:#ee4056;} .social-icons .fa-envelope-o{background-color:#AAA;}      /*SNSボタン*/ #social { text-align: center; padding:10px 0; }  ul.share-buttons{ list-style: none; padding: 0; } ul.share-buttons li{ display: inline; } ul.share-buttons .sr-only { position: absolute; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px); padding: 0; border: 0; height: 1px; width: 1px; overflow: hidden; }    /*banner*/ .bninput { text-align:center; margin:10px auto; } @media only screen and (max-width: 330px) { 	.bninput { margin-left:-10px; } }  /* menu */ #menu-box { margin:0 0 0 0; } #menu{ width: 100%; /*max-width: 960px;*/ margin: 0 auto; padding: 0; } #menu li{ display: block; float: left; width: 12.5%; margin: 0; padding: 0; border-right: 1px solid #444; border-bottom: 1px solid #444; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box; } #menu li a{ display: block; padding: 10px 0 10px; background: #333; color: #fff; text-align: center; text-decoration: none; } #menu li a:hover{ background: #666; } @media only screen and (max-width: 768px) { 	#menu li{ width: 25%; border-bottom: 1px solid #666; } }    /*  midashi */ .titlesub { background:#38b1e9; color:#FFF; padding:15px 0 15px 0; text-align: center; }    /*  list    */ .boxbox { background:#FFF; width:98%; margin:10px auto; } .contsbox { padding:10px; }  .viewbox { background:#ffebbb; width:98%; margin:10px auto; border: 2px solid #ffca13; } .viewtext { display: block; padding:20px 10px; font-weight:bold; line-height:1.4; } .viewtextred { display: block; color:red; padding:20px 10px; font-weight:bold; line-height:1.4; }   .listlinebox { background:#FFF; width:98%; margin:10px auto; } .listline li { display: block; float: left; width: 50%; color: #0066cc; /*font-size: 15px;*/ padding-top: 10px; padding-bottom: 10px; padding-left: 10px; border-bottom:1px solid #AAA; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box; } @media only screen and (max-width: 768px) { 	.listline li { display: block; float: none; width: 100%; color: #0066cc; font-size: 15px; padding-top: 10px; padding-bottom: 10px; padding-left: 5px; border-bottom:1px solid #AAA; } }  .listcardbox { width:98%; margin:10px auto; } ul.listcard { width:100%; max-width:100%: display:-webkit-box; display:-moz-box; display:box; display:-webkit-flex; display:flex; /*display:inline;*/  -webkit-box-pack:start;-moz-box-pack:start;-webkit-flex-pack:start;-moz-flex-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;-moz-justify-content:flex-start;justify-content:flex-start; -webkit-align-items: stretch; /* Safari */ align-items: stretch; -webkit-flex-wrap: wrap; flex-wrap: wrap;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;  } .listcard li { border-radius: 5px; background:#FFF; width:-webkit-calc(33.3% - 10px); width:calc(33.3% - 10px); max-width:-webkit-calc(33.3% - 10px); max-width:calc(33.3% - 10px); margin:5px; padding:15px; box-shadow: 0 2px 5px #ccc; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;  } @media only screen and (max-width: 768px) { 	.listcard li { border-radius: 5px; background:#FFF; width:100%; max-width:100%; margin:5px 0; padding:10px; box-shadow: 0 2px 5px #ccc; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box; } }  .newmark { color:#ff0202; font-size:80%; } .catmark { color:#74bc47; font-size:80%; } .labelcat { margin-left:2px; white-space: nowrap; } .labelcat a { background:#74bc47; color:#FFF; font-size:75%; padding:2px 6px; vertical-align:15%; } .labelcat a:hover { background:#DDD; color:#74bc47; }  .com_link { padding:5px; margin:5px; border-bottom: 1px solid #CCC; line-height:1.3; } .com_no { font-size:75%; color:#666; } .com_name {} .com_ua { font-size:75%; color:#AAA; } .com_date { font-size:75%; color:#AAA; padding:5px 0; } .com_com { font-size: 90%; }    /* pagenavi*/ ul.pagenavi { margin:10px 0; padding: 0 10px 0; text-align: center; } ul.pagenavi li { display: inline; margin: 0 2px; padding: 0; } ul.pagenavi li a { display: inline-block; margin-bottom: 0px; padding: 5px 10px; background: #fff; border: 1px solid #AAA; border-radius:5px; text-decoration: none; vertical-align: middle; } ul.pagenavi li a:hover { background: #eeeff7; }    /* pankuzu */ ol.pankuzu { display:-webkit-box; display:-moz-box; display:box; display:-webkit-flex; display:flex; background:#FFF; font-size:75%; width:98%; max-width:98%; margin:10px auto 0 auto; padding:10px; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box; } ol.pankuzu li { padding-right:10px; } .pan { padding-right:10px; }    /* article */ #article { background:#fffbee; width:98%; margin:10px auto 0 auto; padding:30px 10px 30px 10px; line-height:1.4; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box; } @media only screen and (max-width: 330px) { 	#article { width:100%; } }  .foldtl {   position: relative; user-select:none; -webkit-user-select:none; -ms-user-select: none; -moz-user-select:none; -khtml-user-select:none; -webkit-user-drag:none; -khtml-user-drag:none; } .foldtl:before { content: ""; position: absolute; top: 0%; left: 0%; width: 0px; height: 0px; border-bottom: 20px solid #ded59b; border-left: 20px solid transparent; -webkit-box-shadow: 2px 2px 2px rgba(0,0,0,0.1); -moz-box-shadow: 2px 2px 2px rgba(0,0,0,0.1); box-shadow: 2px 2px 2px rgba(0,0,0,0.1); } .foldtl:after { content: ""; position: absolute; top: 0%; left: 0%; width: 0px; height: 0px; border-top: 20px solid #e3e7ea;  border-right: 20px solid transparent; }    /* touhyou */ .texttitle { display: block; padding-top:15px; font-size: 80%; text-align:center; } .textpt { display: block; padding-top:5px; font-size: 75%; color:#666; text-align:center; } .textptnum { font-size:150%; color:#ff0202; font-weight:bold; } .ptext { display: block; font-size: 80%; } .atentext { display: block; font-size: 80%; padding-top:10px; } /*.ptextid { display: block; padding-top:5px; font-size: 80%; color:#666; }*/ #touhyoubox { text-align: center; margin:15px auto; } .btn { 	text-decoration: none; 	border: 1px solid #74bc47; 	padding: 5px 20px; 	text-align: center; 	color: #FFF; 	background-color: #74bc47; 	border-color: #74bc47; 	border-radius:5px; } .btn:hover, .btn:focus { 	color:#91dd8e; 	background-color:#74bc47; 	border-color: #74bc47; } .btsdw { 	outline:none; 	box-shadow: 0 5px 0 #599832; 	position: relative; 	top: 0; 	-moz-transition: 100ms all linear; 	-o-transition: 100ms all linear; 	transition: 100ms all linear; } .btsdw:hover, .btsdw:focus { 	box-shadow:none; 	top: 5px; }  /* com form*/ ul#comform { margin:15px 10px; padding:10px; } ul#comform li { padding:10px 0; } label { 	font-size:80%; 	font-weight:bold; 	display:block; 	margin-bottom:10px; } input[type="text"], textarea { 	width:100%; 	max-width:640px; 	border: 1px solid #c7c7c7; 	outline: 5px solid rgba(0, 0, 0, 0.1); 	padding: 3px 0; 	background:#EEE; } select { /*	width:20%; 	min-width:120px; 	max-width:640px;*/ 	border: 1px solid #c7c7c7; 	outline: 5px solid rgba(0, 0, 0, 0.1); 	padding: 3px 0; 	background:#EEE; } input[type="text"]:focus, textarea:focus, select:focus { 	background:#FFF; }   /* ranking*/ .tabrow {     text-align: center;     list-style: none;     margin: 0 0 -10px 0;     /*padding: 0;*/     border-bottom: 10px solid #38b1e9; } .tabrow li {     margin: 0;     padding: 10px;     /*border: 1px solid #AAA;*/     background: #333;     display: inline-block;     border-top-left-radius: 5px;     border-top-right-radius: 5px; } .tabrow li.selected {     background: #38b1e9;     color: #FFF; } .tabrow li a{ color:#FFF; } .tabrow li.selected a{ color:#FFF; }  .tabrow {     position: relative; } .tabrow:after {     position: absolute;     content: "";     width: 100%;     bottom: 0;     left: 0;     z-index: 1; } .tabrow:before {     z-index: 1; } .tabrow li {     position: relative;     z-index: 0; } .tabrow li.selected {     z-index: 2; }          /* imobile */ .imobile_infeed_spot{ width:auto!important; } .imobile_infeed{ width:100%!important; } .imobile_infeed_body{ float:none!important; width:auto!important; padding-left:67px!important; margin:0!important; } .imobile_infeed_title{ width:auto!important; } .imobile_infeed_description{ width:auto!important; }