/* Eric Meyer's Reset CSS v2.0 - http://cssreset.com */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	margin: 0;
	padding: 0
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block
}
body {
	line-height: 1
}
ol, ul {
	list-style: none
}
blockquote, q {
	quotes: none
}
blockquote:before, blockquote:after, q:before, q:after {
	content: none
}
table {
	border-collapse: collapse;
	border-spacing: 0
}
body, input, textarea {
	/*	font-family: 'Open Sans', 'Lucida Grande', Meiryo, メイリオ, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', sans-serif;
*/
/*	font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', Arial, Helvetica, sans-serif;
*/
font-family: Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-weight:500;
	color: #333;
	font-size: 14px;
	letter-spacing: .04em;
	word-spacing: .1em;
	line-height: 1em;
}

::selection {
	background:#00CDFF;
	color:#FFF;
}
	 
::-moz-selection {
	background:#00CDFF;
	color:#FFF;
}

a {
	color: #2C3E50;
	text-decoration: none;
}
a.l {
	color: #2C3E50;
	border-bottom: solid 1px #ccc;
}
a.h:hover {
	color: #2C3E50;
	border-bottom: dashed 1px #2C3E50;
}
a.b {
	background-color: #FFF;
}
a.b:hover {
	background-color: #00CDFF;
	color: #FFF;
}
strong {
	font-weight: bold;
}
li {
	list-style: none;
}
body {
	padding: 0;
	background: #ECF0F1;
}
img {
	vertical-align: bottom;
}
#header {
	width: 100%;
	height: 130px;
	top:0;
	left:0;
	background: #00CDFF;
	position: relative;
	z-index:10;
}
#header h1 {
	position: absolute;
	top: 17px;
	left: 60px;
}
#header .inner {
	width: 1240px;
	margin: 0 auto;
	position: relative;
	height: 130px;
}
#header .hd-search {
	position: absolute;
	bottom: 20px;
	right: 0;
}
#header .hd-search .search-field {
	border: none;
	background: #FFF;
	width: 380px;
	padding: 5px;
	outline: none;
	margin: 0;
	height: 25px;
	vertical-align: top;
	display: inline-block;
}
#header .hd-search a.submit {
	height: 35px;
	width: 45px;
	border: none;
	background: #0097BD;
	display: block;
	color: #FFF;
	margin: 0;
	display: inline-block;
	text-align: center;
	vertical-align: middle;
	line-height: 2.65em;
}
#header .hd-search a.submit i {
	font-size: 1.5em;
	margin: 0;
}
#header .hd-social {
	position: absolute;
	top: 20px;
	right: 5px;
}
#header .hd-social ul li {
	display: inline-block;
}
#header .hd-social ul li a {
	color: #0097BD;
	display: block;
	width: 20px;
	height: 22px;
	margin: 0 0 0 20px;
}
#header .hd-social ul li a i {
	color: #0097BD;
}
#header .hd-social ul li a:hover i {
	color: #0097BD;
}
#header .hd-social ul li a:hover i {
	color: #FFF;
}
#header .hd-social ul li a:hover {
	color: #FFF;
}
#header .hnav {
	position: absolute;
	top: 22px;
	right: 150px;
}
#header .hnav ul {
	overflow: hidden;
	height: auto;
}
#header .hnav li {
	float: left;
	margin: 0 20px 0 0;
}
#header .hnav li a {
	display: block;
	text-indent: 100%;
	overflow: hidden;
	height: 11px;
	white-space: nowrap;
}
#header .gnav {
	position: absolute;
	bottom: 18px;
	left: 230px;
}
#header .gnav ul {
	overflow: hidden;
	height: auto;
}
#header .gnav li {
	float: left;
	margin: 0 0px 0 0;
}
#header .gnav li a {
	width: 80px;
	text-align: center;
	display: block;
	color: #2C3E50;
	font-size:.9em;
}
#header .gnav li a:hover {
	color: #FFF;
}
#header .gnav li a i {
	display: block;
	margin: 0 auto 8px;
}
#header .gnav li a i.inverted {
	background-color: #0097BD;
	border: #0097BD 1px solid;
}
#header .gnav li a i.inverted.n1 {
	color: #F1C40F;
/*	color: #FFF;*/
}
#header .gnav li a i.inverted.n2 {
	color: #61DC95;
