@charset "utf-8";

/*-----------------------------------------------------------------------------------------
common for all
-----------------------------------------------------------------------------------------*/
a {
outline: 0;
color: #FF794C;
text-decoration: underline;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
transition: all 0.5s;
}

a:hover {
text-decoration: none;
}

h2 {
font-size: 108%;
color: #fff;
}

.radius {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
behavior: url(../pie/PIE.htc);
position: relative;
}

.border {
border: 1px dashed #bbb;
padding: 10px;
font-size:13px;
}

.border.no-blockquote {
border: 1px solid #bbb;
}

.border-top {
border-top: 1px solid #ddd;
margin: 20px 0;
padding: 20px 0 0 0;
}


.noborder {
padding: 10px;
font-size: 13px;
}


.mgt10 {
margin-top: 10px !important;
}

.mgb0 {
    margin-bottom:0 !important;
}

.mgb-20 {
margin-bottom: -20px !important;
}

.mgb10 {
margin-bottom: 10px !important;
}

.mgb25 {
margin-bottom: 25px !important;
}

.mgb50 {
margin-bottom: 50px !important;
}

.pd15 {
    padding-top:15px;
}

.pd10 {
    padding:0 10px !important;
}

.mb {
margin: 0 0 20px 0;
}

.t_right {
text-align: right !important;
}

.w95 {
width: 95%;
margin: 0 auto;
}

.disp_none {
display: none;
}

.disnon {
display: none;
}

.hide {
display: none;
}


#header .headerinner .pcnav p {
    display: none;
}

#header .headerinner p.login {
    float: left;
    margin: 0 14px;

    margin-top: 8px;
    padding-top: 2px;
    width: 280px;
    overflow: hidden;
}
#header .headerinner p.login a {
    color: #333;
    display: block;
    width: 225px;
    float: left;
    padding: 0 0 0 5px;
}
#header .headerinner p.login img {
    float: left;
    width: 20px;
}

/*-----------------------------------------------------------------------------------------
common for all
-----------------------------------------------------------------------------------------*/
a {
outline: 0;
color: #FF794C;
text-decoration: underline;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
transition: all 0.5s;
}

a:hover {
text-decoration: none;
}

h2 {
font-size: 108%;
color: #fff;
}

.radius {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
behavior: url(../pie/PIE.htc);
position: relative;
}

.border {
border: 1px dashed #bbb;
padding: 10px;
font-size:13px;
}

.border.no-blockquote {
border: 1px solid #bbb;
}

.border-top {
border-top: 1px solid #ddd;
margin: 20px 0;
padding: 20px 0 0 0;
}


.noborder {
padding: 10px;
font-size: 13px;
}


.mgt10 {
margin-top: 10px !important;
}

.mgb-20 {
margin-bottom: -20px !important;
}

.mgb10 {
margin-bottom: 10px !important;
}

.mgb25 {
margin-bottom: 25px !important;
}

.mgb50 {
margin-bottom: 50px !important;
}

.mb {
margin: 0 0 20px 0;
}

.t_right {
text-align: right !important;
}

.w95 {
width: 95%;
margin: 0 auto;
}

.disp_none {
display: none;
}

.disnon {
display: none;
}

.hide {
display: none;
}

/*----------------------------
clearfix (all)
----------------------------*/
.clear {
clear: both;
}

.clearfix {
overflow: hidden;
}

.clearfix,
footer #footerinner ul,
footer #footerinner02 ul {
zoom : 1;
}

.clearfix:after,
footer #footerinner ul:after,
footer #footerinner02 ul:after {
content: '';
display: block;
clear: both;
}

@media only screen and (max-width: 767px) {
.hide {
display: block;
}
}

/*-----------------------------------------------------------------------------------------
header
-----------------------------------------------------------------------------------------*/
#header {
-webkit-box-shadow: #dce2e3 3px 3px 3px;
-moz-box-shadow: #dce2e3 3px 3px 3px;
box-shadow: #dce2e3 3px 3px 3px;
behavior: url(../pie/PIE.htc);
position: relative;
background: #fff;
}

#header .headerinner {
padding: 10px 0 12px 0;
}

#header .logo_area {
float: left;
}

#header .headerinner h1 {
float: left;
font-size: 10px;
color: #333;
}

#header .headerinner h1 img {
width: 222px;
}

#header .headerinner .head_r {
float: right;
}

#header .headerinner .head_inner {
padding-top: 15px;
}

#header .sns-icon a {
display: block;
border: 1px solid #ccc;
}

#header .sns-icon a:hover {
background: #7e8c8d;
}

#header .headerinner .pcnav {
float: left;
margin-top: 2px;
}

#header .headerinner .pcnav h2 {
display: none;
}

#header .headerinner h1 span#aboutsite {
cursor: pointer;
}

#header .headerinner p span#aboutsite img {
width: 48px;
}

#header .headerinner li {
float: left;
margin-right: 5px;
}

