.PopupPanel
{
    position: fixed;
    left: 50%;
    top: 43%;
    z-index: 10;

    height: 380px;
    margin-top: -190px;

    width: 300px;
    margin-left: -150px;
    
}

.book
{
	position:relative; 
	left:0; 
	right:0; 
	margin-left:auto; 
	margin-right:auto; 
	cursor: pointer; 
	
	background-size:cover; 
	width:300px; 
	height:403px;
	border-radius: 15px;
	-khtml-border-radius: 15px;
}

.super_book
{
	position:relative; 
	left:0; 
	right:0; 
	margin-left:auto; 
	margin-right:auto; 
	cursor: pointer; 
	
	background-size:cover; 
	width:100%; 
	height:230px;
	
	
	border-radius: 15px;
	-khtml-border-radius: 15px;
}


.smallbook
{
	position:relative; 
	left:0; 
	right:0; 
	margin-left:auto; 
	margin-right:auto; 
	cursor: pointer; 
	
	background-size:cover; 
	width:140px; 
	height:189px;
	border-radius: 7px;
	-khtml-border-radius: 7px;
}

.notice_title {
  display: block;
  padding: 4px;
  line-height: 1.42857143;
  background-color: #d0c8ab;
  -webkit-transition: all .2s ease-in-out;
       -o-transition: all .2s ease-in-out;
          transition: all .2s ease-in-out;
}

.circle-40 {
 background-color: rgba(204, 0, 102, 0);
 border: 1px solid rgba(0, 0, 0, .3);;
 height: 40px;
 width: 40px;
 -moz-border-radius:20px;
 -webkit-border-radius:20px;
 border-radius: 20px;
 -khtml-border-radius: 20px;
}

.circle-50 {
 background-color: rgba(204, 0, 102, 0);
 border: 1px solid rgba(0, 0, 0, .3);;
 height: 50px;
 width: 50px;
 -moz-border-radius:25px;
 -webkit-border-radius:25px;
 border-radius: 25px;
 -khtml-border-radius: 25px;
}

.circle-60 {
 background-color: rgba(204, 0, 102, 0);
 border: 0px solid rgba(0, 0, 0, .3);;
 height: 60px;
 width: 60px;
 -moz-border-radius:30px;
 -webkit-border-radius:30px;
 border-radius: 30px;
 -khtml-border-radius: 30px;
}

#header-new {
    background: -moz-linear-gradient(center top , #454b56, #393f48) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-bottom: 1px solid #262932;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
    left: 0;
    margin: 0 0 39px;
    position: fixed;
    text-align: center;
    top: 0;
    width: 100%;
    z-index: 10;
}


.notice_body {
  display: block;
  padding: 4px;
  line-height: 1.42857143;
}
.thumbnail_notice {
  display: block;
  padding: 0px;
  margin-bottom: 10px;
  line-height: 1.42857143;
  background-color: #f7f4e9;
  border: 1px solid #d0c8ab;
  border-radius: 2px;
  -webkit-transition: all .2s ease-in-out;
       -o-transition: all .2s ease-in-out;
          transition: all .2s ease-in-out;
}
.font_point {
	color: #f9a91d;
	font-size: 7pt;
}
.font_text {
	color: #453c1d;
	font-size: 10pt;
	font-weight: 300;
}
.timeline_mid {
	color:#39300e;
	font-size: 11pt;
	font-weight: 700;
}
.timeline_date {
	color:#c5c1b2;
	font-size: 8pt;
}
.timeline_comment_date {
	color:#b4af94;
	font-size: 9pt;
}

.thumbnail_control {
  display: block;
  padding: 5px;
  padding-right: 10px;
  
  line-height: 1.42857143;
  background-color: #ffffff;
  border: 1px solid #dad7cd;
  font-size: 9px;
  color:#968f74;
  border-radius: 15px;
}


.top
{
	
	position: fixed;
	top:0;
	
	width: 100%;
	height:50px;
	z-index: 10;
	background-color: #fcab1e;
}

.swiper-container {
  width: 98%;
  background-color: #000;
  height: 200px;
  color: #fff;
  text-align: center;
}

.swiper-slide {
  width:300px;
  height:200px;
  opacity: 0.3;
  
  -webkit-transition: 300ms;
  -moz-transition: 300ms;
  -ms-transition: 300ms;
  -o-transition: 300ms;
  transition: 300ms;
  
}


.swiper-slide-active {
  opacity: 1;
}

.swiper-slide .title {
  font-style: italic;
  font-size: 42px;
  margin-top: 80px;
  margin-bottom: 0;
  line-height: 45px;
}
.pagination {
  position: absolute;
  z-index: 20;
  left: 10px;
  bottom: 10px;
}
.swiper-pagination-switch {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 8px;
  background: #222;
  margin-right: 8px;
  opacity: 0.8;
  border: 1px solid #fff;
  cursor: pointer;
}
.swiper-visible-switch {
  background: #aaa;
}
.swiper-active-switch {
  background: #fff;
}




#coverImg{
	margin-bottom:10px;
	min-height:300px;
	background-size:cover;
	position: relative;
}

#coverText{
	z-index: 100;
	bottom: 0px;
	padding: 10px;
	position: absolute;
	font-color:#ffd25a;
	width:100%;
}



.centered{
   position: fixed;
   top: 50%;
   left: 50%;
   width: 100px;
   height: 100px;
   margin-top: -50px; /* Half the height */
   margin-left: -50px; /* Half the width */
   visibility: hidden;
  opacity: 0;
  z-index: 99999;
}

.centeredShow { 
  visibility: visible;
  opacity: 1;
  -webkit-transition: opacity 0.3s linear;
  transition: opacity 0.3s linear;
}

.centeredHide { 
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity 0.5s linear;
  transition: opacity 0.5s linear;
}


a { text-decoration:none; color:#0066CC; border:0px;

a:hover { text-decoration:underline; color:#0066cc }

*
{ margin:0px; padding:0px }

ol.timeline
{ list-style:none}ol.timeline li{ position:relative;border-bottom:1px #dedede dashed; padding:8px; }ol.timeline li:first-child{}

.morebox
{
font-weight:bold;
color:#333333;
text-align:center;
border:solid 1px #333333;
padding:8px;
margin-top:8px;
margin-bottom:8px;
-moz-border-radius: 6px;-webkit-border-radius: 6px;
}
.morebox a{ color:#333333; text-decoration:none}
.morebox a:hover{ color:#333333; text-decoration:none}
#container{margin-left:60px; width:580px }
	
	

body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  line-height: 1.5;
  position: relative;
  height: 100%;
  background: #ffffff;
}

#bgcolor{
    background-color: #f9f7ee;
    border: 1px solid #d3cebb;
    margin:2px;
}
#commentLine{
	
    position: relative;
}
#commentId{
   
   
}


.centered{
	position: fixed;
   top: 50%;
   left: 50%;
   width: 200px;
   height: 200px;
   margin-top: -100px; /* Half the height */
   margin-left: -100px; /* Half the width */
   visibility: hidden;
  opacity: 0;
}

.centeredShow { 
  visibility: visible;
  opacity: 1;
  -webkit-transition: opacity 0.3s linear;
  transition: opacity 0.3s linear;
}

.centeredHide { 
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity 1s linear;
  transition: opacity 1s linear;
}

.selection {
	cursor: pointer;
}


pre {
	overflow: none !important;
	background-color: transparent;
	border:0px solid;
}
/*
#comment{
    position: absolute;
	width: 250px;
    top:16px;
    left: 35px;
    z-index: 1;
}
#commentWrite{
    background: rgba(226,213,213,0.72);
    width: 100%;
}
*/