/*	color: #FFF;*/
}
#header .gnav li a i.inverted.n3 {
	color: #5AD9EF;
/*	color: #FFF;*/
}
#header .gnav li a i.inverted.n4 {
	color: #E67E22;
/*	color: #FFF;*/
}
#header .gnav li a i.inverted.n5 {
	color: #E74C3C;
/*	color: #FFF;*/
}
#header .gnav li a:hover i.inverted {
	background-color: #FFF;
	border: #FFF 1px solid;
	color: #0097BD;
}

#categories{
	margin:0;
	background:#0097BD;
}
#categories ul{
	overflow:hidden;
	height:auto;
	width:1240px;
	margin:0 auto;
	padding:0;
	text-align:left;
	letter-spacing: -.40em;
}

#categories ul li{
	display:inline-block;
	letter-spacing: .05em;
	margin:0 1px 0 0;
}
#categories ul li:hover{
	background:#2C3E50;
}

#categories ul li a{
	padding:12px 9px; 
	color:#FFF;
	display:block;
	font-size:.85em;
	line-height:1.2em;
	margin:0;
}
#categories ul li a:hover{
	background:#2C3E50;
	color:#FFF;
}

#categories ul li a i{
	color:#FFF;
	margin:0 6px 0 0;
}

#categories ul li a:hover i{
	color:#FFF;
}

#categories ul li ul{
	position:absolute;
	display:none;
	top:97px;
	left: -1px;
	right: 0;
	margin: auto;
	width:1219px;
	z-index:100;
	background:#2C3E50;
	text-align:left;
	padding:0 10px;
}

#categories ul li ul li{
	display:inline-block;
}

#categories ul li ul li a{
	padding:10px 10px; 
	color:#FFF !important;
	display:block;
	font-size:.85em;
	line-height:.85em;
}
#categories ul li ul li a:hover{
	color:#0097BD !important;
}


#header .spnav {
	display: none;
}
#contents {
	width: 1200px;
	width: 1240px;
	margin: 0 auto;
	overflow: hidden;
	height: auto;
	padding: 30px 0 30px;
}
#main {
	width: 920px;
	float: left;
	position: relative;
}
#aside {
	width: 260px;
	width: 300px;
	float: right;
}

#aside h2 {
	background: #F39C12;
	background: #FFF;
	color: #0097BD;
	text-align: center;
	padding: 30px 0 10px;
	margin:0;
	font-size:1.2em;
	line-height:1em;
	vertical-align:middle;
}

#aside h2 i{
	vertical-align:middle;
	margin:-1px 8px 0 0;
}
#aside h2 i.circular.icon{
	box-shadow: 0 0 0 .1em rgba(0,151,189,1) !important;
}

/*
#aside #aside-member h2 {
	background:#00CCFF !important;
	color: #FFF !important;
	line-height:1em !important;
}

#aside #aside-member h2 i.circular.icon{
	box-shadow: 0 0 0 .1em rgba(255,255,255,1) !important;
}
*/

#aside #aside-member p {
	text-align: center;
	color: #FFF;
	line-height: 1em;
}
#aside #aside-member p.login a {
	background: #2ECC71;
	background:#00CCFF;
	color: #FFF;
	display: block;
	padding: 20px 0;
	font-size: 1em;
	line-height: 1em;
}
#aside #aside-member p.login a:hover {
	background: #27AE60;
	background:#0097BD;
}
#aside #aside-member ul {
	border-top: solid 1px #EFEFEF;
	margin:20px 0 0;
}
#aside #aside-member ul li {
	border-bottom: solid 1px #EFEFEF;
}
#aside #aside-member ul li:last-child {
	border-bottom: none;
}
#aside #aside-member ul li a {
	padding: 20px 35px;
	display: block;
}
#aside #aside-member ul li a:hover {
	background: #ECF0F1;
}
#ranking .container {
	padding: 25px 20px 0 25px;
}
#ranking .row {
	margin: 0 0 20px;
	position: relative;
}
#ranking .row p.img {
	width: 90px;
}
#ranking .row p.title {
	width: 153px;
	padding: 0;
	position: absolute;
	left: 90px;
	top: 0px;
	height:80px;
	overflow:hidden;
	color: #7F8C8D;
	font-weight:500;
}
#ranking .row p.title a{
	border-bottom: dashed 1px #ccc;
}