/*----------------------------
displaychange (all:pc sp 切り替えボタン)
----------------------------*/
#displaychange {
display: none;
background: #fff;
background: -moz-linear-gradient(top, #fff 0%, #e5e5e5 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(100%, #e5e5e5));
background: -webkit-linear-gradient(top, #fff 0%, #e5e5e5 100%);
background: -o-linear-gradient(top, #fff 0%, #e5e5e5 100%);
background: -ms-linear-gradient(top, #fff 0%, #e5e5e5 100%);
background: linear-gradient(to bottom, #fff 0%, #e5e5e5 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff', endColorstr='#e5e5e5', GradientType=0);
}

#displaychange ul {
text-align: center;
padding: 10px 0;
margin: 0 0 10px 0;
}

#displaychange ul li {
display: inline;
text-align: center;
}

#displaychange ul li a {
color: #333;
text-decoration: none;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
behavior: url(../pie/PIE.htc);
position: relative;
background: #fff;
background: -moz-linear-gradient(top, #fff 0%, #e5e5e5 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(100%, #e5e5e5));
background: -webkit-linear-gradient(top, #fff 0%, #e5e5e5 100%);
background: -o-linear-gradient(top, #fff 0%, #e5e5e5 100%);
background: -ms-linear-gradient(top, #fff 0%, #e5e5e5 100%);
background: linear-gradient(to bottom, #fff 0%, #e5e5e5 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff', endColorstr='#e5e5e5', GradientType=0);
border: 1px solid #ddd;
padding: 5px 20px;
}

#displaychange ul li a:hover,
#displaychange ul li a.active {
background: #e5e5e5;
background: -moz-linear-gradient(top, #e5e5e5 0%, #fff 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e5e5e5), color-stop(100%, #fff));
background: -webkit-linear-gradient(top, #e5e5e5 0%, #fff 100%);
background: -o-linear-gradient(top, #e5e5e5 0%, #fff 100%);
background: -ms-linear-gradient(top, #e5e5e5 0%, #fff 100%);
background: linear-gradient(to bottom, #e5e5e5 0%, #fff 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#fff', GradientType=0);
}

/*----------------------------
google_translate_element (all:google翻訳)
----------------------------*/
#google_translate_element {
text-align: center;
}

/*----------------------------
mangaform (all:検索フォーム)
----------------------------*/
.mangaform {
float: left;
margin: 0 0 0 5px;
}

/*----------------------------
mangaform02 (index & calendar:検索フォーム)
----------------------------*/
.mangaform02 {
position: absolute;
bottom: 13px;
left: 10px;
}

.mangaform input,
.mangaform02 input {
-moz-transition: width 0.7s ease 0s;
background: #ecf0f1 url(../img/header/ico_search.png) right no-repeat;
padding: 6px 5px 6px 8px;
width: 160px;
border: 1px solid #eee;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
behavior: url(../pie/PIE.htc);
position: relative;
color: #7e8c8d;
outline: none;
}

/*----------------------------
mangaform03 (all:検索フォーム)
----------------------------*/
.mangaform03 {
text-align: center;
margin-bottom: 30px;
}

.mangaform03.admt {
margin: 0 0 30px 0;
}

.mangaform03 input {
-moz-transition: width 0.7s ease 0s;
background: #ecf0f1 url(../img/header/ico_search.png) right no-repeat;
padding: 6px 5px 6px 8px;
width: 68%;
border: 1px solid #eee;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
behavior: url(../pie/PIE.htc);
position: relative;
color: #7e8c8d;
outline: none;
}

.mangaform03 input#submitbtn {
width: 80px;
background: #666;
text-align: center;
color: #fff;
cursor: pointer;
}

.mangaform input:focus,
.mangaform02 input:focus,
.mangaform03 input:focus {
color: #333;
}

@media only screen and (max-width: 951px) {
.mangaform input {
width: 150px;
}
}

@media only screen and (max-width: 767px) {
.mangaform02 {
width: 230px;
margin: 10px auto;
clear: both;
display: block;
float: none;
position: relative;
bottom: inherit;
left: inherit;
}
}


@media only screen and (max-width: 479px) {
.mangaform03 input#submitbtn {
margin: 5px 0 0 0;
}
}


/*----------------------------
sitetxt (all:ヘッダー下部に表示されるサイト説明テキスト)
----------------------------*/
.sitetxt {
background: #f5f7f8;
padding: 12px 0;
font-size: 12px;
color: #666;
display: none;
}

@media only screen and (max-width: 951px) {
#header .logo_area {
float: none;
text-align: center;
}

#header .headerinner h1 {
float: none;
text-align: center;
}

#header .headerinner .head_r,
.content_l_pad .content_r,
.content_l_pad .content_l {
float: none;
}

#header .headerinner .head_r {
width: 90%;
margin: 0 auto;
}
}

@media only screen and (max-width: 767px) {
#header .headerinner .pcnav h2 {
display: block;
cursor: pointer;
position: absolute;
right: 10px;
top: 150px;
z-index: 1;
}

#header .headerinner h1 img {
width: 260px;
height: auto;
}

.headerinner .row,
#header .headerinner .head_r {
width: 100%;
}

#header .headerinner .pcnav ul {
margin: 10px 0 0 10px;
}

#header .headerinner .pcnav ul {
display: none;
}
}

/*-----------------------------------------------------------------------------------------
footer
-----------------------------------------------------------------------------------------*/
#footer {
background: #BE3830 top left repeat;
padding: 28px 0;
position: relative;
}

#footer a {
text-decoration: none;
color: #fff !important;
}

#footer a:hover {
text-decoration: underline;
}

