@charset "utf-8";

/*****************
format
******************/
html{overflow-y: auto; font-size: 62.5%; /*10px*/}
html,body {width:100%;height:100%}
body{ color:#000; background: #fbfbfb; word-break: break-all; word-wrap: break-word; font-size:13px; font-size: 1.3rem; /*13px*/}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,button,p,blockquote,th,td{margin:0;padding:0}
header,footer,nav,main,section,article,figure,figcaption,menu,address{display:block;margin:0;padding:0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
  box-sizing: border-box;
  }
h1,h2,h3,h4,h5,h6,input,textarea{font-size:100%;font-weight:normal}
fieldset,img {border:0}
img{ vertical-align: top;}
ol,ul{list-style:none}
p{ line-height: 1.7}
address,caption,cite,code,dfn,em,th,var{font-style: normal;font-weight: normal}
br{letter-spacing:0}
hr { border: none; border-top: solid 1px #ccc; margin: 15px auto;}

/* default link color */
a ,
a:active { color: #0084ff; cursor: pointer; text-decoration: none!important; outline: none;}
a:hover{ color: #0066ff; text-decoration: underline}
a:visited{ }

/* font-family */
body.win ,
body.win input ,
body.win select ,
body.win textarea { font-family: Meiryo , 'MS PGothic' , sans-serif;}

body.mac ,
body.mac input ,
body.mac select ,
body.mac textarea{ font-family: 'Hiragino Kaku Gothic ProN' , sans-serif;}

/*****************
layout
******************/
#wrapper { background: url(../images/exblog_base/bg_wrapper.gif) repeat 0 0;}
  #wrapperInner { width: 990px; margin: 0 auto 10px; display: block; overflow: hidden;}
    #mainContents { float: left; width: 670px;}
    #sidebar { float: right; width: 300px;}

/*****************
header , footer
******************/
/* exheader */
#exHeaderSearchWord { padding: 0; margin: 0; box-shadow: none;}

/* exfooter */
#exFooter { background: #FFF url(../images/exblog_base/bg_footer_top.gif) repeat-x top; padding:2px 0 30px 0; clear: both;}
  #footer_pr_text { margin: 0 0 15px;}
    #footer_pr_text a{ display: inline-block; padding: 0 0 0 40px; line-height: 19px; background: url(../images/exblog_base/icon_pr.gif) no-repeat 0 0;}
  #exFooterContents { width: 980px; margin: 0 auto; text-align: left; overflow: hidden }
    .footerTopics { width: 240px; float: left; overflow: hidden;}
    .footerTopics .fR { display: none;}
    .exFooterLink .home { background: url(../images/exblog_base/icon_footer_home.gif) no-repeat left; padding-left: 20px;}
    .exFooterLink .blogstart { background: url(../images/exblog_base/icon_footer_blogstart.png) no-repeat left; padding-left: 20px;}
    .exFooterLink .bloghelp { background: url(../images/exblog_base/icon_footer_bloghelp.png) no-repeat left; padding-left: 22px;}
  #exFooterSearchWord{ padding: 0; margin: 0; box-shadow: none;}
  .simpleFooter_topLink { text-align: center; font-size: 85%; margin-top: 30px;}

/* exUnderNav */
#exUnderNav { line-height: 1.3; padding: 15px 0 20px;}
  #exUnderNav li { border-right: solid 1px #999; white-space: nowrap; margin: 0 6px 5px 0;}

/*****************
section header
******************/
/* boxHead */
.boxHead { text-align: left; padding: 0 15px; overflow: hidden;
  background: url(../images/exblog_base/titleTxt_arrow.png) no-repeat ;}
  .boxHead h1 { display: inline-block; padding: 0 10px 0 0; color: #666;
    font-weight: bold; line-height: 32px; vertical-align: middle;text-shadow: 0 1px 0 #fff;}
  .boxHead h1 a{ color: #666; border-bottom: dotted 1px #999; padding: 0 0 2px;}
  .boxHead h1 a:hover{ border: none; text-decoration: none;}
  .boxHead .att span{ font-weight: normal; font-size: 85%}
  #sidebar .boxHead h1 a:hover{ text-decoration:none!important}

  /* boxHead + size */
  .head-h1{ font-size: 108%; text-shadow: 0 1px 0 #f7f7f7; margin: 0 0 5px; padding: 0 0 0 25px;
    background-position: 8px center;}

  .head-h3{ border-left: solid 2px #ccc; background: #f7f7f7;}
  .head-h3 h1{ line-height: 36px;}

  .head-h2{ padding: 0 0 0 30px; border-bottom: solid 1px #fff; border-top: solid 2px #ccc;
    box-shadow: 0 1px 1px #eee ; text-shadow: 0 1px 0 #fff;
    background-position: 14px 13px; background-color: #f7f7f7;}
  .head-h2 h1{ line-height: 38px; font-size: 108%;}

  .head-h4{ padding: 0 0 0 30px; border-bottom: dotted 1px #ccc;background-position: 13px 10px;}

  .head-h5{ padding: 0; border-bottom:; background: none;}
  .head-h5 h1{ line-height: 22px; font-size: 85%; padding: 0;}

  .head-h6{ padding: 0 0 0 20px; border-bottom: solid 2px #eee; background-position: 6px 8px;}
  .head-h6 h1{ line-height: 28px; font-size: 85%;}

  .head-top{ padding: 0; border-bottom:; background: none;}
  .head-top h1{ line-height: 22px; font-size: 108%; padding: 0 0 5px;}

  .head-top-block{ padding: 0; border-bottom:; background: none;}
  .head-top-block h1{ line-height: 1; font-size: 108%; padding: 0 0 8px;}
  .head-top-block .sm-gray{ line-height: 1; padding: 2px 0 6px;}

  /* for genre */
  .head-subGenre{ background: #f7f7f7; margin: 0 0 10px; border-radius: 5px; overflow: hidden; box-shadow: 1px 1px 1px #b3b3b3;}
    .head-subGenre h1{ float: left; font-size: 167%; display: inline-block; line-height: 38px; text-shadow: 0 0 1px #fff; font-weight: bold;}
    .head-subGenre h1 a{ text-decoration: none; color: #333; text-shadow: 0 1px 0 #fff;}

/* header inSwitch */
  header.inSwitch { position: relative;}
  header.inSwitch .switch { position: absolute; right: 0; top: 5px;}
  header.inSwitch .balloon { position: absolute; right: 0; top: 8px;}


/*****************
input form parts
******************/
input[type="search"] { -webkit-appearance: textfield;}
input[type="search"]:focus {outline-offset: -2px;}
input[type="search"]::-webkit-search-decoration { display: none;}
input[type="search"] ,
input[type="password"] ,
input[type="text"],
textarea { display: block; width: 100%; height: 38px; overflow: hidden; padding: 0 10px;
  line-height: 38px; vertical-align: middle;
	box-shadow: 1px 1px 2px #eee inset , 0 1px 0 #fff;
  border: solid 1px #ccc; border-radius: 3px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
	box-sizing: border-box;
  }
textarea{ line-height: 20px; padding: 10px; min-height: 150px; overflow:inherit}

input.error ,
input[type="search"].error ,
input[type="password"].error ,
input[type="text"].error { background:#fee;}

/* select label radio checkbox */
label { padding: 0 10px; line-height: 38px;}
select{ padding: 8px 5px; line-height: 38px; min-width: 80px; font-size: 13px; margin: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
  box-sizing: border-box;
  }
input[type="radio"] ,
input[type="checkbox"] { margin: 0 5px 0 0; /* vertical-align: middle; */}

.optionGroup{ line-height: 38px;}
.optionGroup input[type="text"]{ display: inline; width: auto;}

/* fileUploadWrapper */
input[type="file"]{ line-height: 38px;}
  .fileUploadWrapper { position: relative;}
  .fileUploadInner { position: relative; display: inline-block; overflow: hidden;}
  .fileUploadInner input[type="file"] { position: absolute; top: 0; right: 0; width: 200px; opacity: 0.01;}
  .fileUploadText { display: inline-block; vertical-align: middle;}
  .fileUploadBtm { display: block;}


/*****************
btn set
******************/
/* default size */
.btn input ,
.btn button ,
.btn a ,
.btn span ,
/* small btn */
.btn-s input ,
.btn-s button ,
.btn-s a ,
.btn-s span ,
/* block btn */
.blockBtn input ,
.blockBtn button ,
.blockBtn a ,
.blockBtn span { display:inline-block; width: 100%; height: 38px;  padding: 0 15px;
  background: none; border: none; cursor: pointer; overflow: visible;
  font-weight: bold; color: #333; line-height: 38px; font-size: 100%; text-align: center; text-decoration: none;
  vertical-align:top; outline: none;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
	box-sizing: border-box;}

/* default color = gray */
.btn ,
.btn-s ,
.blockBtn ,
label ,
select { display: inline-block; height: 38px; overflow: hidden;
  background: #ccc; border: solid 1px #ccc; vertical-align: middle; cursor: pointer;
  text-shadow: 0 1px 0 #fff; border-radius: 3px; box-shadow: 0 1px 0 #fff inset;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
	box-sizing: border-box;
  background: #f5f5f5;
  background: linear-gradient(to bottom, #ffffff 0%,#eeeeee 100%);}

.btn-s{ height: 24px;}
.btn-s input ,
.btn-s button ,
.btn-s a ,
.btn-s span{ height: 22px; line-height: 22px; font-size: 85%; font-weight: normal;}

.btn input ,
.btn button ,
.btn-s input ,
.btn-s button { width: 100%; line-height: 24px;}

.btn-s input,
.btn-s button{ height: 22px}

.blockBtn { display: block;}
.blockBtn input ,
.blockBtn button { display: block; width: 100%;}

.btn:hover ,
.btn-s:hover ,
.blockBtn:hover ,
label:hover{ background: #eee; color: #333; text-decoration: none;}

.btn.choose ,
.btn-s.choose ,
.blockBtn.choose ,
label.choose{ background: #d9edf7; border:solid 1px #bce8f1; font-weight: bold;}

  /* btn + color option */

  /* blue */
  .btn-blue:hover{ background: #4096ee; color: #fff;}
  .btn-blue button ,
  .btn-blue input ,
  .btn-blue a ,
  .btn-blue span { color: #fff; text-shadow: 0 -1px 0 #1c6dbf;}
  .btn-blue { border: solid 1px #418dda;
    box-shadow: 0 1px 0 #7ebeff inset;
    background: #5faaf7;
    background: linear-gradient(to bottom, #5faaf7 0%,#4096ee 100%);}

  /* red */
  .btn-red:hover{ background: #ee4054; color: #fff;}
  .btn-red button ,
  .btn-red input ,
  .btn-red a ,
  .btn-red span{ color: #fff; text-shadow: 0px -1px 0px #990719;}
  .btn-red{ border: solid 1px #da4153;
    box-shadow: 0 1px 0 #ff7e90 inset;
    background: #f75f74;
    background: linear-gradient(to bottom, #f75f74 0%,#ee4054 100%);}

  /* yellow */
  .btn-yellow:hover{ background: #ffb932; color: #fff;}
  .btn-yellow button ,
  .btn-yellow input ,
  .btn-yellow a ,
  .btn-yellow span { color: #fff; text-shadow: 0 -1px 0 #dc9a19;}
  .btn-yellow { border: solid 1px #e6a824;
    box-shadow: 0 1px 0 #ffe38c inset;
    background: #ffc938;
    background: linear-gradient(to bottom, #ffc938 0%,#ffb932 100%);}

  /* invalid */
  .invalid ,
  .invalid:hover{ color: #ccc; background: #f7f7f7; cursor: default;
    border-color: #ddd !important; box-shadow: none !important; text-shadow: none !important;}
  .invalid input,
  .invalid button,
  .invalid a,
  .invalid span{ color: #ccc; cursor: default; font-weight: normal;}

  input[type="search"].invalid ,
  input[type="password"].invalid ,
  input[type="text"].invalid { box-shadow: none !important; text-shadow: none !important;}

/* switch btn */
.switch{ display: inline-block; overflow: hidden; border: solid 1px #ccc; border-radius: 3px; vertical-align: middle;
  background: #f5f5f5;
  background: linear-gradient(to bottom, #ffffff 0%,#eeeeee 100%);}

  .switch .btn ,
  .switch .blockBtn ,
  .switch .btn-s ,
  .switch label { float: left; border:none; border-right: solid 1px #ccc; border-radius: 0;}

  .switch .btn-s { height: 22px; line-height: 22px;}

  .switch .btn:last-child ,
  .switch .btn-s:last-child ,
  .switch .blockBtn:last-child ,
  .switch label:last-child { border-right: none;}

  .switch .choose{ cursor:none;}

/* search box */
.textFormWrap{ width: 100%; overflow: hidden; position: relative;}
  .textForm{ width: 100%;}
  .textForm input[type=search] ,
  .textForm input[type=text] { padding: 0 150px 0 40px; background: url(../images/exblog_base/icon_search.png) no-repeat 10px center}
  .textFormBtn{ width: 130px; position: absolute; top: 0; right: 0; margin: 0; border-radius: 0 3px 3px 0;}

/* add form */
.addFormWrap{ width: 100%; overflow: hidden; position: relative;}
  .addFormWrap select{ margin: 0 10px 0 0}
  .addFormTxt{ float: left; width: 69%; padding: 0 1% 0 0;}
  .addFormTxt input[type=text] { padding: 0 0 0 40px; background: url(../images/exblog_base/icon_plus.png) no-repeat 10px center}
  .addFormBtn{ width: 30%; margin: 0;}


/*****************
share elements
******************/
/* #blogHeader */
#blogHeader { width: 996px; overflow: hidden; margin: 0 auto 5px;}
  #blogNav { width: 988px; margin: 2px 0 14px 3px; font-size: 0; border-radius: 5px; box-shadow: 1px 1px 1px #b3b3b3; overflow: hidden;}
  #blogNav li { display: block; float: left;}
  #blogNav li a { display: block; padding-top: 13px; padding-bottom: 12px; text-align: center;
    color: #fff; font-size: 12px; border-left: 1px solid #555; border-right: 1px solid #000; background: #393939;
    -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
    #blogNav li:first-child a { border-radius: 5px 0 0 5px; border-left: 0;}
    #blogNav li:last-child a { border-radius: 0 5px 5px 0; border-right: 0;}
    #blogNav li a:hover, #blogNav li.cr a { background: #616161;}
    #blogNav #nav_1 { width: 68px;}
    #blogNav #nav_2 { width: 75px;}
    #blogNav #nav_3 { width: 60px;}
    #blogNav #nav_4 { width: 90px;}
    #blogNav #nav_5 { width: 100px;}
    #blogNav #nav_6 { width: 90px;}
    #blogNav #nav_7 { width: 120px;}
    #blogNav #nav_8 { width: 100px;}
    #blogNav #nav_9 { width: 100px;}
    #blogNav #nav_10 { width: 100px;}
    #blogNav #nav_11 { width: 85px;}
  .nav-new { position: relative; top: -3px; font-size: 8px; padding: 0 3px; margin-left: 4px; border-radius: 5px;
    background: #34a8b6; font-weight: bold;}

/* #searchBox */
  #searchBox{ width: 990px; margin: 0 auto 10px; display: block; overflow: hidden;}
    #search_text ,
    #search_type { display: block; float: left;
      background: url(../images/exblog_base/bg_circle_search.png) no-repeat; box-shadow: none;}
    #search_text{ height: 44px; line-height: 34px; width: 510px; padding: 5px 30px 5px 50px;
      font-size: 116%; color: #666; outline: none; border: none;}
    #search_type{ height: 26px; width: 245px; padding: 9px 10px 9px 0; background-position: -495px 0; margin: 0 10px 0 0;}
      #search_type label{ display: block; float: left; margin: 0 10px 0 0; padding: 0 7px;
        font-size: 12px; line-height: 26px; text-align: center; height: 26px;
        background: #bfdbf6; color: #fff;
        position: relative; border-radius: 5px; cursor: pointer;
        border: none; box-shadow: none; text-shadow: none;}
      #search_type label:last-child{ margin-right:0;}
      #search_type .selected{ background: #6BB0F5}
      #search_type input{ position: absolute; left: -9999px;}
        #search_tag { width: 65px;}
    #search_submit{ width: 212px; margin: 3px 0 0;}

  #attKeywords{ width: 990px; margin: 0 auto; display: block; overflow: hidden;}
    #attKeywords .boxHead{ float: left; margin: 0 5px 0 0; padding: 0; background: none; font-size: 100%}
    #attKeywords .boxHead h1{ line-height: 25px;}
    #attKeywords li { margin: 0 5px 0 0;}
    #attKeywords #toGenreLink{ float: right; margin: 0;}
    #attKeywords #toGenreLink a{ width: 287px; text-align: center}

/*****************
ad
******************/
.ad728{ width: 728px; height: 90px; background: #999; margin: 10px auto;}
.ad300{ width: 300px; height: 250px; background: #999; margin: 20px auto;}
.rakutenMW{ margin: 20px auto; text-align: center; overflow: hidden;}

#yahooPR { text-align: center;}
  #yahooPR a{ margin: 0 0 10px}
  #yahooPR .pr{ color: #999; font-size: 85%; padding: 0 10px; position: absolute;}

/*****************
sidebar
******************/

/* loginbox */
#loginBox { padding: 10px; margin: 0 0 10px; width: 298px;}
#loginBoxAfter{ padding: 10px 10px 0; margin: 0 0 20px; width: 298px;}
#sideNewpr a:hover { filter:alpha(opacity=70); -moz-opacity: 0.7; opacity: 0.7;}
#loginBox  .list_blue_arrow a:hover { text-decoration: underline!important;}
  /* login after */
  #userLoginInfo { background: #fcf8e3; border: 1px solid #fbeed5; text-shadow: 0px 1px 0px #fff; border-radius: 3px; margin-bottom: 10px;}
  #userLoginInfo a:hover { text-decoration: underline!important;}
  #userLoginInfo #userLogo { margin: 10px;}
  #userLoginInfo .thumb { width: 60px; height: 60px; line-height: 58px; background: #fff; border: solid 1px #ddd;}
  #welcom { padding: 15px 10px 0 0; line-height: 1.2;}
  #welcom a { font-weight: bold}
  .logoutLink { font-size:12px; padding-top:5px;}

  #myGenre{ margin: 0 0 5px; line-height: 1.8; background: #fffdec; padding: 10px; margin: 0 5px 5px;
  -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: 1px solid #FBEED5; clear: both;}
    #myGenre span { font-weight: bold; display: block; margin: 0 0 5px}
    #myGenre ol { list-style: decimal inside; margin: 0 15px;}

  /* #exblogTools */
  #exblogTools{ border-top:dotted 1px #ccc; padding: 10px 0 5px; margin: 10px 0 0;}
    #myblogBtn input{ text-indent: 20px; background: url(../images/exblog_base/icon_home.png) no-repeat 85px center;}
    #entryBtn a{ text-indent: 15px; background: url(../images/exblog_base/icon_pencile.png) no-repeat 85px center;}
    #articleBtn a{ text-indent: 15px; background: url(../images/exblog_base/icon_article.png) no-repeat 85px center;}
    #settingBtn a{ text-indent: 25px; background: url(../images/exblog_base/icon_setting.png) no-repeat 25px center;}
    #reportBtn a{ text-indent: 25px; background: url(../images/exblog_base/icon_report.png) no-repeat 25px center;}
  #exblogTools li a:hover { text-decoration: underline!important;}

/* sideHotContents */
#sideHotContents{}
  #sideHotContents a:hover { text-decoration: underline!important;}
  #sideHotContents li { padding: 10px; margin-bottom: 10px;}
  #sideHotContents li img { display: block;}
  #sideHotContents li .postTitle { display: block; padding: 5px 0 0 110px;}

/* sidePickupBloger */
#sidePickupBloger{ margin: 0 0 5px;}
  #sidePickupBloger .thumbList a { padding: 5px 10% 5px 5px !important;}

/* sideAppBanner */
#sideAppBanner{ margin: 0 0 20px;}
  #sideAppBanner li{ margin: 0 0 8px;}

/* sideAdvanceBanner */
#sideAdvanceBanner{ margin: 0 0 5px;}

/* sideBlogSkin */
#sideBlogSkin{ width: 298px;}
#sideBlogSkin .radius-5-white-shadow{ padding: 21px 21px 6px; margin: 0 0 20px;}
  #sideBlogSkin li{ float: left; width: 75px; height: 75px; padding: 0; margin: 0 15px 15px 0;}
  #sideBlogSkin .last{ margin: 0 0 15px;}

/* sideInformation */
#sideInformation{ margin: 0 0 20px;}
  #sideInformation  a:hover { text-decoration: underline!important;}
  #sideInformation  h1 a:hover { text-decoration: none!important;}
  #sideInformation .radius-5-white-shadow{ padding: 0;}
  #sideInformation .dataList { border: none; margin: 0}
  #sideInformation .dataList li:last-child { border: none;}
  #sideInformation .dataList .itemTitle{ font-size: 100%; line-height: 1.5;}
  #sideInformation .dataList .balloon{ top:inherit; bottom: 10px; right: 10px;}

#information { margin-bottom: 25px;}
  #information a:hover { text-decoration: underline!important;}
  #information p { color: #999; text-shadow: 0 1px 0 #f7f7f7; background: #ededed; font-weight: bold; line-height: 1; padding: 8px 12px 6px; border-radius: 20px; font-size: 12px; margin-bottom: 5px;}
  #information .forExblog { margin-bottom: 10px;}

/* sideSocialModule */
#sideSocialModule {}
  #sideSocialModule li{ margin: 0 0 10px}
  #sideSocialModule .fb_edge_widget_with_comment{ position: absolute !important;}

/* sideFbModule */
#sideFbModule { margin-bottom: 20px;}
  #sideFbModule .fb-like-box { height:330px; width:298px; background: #fff; border: 1px solid #ccc; border-top: 1px solid #315C99; background: #fff}

/* sideNotification */
#sideNotification { margin: 0 0 20px;}
  #sideNotification  a:hover { text-decoration: underline!important;}
  #sideNotification .radius-5-white-shadow{ padding: 0;}
  #sideNotification .dataList { border: none; margin: 0}
  #sideNotification .dataList li:last-child { border: none;}
  #sideNotification .dataList .itemTitle{ font-size: 100%; line-height: 1.5}
  #sideNotification .dataList .balloon{ top:inherit; bottom: 15px; right: 10px;}

/*****************
column & box class
******************/
/* column */
.column{ overflow: hidden;}
  .column .column{ float: left;}

  /* column + column-(n) */
  .column-2{ }
    .column-2 .column{  width: 49%; margin-right: 0;}
    .column-2 .column:nth-child(2n) { float: right;}

  .column-2-fixed { }
    .column-2-fixed .column{ width: 326px; margin-right: 0;}
    .column-2-fixed .column-last { float: right;}

  .column-3{ }
    .column-3 .column{ width: 32%; margin-right: 2%;}
    .column-3 .column:nth-child(3n) { margin-right: 0;}

/* radius 5px white for inline-block link List */
.radius-5-white { overflow: hidden; box-sizing: border-box;}
  .radius-5-white li{ display: block; float: left; margin: 0 5px 5px 0; background: #fff; border-radius: 5px;}
  .radius-5-white li.blue{ background: #F1F8FE; font-weight: bold;}
  .radius-5-white a{ display: block; padding: 0 7px; line-height: 26px;}
  .radius-5-white a:hover{ text-decoration: underline;}

/* radius 5px white shadow for section */
.radius-5-white-shadow{ display: block; background: #fff; overflow: hidden; margin: 0 2px 15px 0;
  border-radius: 5px; padding: 15px; box-shadow: 1px 1px 1px #b3b3b3;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
  box-sizing: border-box;}
    .radius-5-white-shadow .prGenreTxt {padding-top: 10px;}
    .radius-5-white-shadow .prGenreTxt .description {line-height: 100%}
    .radius-5-white-shadow .prGenreTxt .site {padding-top: 3px; font-size: 93%; color: #aaaaaa;}

/* radius 5px sub shadow for section */
.radius-5-sub-shadow{ display: block; background: #DFEFFD; overflow: hidden; margin: 0 2px 15px 0;
  border-radius: 5px; padding: 4px; box-shadow: 1px 1px 1px #b3b3b3;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
  box-sizing: border-box;}
  .radius-5-sub-shadow.gray { background: #fff;}
  .radius-5-sub-left {background: #fff; width: 50%; float: left;}
  .radius-5-sub-right {background: #F1F8FE; width: 50%; float: right;}
  .radius-5-sub-shadow.gray .radius-5-sub-right {background: #F7F7F7;}
  .radius-5-sub-shadow .inner { padding: 10px;}
  .radius-5-sub-shadow .cap{ display: inline-block; padding: 2px 10px 0; margin: 0 0 8px; border-radius: 20px; background: #6bb0f5;
    color: #fff ; line-height: 20px; font-size: 1.1rem; box-shadow: none; text-shadow: none;}
  .radius-5-sub-shadow a:hover { text-decoration: underline!important}

/* solid white shadow box */
.solid-white-shadow a{ display: block; overflow: hidden; box-shadow: 1px 1px 1px #b3b3b3; font-size: 116%; line-height: 1.5; background: #fff; margin:0 1px 1px 0}

/********************************** ここ古い記述 **********************************/

/* radius 5px blue */
.more a {display: block; padding: 3px; background: #90bae4; text-align: center; color: #fff ; font-size: 85%; border-radius: 5px; text-shadow: 0 -1px 0 #2380c0;}

  .more { height: 24px; text-align: right; display: block; overflow: hidden;}
    .more a{ box-shadow: 0 1px 0 #e1ecf6; margin: 0 0 1px; display: block; line-height: 23px; float: right; padding: 0 5px;}
    .more a:hover{ color: #fff ; text-decoration: none; background: #6BB0F5;}

/* radius 5px white  */
a.rad5_W ,
.rad5_W a{ display: inline-block; height: 25px; padding: 0 5px; background: #fff; line-height: 27px; overflow: hidden; border-radius: 5px;}
.rad5_W a:hover{ text-decoration: underline!important;}

/* radius 5px blue */
.more a ,
.genreName {display: block; padding: 3px; background: #90bae4; text-align: center; color: #fff !important; font-size: 85%; border-radius: 5px; text-shadow: 0 -1px 0 #2380c0;}

  .genreName{ border-radius: 10px; padding: 2px 8px; background: #6bb0f5; margin: 0 5px 7px; box-shadow: 0 1px 0 #e1ecf6; line-height: 16px;}

  .more { height: 24px; text-align: right; display: block; overflow: hidden;}
    .more a{ box-shadow: 0 1px 0 #e1ecf6; margin: 0 0 1px; display: block; line-height: 23px; float: right; padding: 0 5px;}
    .more a:hover{ color: #fff !important; text-decoration: underline !important}


/********************************** ここ古い記述 **********************************/

/*****************
list layout set
******************/

/* .thumb */
.thumb{ display: block; float: left; text-align: center; overflow: hidden;}
  .thumb img{ max-width: 100%; max-height: 100%; margin: 0 auto; vertical-align: middle;}
  .thumb a:hover{ text-decoration: none;}

  /* + line-height */
  .figureList .thumb{ width: 120px; height: 120px; line-height: 118px; background: #333;}
  .showcase .thumb{ width: 210px; height: 140px; line-height: 138px; float: none; background: #333;}
  .dataList .thumb{ width: 50px; height: 50px; line-height: 48px; background: #fff; border: solid 1px #ddd;}
  .noticeList .thumb{ width: 50px; height: 50px; line-height: 48px; background: #fff; border: solid 1px #ddd;}
  .relatedList .thumb{ width: 60px; height: 60px; line-height: 58px;}
  .thumbList .thumb{ width: 100px; height: 50px; margin: 0 10px 0 0;}

    /* .thumb > .noImages */
    .noImage{ display: block; background: #eee; color: #bcbcbc; text-align: center; text-shadow: 0 1px 0 #fff;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
      box-sizing: border-box;}
      .figureList .noImage{ line-height: 120px;}
      .showcase .noImage{ line-height: 140px;}
      .dataList .noImage ,
      .noticeList .noImage ,
      .memberList .noImage ,
      .relatedList .noImage { line-height: 1.4; font-size: 85%; height: 50px; padding: 12px 0 0;}
      .relatedList .noImage{  height: 60px; padding: 16px 0 0;}

      .memberLogoTH .noImage{ width: 150px; height: 150px; line-height: 150px; font-weight: normal}
      .memberLogoTH a:hover{ text-decoration: none;}

/* thumbList */
.thumbList{ }
  .thumbList li{ overflow: hidden}

/* figureList　*/
.figureList{}
.figureList .cap a{ display: block; padding: 0 8px; margin: 0 5px 7px; border-radius: 10px; background: #6bb0f5;
  text-align: center; color: #fff ; line-height: 20px; text-decoration: none; font-size: 1.1rem;
  box-shadow: 0 1px 0 #e1ecf6; text-shadow: 0 -1px 0 #2380c0;}
  .figureList figure{ display: block; overflow: hidden; margin: 0 2px 10px 0;}
  .figureList figcaption { margin: 0 0 0 130px;}
  .figureList figcaption a{ display: block; position: relative; text-decoration: none; min-height: 120px;}
  .figureList time{ display: block;}

  /* figureList (normal) */
  .figureList .itemName{ font-size: 1.5rem; line-height: 1.5; margin: 0 0 5px;}
  .figureList .itemName:hover{ text-decoration: underline;}
  .figureList .itemDesc{ color: #666; line-height: 1.5; margin: 0 0 5px; font-size: 1.2rem;}

  .figureList figcaption .fL{ width: 300px;}
  .figureList .itemDeta{ float: right; width: 170px; min-height: 120px; padding: 0 0 0 15px; border-left: dotted 1px #ccc;}
    .figureList .itemDeta .date-s { margin: 0 0 5px}
    .figureList .itemDeta .balloon { margin: 0 5px 5px 0;}

    .figureList .prTxt a{ display: block; margin: 0 0 0 50px; font-size: 1.5rem;}
    .figureList .prIcon{ display: block; float: left; width: 26px; padding: 3px 8px;
      text-align: center; color: #fff !important;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
      border-radius: 5px;
        -webkit-text-shadow: 0 -1px 0 #2380c0;
        -moz-text-shadow: 0 -1px 0 #2380c0;
      text-shadow: 0 -1px 0 #2380c0;
      background: #5faaf7;}

  /* figureList + showcase */
  .showcase .column{ width: 212px; margin: 0 17px 20px 0;}
    .showcase figure { display: block; overflow: hidden; background: #fff; margin: 0 2px 2px 0;
    box-shadow: 1px 1px 1px #b3b3b3;}
    .showcase figcaption { margin: 0;}
    .showcase figcaption a{ min-height: 100px; padding: 10px; position: relative;}
    .showcase .sm-gray { position: absolute; bottom: 10px; right: 10px; margin: 0;}
    .showcase .balloon{ position: absolute; right: 10px; bottom:36px; margin: 0;}

  /* figureList + relatedList */
  .relatedList{}
    .relatedList figcaption{ margin: 0 0 0 70px;}
    .relatedList figcaption a ,
    .relatedList .itemDeta{ min-height: 60px;}
    .relatedList figcaption .fL{ width: 380px;}

  /* figureList + rankingList */
  .rankingList{}
    .rankingList figure{ position: relative;}
    .rankingList .badge { position: absolute; top: 7px; left: 7px;
      height: 32px; width: 32px; line-height: 31px; padding: 0;
        -webkit-border-radius: 32px;
        -moz-border-radius: 32px;
      border-radius: 32px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
      box-sizing: border-box;}

  .state{ display: block; float: left; width: 20px; padding: 20px 0 0; height: 0; overflow: hidden; margin: 0 10px 0 0;}
    .rankUp{ background: url(../images/exblog_base/icon_rank_up.png) no-repeat 0 0;}
    .rankFlat{ background: url(../images/exblog_base/icon_rank_flat.png) no-repeat 0 0;}
    .rankDown{ background: url(../images/exblog_base/icon_rank_down.png) no-repeat 0 0;}

/* imgList */
.imgList { overflow: hidden;}
  .imgList li{ display: block; float: left; margin: 0 13px 0 0;
    background: #333; border: 1px solid #333; height: 93px; width: 93px; text-align: center; line-height: 91px;}
  .imgList li img{ max-height: 93px; max-width: 100%; vertical-align: middle;}
  .imgList li:last-child{ margin: 0;}

/* noticeList */
.noticeList { border-top: dotted 1px #ccc; margin: 0 0 10px;}
  .noticeList .notice{ padding: 15px; border-bottom: dotted 1px #ccc; position: relative;}

  /* noticeHeader */
  .noticeList .noticeHeader{ overflow: hidden; position: relative;}
    .noticeList header{ margin: 0 0 10px 60px; padding: 0 10px 5px; height: 52px; border-bottom: dotted 1px #eee; position: relative;}
      .noticeList h1 a{ font-weight: bold; font-size: 108%; line-height: 2;}
      .noticeList .itemName:hover{ text-decoration: underline;}
    .noticeList .noticeInner{ font-size: 93%; color: #666; line-height: 1.5; margin: 0 0 5px 70px;}
    .noticeList .msg{ padding: 10px; color: #c09853; padding: 8px 14px; margin: 10px 0; background: #fcf8e3;
        border: 1px solid #fbeed5; text-shadow: 0px 1px 0px #fff; border-radius: 3px;}
    .noticeList .balloon { position: absolute; top: 0; right: 0;}
    .noticeDelete { position: absolute; top: 15px; right: 15px;}
    .noticeDelete input{ display: inline-block; width: 16px; height: 0; padding: 16px 0 0;
      border: none; overflow: hidden; cursor: pointer; outline: none;
      background: url(../images/exblog_base/icon_circle_close.png) no-repeat;}

/* dataList */
.dataList { border-top: dotted 1px #ccc; margin: 0 0 10px;}
  .dataList li{ padding: 15px; border-bottom: dotted 1px #ccc; position: relative; overflow: hidden;}
  .dataList .itemData{ margin: 0 0 0 60px;}
    .dataList .itemTitle{ font-size: 108%; font-weight: bold; line-height: 30px;}
    .dataList .itemDesc{ color: #666; line-height: 1.5; margin: 0 0 5px; font-size: 1.2rem;}
    .dataList .update { font-size: 85%; color: #999;}
    .dataList .balloon {position: absolute; top: 15px; right: 15px;}

/* noItem */
.noItem ,
.noItemList{ display: block; padding: 50px 0; text-align: center; background: #f7f7f7; border: dotted 2px #eee; color: #999;}
.noItemList{ font-size: 118%;}

/* list_blue */
.list_blue_arrow li{ padding: 0 0 0 23px; line-height: 2;
  background: url(../images/exblog_base/icon_list_blue_arrow.png) no-repeat 9px 7px;}
.list_blue_dot {padding-left: 5px;}
.list_blue_dot li { font-size: 1.3rem; margin-top: 5px; padding-left:10px; background: url(../images/exblog_base/icon_blue_dot.png) no-repeat 0 7px;}
.list_blue_dot a:hover { text-decoration: underline!important;}
.list_blue_arrow .pr, .list_blue_dot .pr {padding-left:0; background:none;}
.list_blue_arrow .pr .pr, .list_blue_dot .pr .pr, .prIco { color: #A6CFF9; font-weight: bold;}


/*****************
alert set
******************/
/* alert */
.alert{ display: block; color: #c09853; padding: 8px 14px; background: #fcf8e3;
  border: 1px solid #fbeed5; text-shadow: 0px 1px 0px #fff; border-radius: 3px;}
  .alert strong{ margin: 0 10px 0 0;}
  .alert a{ color: #c09853;}
  .alert .close{ float: right; padding: 0; color: #999; background: none; border: none; cursor: pointer;
    font-weight: bold; line-height: 16px; font-size: 16px; text-shadow: 0 1px 0 #fff; outline: none;}

    /* alert + optionclass */
    .alert-green{ color: #468847; background: #dff0d8; border-color: #c2d5b3;}
    .alert-green a{ color: #468847;}
    .alert-blue{ color: #3a87ad; background: #d9edf7; border-color: #bce8f1;}
    .alert-blue a{ color: #3a87ad;}
    .alert-red{ color: #b94a48; background: #f2dede; border-color: #eed3d7;}
    .alert-red a{ color: #b94a48;}

    /* attention text */
    .att{ color: #666}
    .att span{ color: #b94a48; font-weight: bold; margin: 0 5px 0 0}

/*****************
breadcrumbs set
******************/
.breadcrumbs{}
  .breadcrumbs ul{ overflow: hidden;}
  .breadcrumbs li { display: inline; padding: 0 0 0 25px;
    color: #666; font-weight: bold; line-height: 32px; vertical-align: middle;
    font-size: 108%; text-shadow: 0 1px 0 #f7f7f7;
    background: url(../images/exblog_base/titleTxt_arrow.png) no-repeat 8px center;}
  .breadcrumbs li a{ color: #666; border-bottom: dotted 1px #999; padding: 0 0 2px;}
  .breadcrumbs li a:hover{ border: none; text-decoration: none;}

.breadcrumbs2 { color: #999; font-size: 10px; line-height: 1.2; margin-bottom: 5px;}
  .breadcrumbs2 li { display: inline; padding-right: 5px;}
  .breadcrumbs2 li a { color: #999; padding-right: 12px;
    background: url(../images/exblog_base/icon_breadcrumbs2.png) no-repeat right center;}

/*****************
pager set
******************/
/* pager */
.pager{ line-height: 30px; position: relative; overflow: hidden;}
  .pager ul{ height: 30px; text-align: right;}
    .pager li { display: inline-block; height: 30px; margin: 0 5px 0 0;
      font-weight: bold; text-align: center; font-size: 85%; vertical-align: top;}

    .pager li span ,
    .pager li a{ display:inline-block; padding: 0 10px; cursor: pointer; color: #444;
      background: #ccc; border: solid 1px #ccc;
      text-shadow: 0 1px #fff; border-radius: 3px; box-shadow: 0 1px 0 #eee ;
      background: #f5f5f5;
      background: linear-gradient(to bottom, #ffffff 0%,#eeeeee 100%);
    		-webkit-box-sizing: border-box;
    		-moz-box-sizing: border-box;
    		-o-box-sizing: border-box;
    		-ms-box-sizing: border-box;
    	box-sizing: border-box;}
    	.pager li a{ line-height: 26px;}
      .pager li a:hover { background: #eee; box-shadow: none}
      .pager .current { background: none; border: none; box-shadow: none;}

  .pagerOption{ float: left;}
  .pagerInfo{ color: #666; position: absolute; top:0; left: 10px;}

  /* #upperPager + .pager */
  #upperPager{ }

  /* #bottomPager + .pager */
  #bottomPager ul{ float: right;}
  #bottomPager .pagerInfo{ float: left }

/* small size form ページャー内のformとform-sのサイズを同じにする*/
.pager label ,
.pager select{ height: 28px; line-height: 30px; padding: 0 8px; vertical-align: top;}
.pager select{ height: 30px; padding: 5px;}

.pager input[type="radio"] ,
.pager input[type="checkbox"] { margin: 0 5px 0 0; vertical-align: middle}

.pager input[type="search"] ,
.pager input[type="password"] ,
.pager input[type="text"],
.pager textarea { width: 100%; height: 30px; line-height: 30px; overflow: hidden; padding: 0 10px; vertical-align: top }

.pager .textForm input[type="text"] ,
.pager .textForm input[type="search"] { padding-left:30px; background-position: 4px center;}

.form-s { line-height: 30px;}
.form-s label ,
.form-s select{ height: 28px; line-height: 28px; padding: 0 8px; vertical-align: top;}
.form-s select{ height: 30px; padding: 5px;}

.form-s .btn-s ,
.form-s .btn-s input ,
.form-s .btn-s button ,
.form-s .btn-s a ,
.form-s .btn-s span { height: 30px; line-height: 24px; font-size: 100%; vertical-align: top;}

.form-s input[type="radio"] ,
.form-s input[type="checkbox"] { margin: 7px 5px 0 0; vertical-align: top}

.form-s input[type="search"] ,
.form-s input[type="password"] ,
.form-s input[type="text"],
.form-s textarea { width: 100%; height: 30px; line-height: 30px; overflow: hidden; padding: 0 10px; vertical-align: top }

/*****************
tabmenu set
******************/

/* tabmenu */
  .tabmenu ul{ height: 40px; line-height: 34px; padding: 0 15px; /* top: -1px; position: relative; */}
  .tabmenu li { display: inline-block; vertical-align: top; margin: 4px 5px 0 0 ;
    border: solid 1px #ccc; border-radius: 3px 3px 0 0; position: relative; z-index: 1;}
  .tabmenu li:last-child{ margin-right: 0;}
  .tabmenu a ,
  .tabmenu span { display: block; min-width: 75px; padding: 0 15px; background: #ededed;
    color: #333; text-align: center;
    border: solid 1px #fff; border-bottom: none; font-weight: bold;
    border-radius: 3px 3px 0 0; text-shadow: 0 1px 0 #fff; box-shadow: 0 -2px 5px #e2e2e2 inset;}
  .tabmenu .current{ background: #fff; border-bottom: solid 1px #fff; line-height: 38px; margin: 0 5px 0 0 }
  .tabmenu a:hover ,
  .tabmenu span:hover ,
  .tabmenu .current a { text-decoration: none; box-shadow: none; cursor: pointer; background: #fff;
    background: linear-gradient(to bottom, #F1F6F9 0%,#ffffff 10%);}
  .tabmenu .invalid a ,
  .tabmenu .invalid span{ color: #ccc; background:#f7f7f7;
    box-shadow: none; font-weight:normal; text-decoration: none; cursor: default;}

    .tabmenu .badge{ position: absolute; top: -5px; right: -5px;}

  .tabInner{ padding: 15px; background: #fff; border: solid 1px #ccc; overflow: hidden; border-radius: 3px;}

/*****************
table set 2014/06/24 update
******************/
table{ width: 100%; margin: 0 auto; background: #fff;
  border-collapse: separate; border-spacing: 0; border: solid 1px #ddd; border-bottom: none;}
  caption{ background:#F1F6F9; font-weight: bold; padding: 7px 15px;
    border: solid 1px #ddd; border-bottom: none;
    box-shadow: 1px 1px 0px #fff inset;}
  th,td{ padding: 10px 15px; border-bottom: solid 1px #ddd; border-right: solid 1px #ddd;}
  th{ text-align: left; font-weight: bold; color: #444; background: #f7f7f7; box-shadow: 1px 1px 0 #fff inset;}
    th:only-child ,
    th:last-child ,
    td:only-child ,
    td:last-child{ border-right: none}
  .tableHead th{ background:#F1F6F9; text-align: center;}

/*****************
notes box set
******************/
/* notes */
.notesWrap{ background: url(../images/exblog_base/bg_notes.png); padding: 5px;}
.notes { background: #fff; padding: 15px;}
.notesBoxHead{ padding:0 10px; color: #666; line-height: 32px; vertical-align: middle; border-bottom: dotted 1px #ddd;}
.notesBoxHead h1{ font-weight: bold; font-size:108%;}
.notesInner{ padding: 10px; color: #666}

  /* notes + denger */
  .notes-red{ background: url(../images/exblog_base/bg_notes_denger.png);}
  .notes-red .notesBoxHead{ color: #ba4859}

/*****************
balloon set
******************/
.balloon{ display: inline-block; padding: 0 5px; line-height: 22px; font-size: 1.1rem; border-radius: 3px;
  white-space: nowrap; text-overflow: ellipsis;
  color: #777; background: #eee; margin: 0 5px 0 5px; position: relative; z-index: 1}
  .balloon a { text-decoration: underline!important;}
  .balloon a:hover { text-decoration: none!important;}
  .balloon:before { content: "◀"; position: absolute; color: #eee; left:-8px; top:0; font-size: ; z-index: -1;}
  .balloon .fa{ margin: 0 3px 0 0;}

  .balloon-red, .balloon-red a { color: #b94a48; background: #f2dede;}
  .balloon-red:before { color: #f2dede;}
  .balloon-red .fa{ color: #d58c8b;}
  .balloon-blue, .balloon-blue a { color: #3a87ad; background: #d9edf7;}
  .balloon-blue:before { color: #d9edf7;}
  .balloon-blue .fa{ color: #74a8c1;}
  .balloon-green, .balloon-green a { color: #468847; background: #dff0d8;}
  .balloon-green:before { color:#dff0d8;}
  .balloon-green .fa{ color: #81bb82;}
  .balloon-yellow, .balloon-yellow a { color: #c09853; background: #fbf2c7;}
  .balloon-yellow:before{ color: #fbf2c7;}
  .balloon-yellow .fa{ color: #d5b988;}

/*****************
badge set
******************/
.badge{ display: inline-block; padding: 0 8px;
  min-width: 24px; height: 24px; line-height: 24px; border-radius: 24px;
  font-size: 1.2rem; text-align: center; font-weight: bold;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
  box-sizing: border-box;}

  /* badge + color option */

  /* red */
  .badge-red{ color: #fff; border: solid 1px #da4153;
    box-shadow: 0 1px 0 #ff7e90 inset; text-shadow: 0px -1px 0px #cd3535;
    background: #f75f74;
    background: linear-gradient(to bottom, #f75f74 0%,#ee4054 100%);}

  /* blue */
  .badge-blue{ color: #fff; border: solid 1px #418dda;
    text-shadow: 0px -1px 0px #1c6dbf; box-shadow: 0 1px 0 #7ebeff inset;
    background: #5faaf7;
    background: linear-gradient(to bottom, #5faaf7 0%,#4096ee 100%);}

/*****************
 share class
******************/
.clear{ clear: both;}
.disp{display:inline-block; overflow:hidden; height:0;}
.disNon{display: none;}
.ovH{ overflow: hidden;}
.fL{ float: left;}
.fR{ float: right;}
.taC{text-align:center} .taL{text-align:left} .taR{text-align:right}

.liDisc ,
.liDec{ margin: 10px;}
.liDisc li{ list-style: disc outside; margin: 0 0 10px 20px; /* color: #20C125; */ }
.liDec li{ list-style: decimal outside; margin: 0 0 10px 20px;}
  .liDisc li:only-child ,
  .liDisc li:last-child ,
  .liDec li:only-child ,
  .liDec li:last-child{ margin-bottom: 0;}

.nowrap{ white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}

.noLine-top{ border-top: none;} .noLine-left{ border-left: none;}
.noLine-bottom{ border-bottom: none;} .noLine-right{ border-right: none;}

.m0A{margin:0 auto;}
.m0{ margin:0}     .mT0{margin-top:0}     .mB0{margin-bottom:0}     .mR0{margin-right:0}     .mL0{margin-left:0}
.m5{ margin:5px}   .mT5{margin-top:5px}   .mB5{margin-bottom:5px}   .mR5{margin-right:5px}   .mL5{margin-left:5px}
.m10{margin:10px} .mT10{margin-top:10px} .mB10{margin-bottom:10px} .mR10{margin-right:10px} .mL10{margin-left:10px}
.m15{margin:15px} .mT15{margin-top:15px} .mB15{margin-bottom:15px} .mR15{margin-right:15px} .mL15{margin-left:15px}
.m20{margin:20px} .mT20{margin-top:20px} .mB20{margin-bottom:20px} .mR20{margin-right:20px} .mL20{margin-left:20px}
.m30{margin:30px} .mT30{margin-top:30px} .mB30{margin-bottom:30px} .mR30{margin-right:30px} .mL30{margin-left:30px}
.m40{margin:40px} .mT40{margin-top:40px} .mB40{margin-bottom:40px} .mR40{margin-right:40px} .mL40{margin-left:40px}
.m50{margin:50px} .mT50{margin-top:50px} .mB50{margin-bottom:50px} .mR50{margin-right:50px} .mL50{margin-left:50px}

.p0{ padding:0}     .pT0{padding-top:0}     .pB0{padding-bottom:0}     .pR0{padding-right:0}     .pL0{padding-left:0}
.p5{ padding:5px}   .pT5{padding-top:5px}   .pB5{padding-bottom:5px}   .pR5{padding-right:5px}   .pL5{padding-left:5px}
.p10{padding:10px} .pT10{padding-top:10px} .pB10{padding-bottom:10px} .pR10{padding-right:10px} .pL10{padding-left:10px}
.p15{padding:15px} .pT15{padding-top:15px} .pB15{padding-bottom:15px} .pR15{padding-right:15px} .pL15{padding-left:15px}
.p20{padding:20px} .pT20{padding-top:20px} .pB20{padding-bottom:20px} .pR20{padding-right:20px} .pL20{padding-left:20px}
.p30{padding:30px} .pT30{padding-top:30px} .pB30{padding-bottom:30px} .pR30{padding-right:30px} .pL30{padding-left:30px}
.p40{padding:40px} .pT40{padding-top:40px} .pB40{padding-bottom:40px} .pR40{padding-right:40px} .pL40{padding-left:40px}
.p50{padding:50px} .pT50{padding-top:50px} .pB50{padding-bottom:50px} .pR50{padding-right:50px} .pL50{padding-left:50px}

.w10{width:10px} .w20{width:20px} .w30{width:30px} .w40{width:40px} .w50{width:50px} .w60{width:60px} .w70{width:70px} .w80{width:80px} .w90{width:90px}
.w100{width:100px} .w110{width:110px} .w120{width:120px} .w130{width:130px} .w140{width:140px} .w150{width:150px} .w160{width:160px} .w170{width:170px} .w180{width:180px} .w190{width:190px}
.w200{width:200px} .w210{width:210px} .w220{width:220px} .w230{width:230px} .w240{width:240px} .w250{width:250px} .w260{width:260px} .w270{width:270px} .w280{width:280px} .w290{width:290px}
.w300{width:300px} .w310{width:310px} .w320{width:320px} .w330{width:330px} .w340{width:340px} .w350{width:350px} .w360{width:360px} .w370{width:370px} .w380{width:380px} .w390{width:390px}
.w400{width:400px} .w410{width:410px} .w420{width:420px} .w430{width:430px} .w440{width:440px} .w450{width:450px} .w460{width:460px} .w470{width:470px} .w480{width:480px} .w490{width:490px}
.w500{width:500px} .w510{width:510px} .w520{width:520px} .w530{width:530px} .w540{width:540px} .w550{width:550px} .w560{width:560px} .w570{width:570px} .w580{width:580px} .w590{width:590px}
.w600{width:600px} .w610{width:610px} .w620{width:620px} .w630{width:630px} .w640{width:640px} .w650{width:650px} .w660{width:660px} .w670{width:670px} .w680{width:680px} .w690{width:690px}
.w700{width:700px} .w710{width:710px} .w720{width:720px} .w730{width:730px} .w740{width:740px} .w750{width:750px} .w760{width:760px} .w770{width:770px} .w780{width:780px} .w790{width:790px}
.w800{width:800px} .w810{width:810px} .w820{width:820px} .w830{width:830px} .w840{width:840px} .w850{width:850px} .w860{width:860px} .w870{width:870px} .w880{width:880px} .w890{width:890px}
.w900{width:900px} .w910{width:910px} .w920{width:920px} .w930{width:930px} .w940{width:940px} .w950{width:950px} .w960{width:960px} .w970{width:970px} .w980{width:980px} .w990{width:990px}
.h10{height:10px} .h20{height:20px} .h30{height:30px} .h40{height:40px} .h50{height:50px} .h60{height:60px} .h70{height:70px} .h80{height:80px} .h90{height:90px}
.h100{height:100px} .h110{height:110px} .h120{height:120px} .h130{height:130px} .h140{height:140px} .h150{height:150px} .h160{height:160px} .h170{height:170px} .h180{height:180px} .h190{height:190px}
.h200{height:200px} .h210{height:210px} .h220{height:220px} .h230{height:230px} .h240{height:240px} .h250{height:250px} .h260{height:260px} .h270{height:270px} .h280{height:280px} .h290{height:290px}
.h300{height:300px} .h310{height:310px} .h320{height:320px} .h330{height:330px} .h340{height:340px} .h350{height:350px} .h360{height:360px} .h370{height:370px} .h380{height:380px} .h390{height:390px}
.h400{height:400px} .h410{height:410px} .h420{height:420px} .h430{height:430px} .h440{height:440px} .h450{height:450px} .h460{height:460px} .h470{height:470px} .h480{height:480px} .h490{height:490px}
.h500{height:500px} .h510{height:510px} .h520{height:520px} .h530{height:530px} .h540{height:540px} .h550{height:550px} .h560{height:560px} .h570{height:570px} .h580{height:580px} .h590{height:590px}
.h600{height:600px} .h610{height:610px} .h620{height:620px} .h630{height:630px} .h640{height:640px} .h650{height:650px} .h660{height:660px} .h670{height:670px} .h680{height:680px} .h690{height:690px}
.h700{height:700px} .h710{height:710px} .h720{height:720px} .h730{height:730px} .h740{height:740px} .h750{height:750px} .h760{height:760px} .h770{height:770px} .h780{height:780px} .h790{height:790px}
.h800{height:800px} .h810{height:810px} .h820{height:820px} .h830{height:830px} .h840{height:840px} .h850{height:850px} .h860{height:860px} .h870{height:870px} .h880{height:880px} .h890{height:890px}
.h900{height:900px} .h910{height:910px} .h920{height:920px} .h930{height:930px} .h940{height:940px} .h950{height:950px} .h960{height:960px} .h970{height:970px} .h980{height:980px} .h990{height:990px}

.w100per{width:100%}

.fwB {font-weight:bold;}
.fs10	{font-size:10px; font-size:1rem}   .fs16{font-size:16px; font-size:1.6rem} .fs22{font-size:22px; font-size:2.2rem}
.fs11	{font-size:11px; font-size:1.1rem} .fs17{font-size:17px; font-size:1.7rem} .fs23{font-size:23px; font-size:2.3rem}
.fs12	{font-size:12px; font-size:1.2rem} .fs18{font-size:18px; font-size:1.8rem} .fs24{font-size:24px; font-size:2.4rem}
.fs13	{font-size:13px; font-size:1.3rem} .fs19{font-size:19px; font-size:1.9rem} .fs25{font-size:25px; font-size:2.5rem}
.fs14	{font-size:14px; font-size:1.4rem} .fs20{font-size:20px; font-size:2.0rem} .fs26{font-size:26px; font-size:2.6rem}
.fs15	{font-size:15px; font-size:1.5rem} .fs21{font-size:21px; font-size:2.1rem} .fs27{font-size:27px; font-size:2.7rem}

.sm{font-size: 1.1rem;}
.sm-gray{font-size: 11px; font-size: 1.1rem; color: #999;}
.sm-red{ font-size: 11px; font-size: 1.1rem; color: #b94a48;}
.sm-blue{font-size: 11px; font-size: 1.1rem; color: #3a87ad;}
.sm-green{font-size: 11px; font-size: 1.1rem; color: #468847;}
.sm-yellow{font-size: 11px; font-size: 1.1rem; color: #c09853;}

/* attention text */
.att{ color: #666; font-size: 1.1rem;}
.att span{ color: #b94a48; padding: 0 5px 0 0;}

/* new mark */
.new-text{ color: #e86967; background: #fffdae; font-size: 1.1rem;}
.new-post:before{ content: 'New!'; float: left; margin: 3px 5px 0 0;
  color: #e86967; background: #fffdae; font-size: 1.1rem; line-height: 1.3rem}