#ranking .row p.rank {
	border-radius: 50%;
	height: 19px;
	width: 22px;
	padding: 4px 0 0 1px;
	text-align: center;
	color: #FFF;
	position: absolute;
	background: #BDC3C7;
	top: -7px;
	left: -7px;
	font-family: Arial;
}
#ranking .row p.rank.r1 {
	background: #E74C3C;
}

#aside-writer i {
	margin: 0 6px 0 0;
	vertical-align: top;
}
#aside-writer .container {
	padding: 25px 20px 0 25px;
}
#aside-writer .row {
	margin: 0 0 20px;
	position: relative;
	height:80px;
	text-align:left;
	
}
#aside-writer .row p.img {
	position: absolute;
	width: 90px;
}
#aside-writer .row .title {
	width: 153px;
	padding: 5px 0 0;
	position: absolute;
	left: 90px;
	top: 0px;
}

#aside-writer .row .title a{
	border-bottom: dashed 1px #ccc;
}

#aside-writer .row .title dt{
	line-height: 1.3em;
	font-size: 1em;
	margin:0 0 10px;
}
#aside-writer .row .title dt a{
	color: #0097BD;
}

#aside-writer .row .title dd{
	line-height: 1.3em;
	font-size: .9em;
	color: #7F8C8D;
}


#footer {
	text-align: center;
	border-top: #DDDFE1 solid 1px;
	padding: 30px 0;
	position: relative;
}
#footer .page-top {
	width: 40px;
	height: 40px;
	background: #00CDFF;
	position: fixed;
	right: 50px;
	bottom: 30px;
}
#footer .page-top a {
	color: #FFF;
	display: block;
	width: 37px;
	height: 35px;
	vertical-align: middle;
	padding: 5px 0 0 3px;
	text-align: center;
}
#footer .ftnav {
	margin: 0 0 30px;
}
#footer .ftnav ul li {
	display: inline-block;
	font-size: .9em;
	margin: 0 10px;
}
.ctn {
	margin: 0 0 20px;
	position: relative;
}
.ctn.c {
	text-align:center;
}
.ct {
	margin: 0;
	overflow: hidden;
	position: relative;
	height: auto;
}
.ctr {
	position: relative;
}

.bx {
	background: #FFF;
	border: #DDDFE1 solid 1px;
	border: #E2E4E7 solid 1px;
	overflow: hidden;
	height: auto;
	box-shadow: 0.2px 1px 1px rgba(0,0,0,.03);	
}
.bxp {
	background: #FFF;
	border: #DDDFE1 solid 1px;
	border: #E2E4E7 solid 1px;
	padding: 30px;
	overflow: hidden;
	height: auto;
	box-shadow: 0.2px 1px 1px rgba(0,0,0,.03);	
}

.sdw{
	box-shadow: 0.2px 1px 1px rgba(0,0,0,.03);	
}

.bxp {
	background: #FFF;
	border: #DDDFE1 solid 1px;
	padding: 30px;
	overflow: hidden;
	height: auto;
}

.hidden {
	display: none;
}
/* font */
.e {
	font-family: Arial;
	font-size: 0.9em;
}
.os {
	font-family: Open Sans;
	font-size: 1.1em;
	letter-spacing: 0.1em;
}
.sm {
	font-size: .9em;
	line-height: 1.7em;
}
.ssm {
	font-size: .85em;
	line-height: 1.8em;
}

.ind {
	margin-left: -0.6em;
}
.required {
	color: #C81C1E;
	margin: 0 0 0 5px;
}
.error-message {
	color: #D72023;
	font-size: .9em;
	margin: 5px 0 0;
}
/*  /font */

.articles {
	width: 920px;
	position: relative;
}