#footer #footerinner {
max-width: 980px;
width: 100%;
margin: 0 auto;
line-height: 1.7;
}

#footer .sitemenu li,
#footer #footerinner dt,
#footer #footerinner dd {

color: #fff !important;
}

#footer .sitemenu {
margin: 0 0 20px 0;
overflow: hidden;
text-align: center;
}

#footer .sitemenu li {
display: inline;
border-right: 1px dotted #fff;
}

#footer .sitemenu li.last {
border-right: none;
}

#footer .sitemenu li a {
padding: 4px 8px;
}

#footer ul.sitemenu02 {
text-align: center;
margin: 20px 0;
}

#footer .sitemenu02 li {
display: inline;
}

#footer #footerinner dl {
margin-bottom: 20px;
}

#footer #footerinner span.icon_arrow {
font-size: 12px;
padding-right: 3px;
}

#footer #footerinner02 {
color: #fff;
}

#footer #footerinner02 ul.snslist {
text-align: center;
margin: 0 0 10px 0;
}

#footer #footerinner02 ul li {
display: inline;
margin: 0 30px 0 0;

}

#footer #footerinner02 ul.snslist li {
float: none;
margin: 0 30px 0 0;
}

#footer #footerinner02 li.twitter a {
background: url(../img/footer/icon_twitter02.png) center left no-repeat;
padding: 3px 0 3px 36px;
}

#footer #footerinner02 li.facebook a {
background: url(../img/footer/icon_facebook02.png) center left no-repeat;
padding: 3px 0 3px 20px;
}

#footer #footerinner02 li.mixi a {
background: url(../img/footer/icon_mixi02.png) center left no-repeat;
padding: 3px 0 3px 20px;
}

#footer #footerinner02 li.google a {
background: url(../img/footer/icon_google02.png) center left no-repeat;
padding: 3px 0 3px 22px;
}

#footer #footerinner02 li.mixi a {
background: url(../img/footer/icon_mixi02.png) center left no-repeat;
padding: 3px 0 3px 32px;
}

#footer #footerinner02 li.rss a {
background: url(../img/footer/icon_rss02.png) center left no-repeat;
padding: 3px 0 3px 32px;
}

#footer #footerinner02 li.login a {
background: url(../img/footer/icon_login02.png) center left no-repeat;
padding: 3px 0 3px 32px;
}

#footer #footerinner02 li.login {
margin-right: 0px;
}

#footer #footerinner02 ul.banner {
text-align: center;
margin: 20px 0 0 0;
}

#footer #footerinner02 ul.banner li {
margin-right: 10px;
display: inline;
}

#footer #footerinner02 ul.banner li.last {
margin-right: 0px;
}

#footer #footerinner02 p#copyright {
text-align: center;
margin-top: 14px;
color: #fff;
}


@media only screen and (max-width: 951px) {
#footer #footerinner {
width: 90%;
}

#footer .sitemenu li {
width: 19%;
display: block;
float: left;
margin: 0 0 10px 0;
}

#footer .sitemenu li.break {
border-right: none;
}
}

@media only screen and (max-width: 767px) {
#footer .sitemenu,
#footer .sitemenu02 {
overflow: hidden;
}

#footer .sitemenu li,
#footer #footerinner02 .sitemenu02 li {
width: 49.75%;
text-align: center;
display: block;
float: left;
border-right: none;
margin: 0;
}

#footer .sitemenu li a,
#footer .sitemenu02 li a {
padding: 8px 0;
text-decoration: none;
color: #fff;
background: #e84c3d;
display: block;
border-bottom: 1px solid #d34233;
border-right: 1px solid #d34233;
}

#footer .sitemenu li a:hover,
#footer .sitemenu02 li a:hover {
background: #fc6b5d;
}

#footer #footerinner02 ul.snslist {
border-top: 1px dotted #fff;
}

#footer #footerinner02 ul.snslist li {
display: block;
margin: 0 0 10px 0;
}

#footer #footerinner02 ul.snslist li a {
display: block;
padding: 8px 0;
border-bottom: 1px dotted #fff;
}

#footer #footerinner02 #displaychange02 {
display: block;
text-align: center;
margin: 20px 0 0 0;
}

#footer #footerinner02 #displaychange02 li {
border-right: 1px solid #fff;
padding: 0 10px 0 0;
margin: 0 10px 0 0;
}

#footer #footerinner02 #displaychange02 li.mobile {
border-right: none;
margin: 0;
padding: 0;
}

#footer #footerinner02 li.twitter a {
background: url(../img/footer/icon_twitter02.png) 1em 0.5em no-repeat;
}

#footer #footerinner02 li.facebook a {
background: url(../img/footer/icon_facebook02.png) 1em 0.5em no-repeat;
}

#footer #footerinner02 li.mixi a {
background: url(../img/footer/icon_mixi02.png) 1em 0.5em no-repeat;
}

#footer #footerinner02 li.google a {
background: url(../img/footer/icon_google02.png) 1em 0.5em no-repeat;
}

#footer #footerinner02 li.mixi a {
background: url(../img/footer/icon_mixi02.png) 1em 0.5em no-repeat;
}

#footer #footerinner02 li.rss a {
background: url(../img/footer/icon_rss02.png) 1em 0.5em no-repeat;
}

#footer #footerinner02 li.login a {
background: url(../img/footer/icon_login02.png) 1em 0.5em no-repeat;
}
}