.articles-loading{
	width:100%;
	text-align:center !important;
	display:none;
	margin: 20px 0 0;
}
.bl {
	width: 198px;
	padding: 10px;
	background: #FFF;
	margin: 0 0 10px;
	position: absolute;
	top: 0;
	left: 0;
}
.tgl {
	display: block;
	width: 0;
	height: 0;
	top: 0;
	position: absolute;
	left: 0;
	border-right: 50px solid transparent;
}
.tgl.ad {
	border-top: 50px solid #1ABC9C;
}
.tgl.pr {
	border-top: 50px solid #F39C12;
}
.tgl p {
	top: -40px;
	position: absolute;
	width: 30px;
	left: 0;
	text-align: center;
	font-size: .9em;
	color: #FFF;
	-moz-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
}
.bl .social {
	width: 200px;
	height: 30px;
	margin: 0;
}
.bl .social ul {
	overflow: hidden;
	height: auto;
	padding: 0;
}
.bl .social li {
	width: 44px;
	height: 14px;
	float: left;
	padding: 8px 3px;
	color: #FFF;
	text-align: right;
	font-size: 0.85em;
	background: #ccc;
}
.bl .social li.fb {
	background: #254887;
}
.bl .social li.tw {
	background: #00AFE9;
}
.bl .info {
	padding: 15px 10px 10px;
	position:relative;
}

.bl .info.pd {
	padding: 40px 10px 10px;
}


.bl p.img {
}
.bl p.img img.mm1{
	margin:0 0 0 -1px;
}

#dis-archive .bl p.img img{
	width:198px;
	height:auto;
}

.bl p.date {
	font-family: Arial;
	font-size: 1.6em;
	line-height: 1em;
	margin: 0 0 10px;
}

.bl p.date.span {
	margin:18px 0 10px;
}
.bl p.date .year{
	font-size: .55em;
    vertical-align: top;
    margin:0 3px 0 0;
}

.bl p.date i {
	color: #95A5A6;
	margin: 0 3px 0 6px;
	vertical-align: top;
}
.bl p.time {
	font-family: arial;
	line-height: 1em;
	font-size: 1.2em;
	margin: 0 0 10px;
}
.bl p.notes {
	line-height: 1.4em;
	margin: 0 0 10px;
	font-size: 1em;
}
.bl h2 {
	line-height: 1.6em !important;
	font-size: 1em !important;
	text-align: left !important;
	font-weight: bold;
	padding: 0 !important;
	margin:0 !important;
}

.bl h2 a{
	border-bottom: dashed 1px #ccc;
}

.bl .count {
	position:absolute;
	right:0px;
	top:0px;
	background: #E74C3C;
	color:#FFF;
	padding:8px 8px;
	font-size:.9em;
}
.bl p.guest {
	margin-top: 10px;
	line-height: 1.5em;
	font-size:.9em;
	font-weight:500;
}

.bl .btn-play {
	margin-top: 10px;
}
.bl .btn-play a {
	display: block;
	text-align: center;
	font-size: .9em;
	background: #FFF;
	border: solid 1px #DDD;
	padding: 5px 0;
}
.bl .btn-play a:hover {
	background: #EFEFEF;
	color: #555;
}
.bl p.station {
	margin-bottom: 5px;
	font-size: .9em;
	font-weight: bold;
	color: #2C3E50;
	position:absolute;
	right:5px;
	top:17px;
}
.article-more-load{
	margin:40px 0 20px;
}

.article-more-load p{
	text-align:center;
}

.article-more-load p a#btn-article-load{
	border: solid 1px #34495E;
	margin:0 auto;
	font-size: 1em;
	text-align: center;
	padding: 5px 20px 8px;
	color: #34495E;
	line-height: 1em;	
}

.article-more-load p a#btn-article-load i.basic.icon.down{
	margin:0 !important;
	vertical-align:middle !important;
}

.article-more-load p a#btn-article-load:hover {
	background: #34495E;
	color: #ECF0F1;
}


#sidenav {
	display: none;
}
#shd-search {
	display: none;
}
#shd-categories {
	display: none;
}
#shd-social {
	display: none;
}
#modal {
	position: fixed;
	z-index: 4000;
	width: 100%;
	top: 0;
	display: none;
	left: 0;
	height: 100%;
	background-color: rgba(0,0,0,0.5);
}
#modal .panel {
	width: 400px;
	padding: 30px;
	display: none;
	position: relative;
	top: 50%;
	z-index: 4100;
	margin: 0 auto;
	text-align: center;
	background: #FFF;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
#modal .panel p {
	margin: 0 0 20px;
	line-height: 1.5em;
}
#modal .loading {
	text-align: center;
	display: none;
	color: #FFF;
	position: relative;
	top: 50%;
	z-index: 4100;
	margin: 0 auto;
	text-align: center;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