@media only screen and (max-width: 479px) {
#footer #footerinner02 ul.banner li {
display: block;
margin: 0 0 10px 0;
}
}

/*-----------------------------------------------------
pagetop(all : ページトップに戻るボタン)
-----------------------------------------------------*/
#pagetop {
position: absolute;
right: 0px;
top: -46px;
}

.pagetop {
position:fixed;
bottom:10px;
right:10px;
display:none;
}

/*-----------------------------------------------------
displaychange02 (all:PC SP表示切り替えボタン)
-----------------------------------------------------*/
#displaychange02 {
display: none;
}

@media only screen and (max-width: 767px) {
#displaychange {
display: block;
}
}


/*-----------------------------------------------------------------------------------------
color for each
-----------------------------------------------------------------------------------------*/
.home,
a.home {
background: #95a5a5;
}

.others,
a.others {
background: #dfdfdf;
}

a.home:hover {
background: #7e8c8d;
}

.release,
.catbox,
a.release {
background: #3598db;
}

.motto {
background: #0c0c72;
}

a.release:hover {
background: #2a80b9;
}

.blcolor {
background: #f3d4ff;
}

.content_c .boxtit.blcolor h1 span {
color: #9b58b5;
}

.boxtit.blcolor h1 {
background: url(../img/content/icon_bl_arrow01.png) left center no-repeat;
}

.recommend,
a.recommend {
background: #e84c3d;
}

a.recommend:hover {
background: #c1392b;
}

.ranking {
background: #bb71d8;
}

.ranking a {
text-decoration: none;
}

.ranking a .txt {
color: #333;
}


#kirikuchi .recommend {
text-align: center;
}

h2.recommend {
padding: 8px 0;
}

.bestfive,
a.bestfive,
.subbestfive,
a.subbestfive {
background: #e77e23;
}

a.bestfive:hover,
a.subbestfive:hover {
background: #d25400;
}

.hope,
.hope02,
a.hope {
background: #2dcc70;
}

a.hope:hover {
background: #27ae61;
}

.news,
.news02,
a.news {
background: #f1c40f;
}

a.news:hover {
background: #f39c11;
}

.keywordmantan,
.keywordmantan02,
.keywordmantan03 {
background: #1bbc9b;
}

a.keywordmantan:hover,
a.keywordmantan02:hover,
a.keywordmantan03:hover {
background: #16a086;
}

.calendar,
a.calendar {
background: #3598db;
}

.calendar,
a.calendar {
background: #3598db;
}


/*-----------------------------------------------------------------------------------------
nav (all: content最上部のグローバルメニュー部分)
-----------------------------------------------------------------------------------------*/
nav {
margin: 5px auto 0 auto;
overflow: hidden;
padding-bottom: 12px;
font-size: 11.5px;
}

nav li {
float: left;
width: 13.4%;
margin: 0 1% 0 0;
}

nav li:last-child {
margin-right: 0;
}

nav li a {
display: block;
color: #fff;
padding: 8px 0;
text-align: center;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
behavior: url(../pie/PIE.htc);
position: relative;
text-decoration: none;
}

nav li a {
position: relative;
}

nav li a.home.current:before {
content: "";
position: absolute;
bottom: -13px;
right: 44%;
border: 8px solid transparent;
border-top: 8px solid #95A5A5;
}

nav li a.home.current:hover:before {
border-top: 8px solid #7e8c8d;
}

a.release.current:before {
content: "";
position: absolute;
bottom: -13px;
right: 44%;
border: 8px solid transparent;
border-top: 8px solid #3598DB;
}

a.release.current:hover:before {
border-top: 8px solid #2a80b9;
}

a.recommend.current:before {
content: "";
position: absolute;
bottom: -13px;
right: 44%;
border: 8px solid transparent;
border-top: 8px solid #E84C3D;
}

a.recommend.current:hover:before {
border-top: 8px solid #c1392b;
}

a.bestfive.current:before {
content: "";
position: absolute;
bottom: -13px;
right: 44%;
border: 8px solid transparent;
border-top: 8px solid #E77E23;
}

a.bestfive.current:hover:before {
border-top: 8px solid #d25400;
}

a.hope.current:before {
content: "";
position: absolute;
bottom: -13px;
right: 44%;
border: 8px solid transparent;
border-top: 8px solid #2DCC70;
}

a.hope.current:hover:before {
border-top: 8px solid #27ae61;
}

a.news.current:before {
content: "";
position: absolute;
bottom: -13px;
right: 44%;
border: 8px solid transparent;
border-top: 8px solid #F1C40F;
}

a.news.current:hover:before {
border-top: 8px solid #f39c11;
}

a.keywordmantan.current:before {
content: "";
position: absolute;
bottom: -13px;
right: 44%;
border: 8px solid transparent;
border-top: 8px solid #1BBC9B;
}

a.keywordmantan.current:hover:before {
border-top: 8px solid #16a086;
}

nav li span {
display: none;
}


@media only screen and (max-width: 767px) {
nav li {
width: 32%;
margin: 0 0 10px 1%;
}

nav li.homenav {
width: 100%;
margin: 0 0 10px 10px;
float: none;
}

nav li a.home,
nav li a.home:hover,
nav li a.home.current {
background: #ecf0f1 url("../img/header/ico_home.png") no-repeat left;
padding: 5px 0 5px 30px;
color: #333;
text-align: left;
}

nav li span {
display: inline;
}

nav li a.home.current:before {
border: none;
}
}

/*-----------------------------------------------------
bread-crumb (all : パンくず)
-----------------------------------------------------*/
#bread-crumb {
font-size: 12px;
margin: 0 0 10px 18px;
}

#bread-crumb a {
color: #333;
}

/*-----------------------------------------------------------------------------------------
layout
-----------------------------------------------------------------------------------------*/
/*-----------------------------------------------------
content (all:メインコンテンツ部分の大枠)
-----------------------------------------------------*/
#content {
background: #ecf0f1;
padding: 12px 0 60px 0;
}

/*-----------------------------------------------------
row (all:コンテンツのサイズ調整)
-----------------------------------------------------*/
.row {
max-width: 1080px;
width: 100%;
margin: 0 auto;
overflow: hidden;
}

@media only screen and (max-width: 767px) {
.row {
width: 98%;
}
}

/*-----------------------------------------------------
contentbox (all:コンテンツのサイズ調整)
-----------------------------------------------------*/
.contentbox {
max-width: 1080px;
width: 100%;
margin: 0 auto;
overflow: hidden;
position: relative; /*add*/
}

/*-----------------------------------------------------
content_lunder (all:コンテンツの左側)
-----------------------------------------------------*/
#content_lunder {
float: left;
width: 70.479%;
}

@media only screen and (max-width: 951px) {
#content_lunder {
float: none;
width: auto;
}
}

/*-----------------------------------------------------
content_l (all:コンテンツの左側の中の左側)
-----------------------------------------------------*/
.contentbox .content_l {
float: left;
width: 22.888%;
padding: 4px 0.5%;

}

.contentbox #content_lunder .content_l {
width: 32.444%;
}

/*-----------------------------------------------------
content_c (all:コンテンツの左側の中の右側)
-----------------------------------------------------*/
.contentbox .content_c {
margin: 0 0 0 24.222%;
width: 46.222%;
padding: 4px 0.2%;
}

.contentbox #content_lunder .content_c {
float: right;
width: 65.56%;
margin: 0 auto;
}

/*-----------------------------------------------------
content_r (all:コンテンツの右側)
-----------------------------------------------------*/
.contentbox .content_r {
float: right;
width: 28.111%;
padding: 4px 0.5%;
}


/*-----------------------------------------------------
content_l_pad (all:コンテンツの右側)
-----------------------------------------------------*/
#wrapper .contentbox .content_l_pad .content_l {
position: absolute; /*add*/
left: 0;
top: 0;
}

#wrapper .contentbox .content_l_pad .content_r {
position: absolute; /*add*/
right: 0;
top: 0;
}

@media only screen and (max-width: 951px) {
.content_l_pad {
float: left;
width: 24.519%;
margin-left: 1%;
}

#wrapper .contentbox .content_l_pad .content_r,
#wrapper .contentbox .content_l_pad .content_l {
position: inherit;
}
}


@media only screen and (max-width: 951px) {
.contentbox .content_c,
.contentbox #content_lunder .content_c {
float: right;
width: 70.56%;
margin: 0 1% 0 0;
}

.contentbox #content_lunder .content_c {
width: 60.06%;
min-height: 4000px;
}

.contentbox .content_r,
.contentbox .content_l {
width: auto;
position: inherit;
}

.contentbox #content_lunder .content_l,
.under .contentbox .content_r {
float: left;
width: 37.519%;
}
}

@media only screen and (max-width: 767px) {
.content_l_pad,
.contentbox .content_r,
.contentbox .content_l,
.contentbox .content_c,
#content_lunder,
.contentbox #content_lunder .content_l,
.contentbox #content_lunder .content_c,
.under .contentbox .content_r {
width: 98%;
float: none;
margin: 0 auto;
min-height: inherit;
}
}

/*-----------------------------------------------------------------------------------------
loader (all:ローディングのアニメーションgif)
-----------------------------------------------------------------------------------------*/
#fade, #loader {
display: block;
}

#loader {
width: 64px;
height: 64px;
display: none;
position: fixed;
_position: absolute; /* IE6対策 */
top: 50%;
left: 50%;
margin-top: -37px; /* heightの半分のマイナス値 */
margin-left: -32px; /* widthの半分のマイナス値 */
z-index: 100;
}

#loader span {
color: #056397;
display: block;
margin-top: 5px;
}

#fade {
width: 100%;
height: 100%;
display: none;
background-color: #FFFFFF;
position: absolute;
top: 0px;
left: 0px;
z-index: 50;
}

/*----------------------------------------------------------------
Ad
----------------------------------------------------------------*/
.adsbygoogle,
#imobile_adspotframe1 {
background-color: transparent;
}

/* ad space */
#ad-area {
display: none;
}

.ban_01,
.ban_02,
.ban_05 {
margin-bottom: 10px;
text-align: center;
}

.ban_03 {
display: none;
}

.col2AdBox {
background:#fff;
padding:2px;
text-align:center;
margin-bottom:15px;
box-shadow: 0px 0px 4px #dde2e3;
}

.col2AdBox p {
margin-bottom:5px;
}

.col2AdBox ul {
display:inline-block;
}