#modal .loading p {
	margin: 0 0 10px;
	line-height: 1.5em;
}
#modal .panel .actions {
	margin: 20px 0 0;
	display: none;
}
/* semantic override */

i {
	margin: 0 10px 0 0;
}
i.r {
	margin: 0 0 0 10px;
}
.ui.form input[type=color], .ui.form input[type=date], .ui.form input[type=datetime-local], .ui.form input[type=datetime], .ui.form input[type=email], .ui.form input[type=month], .ui.form input[type=number], .ui.form input[type=password], .ui.form input[type=search], .ui.form input[type=tel], .ui.form input[type=text], .ui.form input[type=time], .ui.form input[type=url], .ui.form input[type=week], .ui.form textarea {
	padding: 8px 10px;
	font-size: 0.9em;
}
.ui.form .field {
	clear: both;
	margin: 0 0 20px;
}
.ui.form .field.last {
	margin: 0;
}
.ui.form .field>label {
	margin: 0 0 8px;
	color: #2C3E50;
	font-size: .9em;
}
.ui.form .field>label i {
	color: #777;
}
.ui .button {
	font-weight: normal;
}

.ui.google.plus.button {
	text-transform:lowercase !important;
}

.ui.pocket.button {
	background-color: #EE4056;
	color: #FFF;
	text-transform:lowercase !important;
}

.ui.mixi.button {
	text-transform:lowercase !important;
	background-color: #D1AD5A;
	color: #FFF;
}

.ui.mixi.button span{
	text-transform:lowercase;
	font-weight:normal;
	margin-right: .6em;
}

.ui.hatena.button {
	background-color: #00A5DF;
	color: #FFF;
}

.ui.hatena.button span{
	text-transform:uppercase;
	font-weight:bold;
	margin-right: .6em;
}



i.icon, i.basic.icon {
	opacity: 1;
}
.two-column-grid, .three-column-grid {
	width: 100%;
}
.two-column-grid .row, .three-column-grid .row {
	padding: 0;
	position: relative;
	overflow: hidden;
	height: auto;
}
.two-column-grid .column {
	width: 450px;
	float: left;
	margin: 0;
	padding: 0;
	vertical-align: top;
}
.two-column-grid .column:last-child, .three-column-grid .column:last-child {
	float: right;
}
.two-column-grid.divider .column {
	width: 436px;
}
.two-column-grid .column.col-7 {
	width: 525px;
}
.two-column-grid .column.col-5 {
	width: 375px;
}
.two-column-grid .column.col-8 {
	width: 606px;
}
.two-column-grid .column.col-4 {
	width: 294px;
}
.two-column-grid .two-column-grid .column {
	width: 100%;
}
.two-column-grid .two-column-grid .column:first-child {
	width: 48.3%;
}
.two-column-grid .two-column-grid .column:last-child {
	width: 48.3%;
}
.two-column-grid.divider .column:first-child {
	margin: 0 39px 0 0px;
}
.three-column-grid .row {
	overflow: hidden;
	height: auto;
}
.three-column-grid .column {
	width: 293px;
	float: left;
	margin: 0;
	padding: 0;
	vertical-align: top;
}
.three-column-grid .column:first-child {
	margin: 0 20px 0 0px;
}
.three-column-grid .column:last-child {
}
.one-column-grid .column {
	width: 70%;
	margin: 0 auto;
	padding: 0;
	vertical-align: top;
}
.ui.vertical.icon.divider {
	color: #CCC;
}
.ui.red.message a {
	color: #A95252;
	border-bottom: solid 1px #A95252;
}

a.sxnbtn{
	display:block;
	padding:10px 20px;
	background:#00CDFF;
	text-align:center;
	color:#FFF !important;
	line-height:1em;
	box-shadow: 0 0 0 1px rgba(0,0,0,.08) inset;
}
a.sxnbtn.disabled{
	background:#95A5A6;
}

a:hover.sxnbtn{
	background:#0097BD;
}

a:hover.sxnbtn.disabled{
	background:#95A5A6;
}

.jasrac{
	overflow:hidden;
	height:auto;
	margin:20px 0 0;
	
}

.jasrac p.img{
	float:left;
	width:120px;
	
}

.jasrac p.number{
	float:right;
	width:180px;
	font-size:0.9em;
	line-height:1.5em;
	padding:30px 0 0;
}