.col2AdBox li {
float:left;
margin-left:1%;
max-width:49%;
}

.col2AdBox li:first-child {
margin-left:0;
}

.col2AdBox li img {
width:98%;
max-width:98%;
height:auto;
}

#header .headerinner .ban_04 {
overflow: hidden;
}

#header .headerinner .ban_04 li {
float: right;
width: 74%;
}

#header .headerinner .ban_04 li.banfirst {
float: left;
width: 24.5%;
margin: 0 0 10px 0;
}

.content_r .ban_02 img,
.ban_04 img {
max-width: 100%;
height: auto;
width: auto;
}

/*-----------------------------------------------------
bannerarea (all : ２カラムのサイト内回遊リンクエリア)
-----------------------------------------------------*/
.bannerarea ul {
background: #fff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
behavior: url(../pie/PIE.htc);
position: relative;
box-shadow: 0px 0px 4px #dde2e3;
margin-bottom: 12px;
padding: 2% 0;
overflow: hidden;
}

.bannerarea li {
float: left;
width: 50%;
text-align: center;
}

.bannerarea li img {
width: auto;
max-width: 98%;
height: auto;
}

/*-----------------------------------------------------
banaccd (all : 開閉式の広告)
-----------------------------------------------------*/
.banaccd.sec-sub {
    padding:20px 30px !important;
    margin-bottom:0;
    /*border:2px solid #3598db;*/
    border:none;
}

.banaccd.sec-sub h2 {
    text-align:center;
    font-size:20px;
    color:#3598db;
    padding:13px;
    margin-bottom:15px;
    background:#EAF6FD;
    border-left: 10px solid #3598db;
    border-bottom:none;
    box-shadow:0 1px 5px 0 rgba(0,0,0,0.2);
}

.banaccd.sec-sub .items {
    margin-bottom:20px;
    box-sizing:border-box;
}

.banaccd.sec-sub .item {
    width:32%;
    float:left;
    text-align:center;
    margin-left:1.5%;
    box-sizing:border-box;
    padding:10px 2px;
    background:#fff;
    border:1px dashed #ccc;
    box-shadow:0 0 3px 0 rgba(0,0,0,0.2);
}

.banaccd p.em {
    font-weight:bold;
    font-size:13px;
    color: #3598db;
}

.banaccd p.em mark {
    background:linear-gradient(transparent 60%, #ffff66 60%);
    color:#3598db;
    font-style:normal;
}


.banaccd .item:first-child {
    margin-left:0;
}

.sec-sub.banaccd .recommendlist li {
    padding:10px 0;
}

.sec-sub.banaccd .recommendlist li a {
    padding-right:22px;
    box-sizing:border-box;
    background:url(../img/content/arcl09.png) no-repeat right center;
    table-layout: fixed;
}

.banaccd .img {
    line-height:0;
    margin-bottom:5px;
}

.banaccd img {
    width:auto;
    max-width:100%;
    height:auto;
}

.banaccd .open_btn {
    cursor:pointer;
}

.banaccd .readmore_btn {
text-align:center;
margin:15px auto 0;
background:#3598db;
color:#fff;
padding:15px 2px;
border-radius:5px;
cursor:pointer;
position:relative;
width:80%;
border-bottom:4px solid #2A6DA3;
font-weight:bold;
}

.banaccd .readmore_btn:after {
    content:"▼";
    font-weight:bold;
    position:absolute;
    right:5%;
    top:50%;
    margin-top:-0.5em;
}

.banaccd .readmore_btn:after {
    content:"";
}

.banaccd a {
    display:table;
    width:100%;
    text-decoration:none;
    position:relative;
    color:#333;
}

.banaccd .contentlist_img {
    width:35% !important;
    display:table-cell;
    vertical-align:top;
}

.banaccd .contentlist_txt {
    width:65% !important;
    display:table-cell;
    vertical-align:top;
}

.banaccd .title {
font-weight:bold;
color:#3598db !important;
text-decoration:none !important;
font-size:15px;
}

.banaccd .title em {
    font-style:normal;
    font-size:17px;
    display:inline-block;
    margin:0 3px;
}

.banaccd p {
font-size:13px;
}

.banaccd_em {
    padding:7px 10px;
    border:1px solid #ddd;
    background:#eee;
}

.banaccd .detail {
    font-size:12px;
}

.banaccd .contents {
    display:none;
    margin-top:20px;
}

.banaccd .contents .title {
    margin-bottom:3px;
}

.banaccd_em {
    margin-bottom:3px;
}

.bannum {
    position:absolute;
    width:30px;
    height:30px;
    border-radius:15px;
    line-height:30px;
    background:#00bffa;
    color:#fff;
    text-align:center;
    font-weight:bold;
    font-size:16px !important;
}

/*-----------------------------------------------------
banchangeimg (all : 画像切り替え広告)
-----------------------------------------------------*/
.banchangeimg {
    position:relative;
    text-align:center;
    margin:10px auto 20px;
}

.banchangeimg ul {
    display:block;
}

.banchangeimg li {
    display:none;
}

.banchangeimg li.show {
    display:block;
}

/*-----------------------------------------------------
membership (all : ログインエリア)
-----------------------------------------------------*/
.membership,
.membership a {
background:#00bffa;
text-decoration:none;
}

.contentbox .membership.boxtit .txt {
color:#333;
}

.membershipbtn {
background:#00bffa;
color:#fff;
padding:10px;
font-size:16px;
text-align:center;
position:relative;
}

.membershipbtn:after {
content:url(../img/content/icon_arrow00s1.png);
position:absolute;
right:10px;
}


/*-----------------------------------------------------
newsappli (all : 新着アプリ google play, App Storeボタン表示エリア)
-----------------------------------------------------*/
.content_r h2.newsappli {
background: #9b58b5;
padding: 8px;
text-align: center;
}

.content_r .newsapplibox dt {
font-weight: bold;
margin: 10px 0 14px;
text-align: center;
}

.content_r .newsapplibox dd {
overflow: hidden;
margin-right: -7px;
}

.content_r .newsapplibox li {
float: left;
width: 50%;
text-align: center;
}

.content_r .newsapplibox li img {
max-width: 100%;
height: auto;
width: auto;
}

@media only screen and (max-width: 951px) {
.contentbox .content_r .newsapplibox li {
margin-right: 0;
}
}

@media only screen and (max-width: 767px) {
.contentbox .content_r .newsapplibox li.first {
text-align: right;
}

.newsappli_area h2.newsappli {
background: #9b58b5;
padding: 8px;
text-align: center;
}

.newsappli_area .newsapplibox dt {
font-weight: bold;
margin: 10px 0 14px;
text-align: center;
}

.newsappli_area .newsapplibox dd {
overflow: hidden;
margin-right: -7px;
}

.newsappli_area .newsapplibox li {
float: left;
width: 50%;
}

.newsappli_area .newsapplibox li.first {
text-align: right;
}

.newsappli_area .newsapplibox li img {
max-width: 100%;
height: auto;
width: auto;
}
}


/*-----------------------------------------------------
bannerarer02 (all : バナーリスト表示エリア)
-----------------------------------------------------*/
.bannerarer02 li {
margin-bottom: 7px;
text-align: center;
}

.bannerarer02 li img {
max-width: 220px;
width: 100%;
height: auto;
}

@media only screen and (max-width: 951px) {
.ban_01 {
display: none;
}

.ban_04,
.ban_05 {
text-align: center;
margin: 0 0 15px 0;
}
}

@media only screen and (max-width: 767px) {
#ad-area {
display: block;
position: fixed;
height: 50px;
left: 0;
bottom: 0;
background: #000;
width: 96%;
padding: 10px 2%;
}

.bannerarer02,
.ban_03 {
text-align: center;
}

.ban_03 {
display: block;
margin: 0 0 30px 0;
}

.contentbox .content_r .ban_02,
.ban_04,
.ban_05,
.mangaform {
display: none;
}
}

/*----------------------------
affiliate
----------------------------*/
.ytlink,
.aflink {
margin: 0 0 20px 0;
}

.ytlink dt,
.aflink dt,
.videolink dt {
font-weight: bold;
margin-bottom: 12px;
border-bottom: #3598db 1px solid;
padding-bottom: 5px;
}

.ytlink dd,
.aflink dd {
margin: 0 0 10px 0;
}

.ytlink dd {
position: relative;
margin: 15px 0;
padding-bottom: 51%;
padding-top: 30px;
height: 0;
overflow: hidden;
}

.ytlink dd iframe,
.ytlink dd object,
.ytlink ddr embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.ytlink .movielink {
height:auto;
background: url(../img/content/katinko.png) left center no-repeat;
background-size: 22px 22px;
padding: 7px 0 10px 30px;
}

.ytlink .movielink a {
color: #1d6295;
font-size: 16px;
}
.aflink dd.afimg {
text-align: center;
max-width: 100%;
height: auto;
width: auto;
}

.aflink dd a {
color: #056397;
}

/*-----------------------------------------------------
notfound (404 : not founページ)
-----------------------------------------------------*/
.contentbox .content_c article.notfound {
padding:20px;
}

.notfound h1 {
text-align:center;
margin-bottom:15px;
}

.notfound h1 small {
color:#ccc;
margin-bottom:5px;
display:inline-block;
}

.notfound .thumb {
text-align:center;
}


.notfound p a {
display:inline-block;
margin-top:15px;
background:url(../img/content/icon_news_arrow02.png) left 4px no-repeat;
padding-left:15px;
}

/*-----------------------------------------------------
notfound (404 : not founページ)
-----------------------------------------------------*/
.contentbox .content_c article.notfound {
padding:20px;
}

.notfound h1 {
text-align:center;
margin-bottom:15px;
}

.notfound h1 small {
color:#ccc;
margin-bottom:5px;
display:inline-block;
}

.notfound .thumb {
text-align:center;
}


.notfound p a {
display:inline-block;
margin-top:15px;
background:url(/user/img/content/icon_news_arrow02.png) left 4px no-repeat;
padding-left:15px;
}


/*-----------------------------------------------------
adarea (all : 全ページ)
-----------------------------------------------------*/
.adarea {
background:#fff !important;
}

.adarea a {
color:#333;
text-decoration:none;
display:block;
}

.adarea em {
color:#f00;
font-style:normal;
}

.adarea em small {
font-size:11px;
}

.adarea .tit {
text-align:center;
padding-bottom:10px;
margin-bottom:10px;
}

.adarea .tit p {
margin-bottom:3px;
}

.adarea h2 {
color:#333;
font-size: 108%;
}

.adarea .contentbox {
width:100%;
display:table;
padding:10px;
box-sizing:border-box;
}

.adarea .contentbox p + p {
margin-top:5px;
}

.adarea .contentbox .thumb,
.adarea .contentbox .txt {
display:table-cell;
vertical-align:middle;
}

.adarea .thumb {
text-align: center;
margin: 0 auto 5px;
width: auto;
min-width: 70px;
max-width: 30%;
}

.adarea .thumb img {
width:auto;
height:auto;
}

.adarea .txt {
margin-bottom:5px;
}

.adarea .contentbox .txt {
padding-left:10px;
}

.adarea .obi {
text-align:center;
padding:5px;
color:#fff;
}

.col2AdBox .adarea {
box-shadow:none;
}

.col2AdBox .adarea .txt {
text-align:left;
}

/* トップページ
-------------------- */
#top .adarea .tit {
border-bottom:2px solid #BE3830;
}

#top .adarea .obi {
background:#BE3830;
}


/* カレンダーページ
-------------------- */
#calendar .adarea .tit {
border-bottom:2px solid #3598db;
}

#calendar .adarea .obi {
background:#3598db;
}


/* おすすめ
-------------------- */
#recommend .adarea .tit {
border-bottom:2px solid #e84c3d;
}

#recommend .adarea .obi {
background:#e84c3d;
}


/* ベスト5
-------------------- */
#best5 .adarea .tit {
border-bottom:2px solid #e77e23;
}

#best5 .adarea .obi {
background:#e77e23;
}


/* 映画
-------------------- */
#mangamovie .adarea .tit {
border-bottom:2px solid #716d91;
}

#mangamovie .adarea .obi {
background:#716d91;
}


/*ランキング
-------------------- */
#ranking .adarea .tit {
border-bottom:2px solid #bb71d8;
}

#ranking .adarea .obi {
background:#bb71d8;
}


/* カテゴリー
-------------------- */
#category .adarea .tit {
border-bottom:2px solid #db7093;
}

#category .adarea .obi {
background:#db7093;
}


/* タイトル
-------------------- */
#bytitle .adarea .tit {
border-bottom:2px solid #3598db;
}

#bytitle .adarea .obi {
background:#3598db;
}


/* おすすめ漫画 mantan
-------------------- */
#keyword .adarea .tit {
border-bottom:2px solid #1bbc9b;
}

#keyword .adarea .obi {
background:#1bbc9b;
}


/* 漫画する人たち special
-------------------- */
#wantstobe .adarea .tit {
border-bottom:2px solid #2dcc70;
}

#wantstobe .adarea .obi {
background:#2dcc70;
}


/* 漫画ニュース
-------------------- */
#news .adarea .tit {
border-bottom:2px solid #f1c40f;
}

#news .adarea .obi {
background:#f1c40f;
}


/*-----------------------------------------------------
adarea_b (all : 全ページ)
-----------------------------------------------------*/
.adarea_b a {
color:#333;
text-decoration:none;
display:table;
width:100%;
}

.adarea_b .thumb,
.adarea_b .txt {
width:50%;
display:table-cell;
vertical-align:middle;
}

.adarea_b .thumb {
text-align:center;
}

.adarea_b .thumb img {
max-width:100%;
height:auto;
}

.adarea_b .txt {
padding:1px 32px 1px 10px;
}

.adarea_b em {
color:#f00;
font-style:normal;
}

.adarea_b em small {
font-size:11px;
}

.adarea_b .tit p {
margin-bottom:3px;
}


/* トップページ
-------------------- */
#top .adarea_b .txt {
background:url(../img/content/ad_ar_01.png) no-repeat right center;
}

/* カレンダーページ
-------------------- */
#calendar .adarea_b .txt {
background:url(../img/content/ad_ar_02.png) no-repeat right center;
}

/* おすすめ
-------------------- */
#recommend .adarea_b .txt {
background:url(../img/content/ad_ar_03.png) no-repeat right center;
}

/* ベスト5
-------------------- */
#best5 .adarea_b .txt {
background:url(../img/content/ad_ar_04.png) no-repeat right center;
}

/* 映画
-------------------- */
#mangamovie .adarea_b .txt {
background:url(../img/content/ad_ar_05.png) no-repeat right center;
}

/*ランキング
-------------------- */
#ranking .adarea_b .txt {
background:url(../img/content/ad_ar_06.png) no-repeat right center;
}

/* カテゴリー
-------------------- */
#category .adarea_b .txt {
background:url(../img/content/ad_ar_07.png) no-repeat right center;
}

/* タイトル
-------------------- */
#bytitle .adarea_b .txt {
background:url(../img/content/ad_ar_08.png) no-repeat right center;
}

/* おすすめ漫画 mantan
-------------------- */
#keyword .adarea_b .txt {
background:url(../img/content/ad_ar_09.png) no-repeat right center;
}

/* 漫画する人たち special
-------------------- */
#wantstobe .adarea_b .txt {
background:url(../img/content/ad_ar_10.png) no-repeat right center;
}

/* 漫画ニュース
-------------------- */
#news .adarea_b .txt {
background:url(../img/content/ad_ar_11.png) no-repeat right center;
}