﻿@charset "UTF-8";

/* CSS Document */

/* --------------
MODULE IMPORT
-------------- */





/* ----------------------------------------------------------------------------------
common
---------------------------------------------------------------------------------- */



body {
	background: #fff url(../img/bg.jpg) repeat-x left top;
	margin : 0;
	padding : 0;
	text-align : center;
}

a:link { color: #79499A; text-decoration: none; }
a:visited { color: #79499A; text-decoration: none; }
a:hover { color: #F2942F; text-decoration: none; }
a:active {
	color: #79499A;
	text-align: left;
}

img {
	border: 0px;
	text-align: left;
}

/* ----li { list-style-type: none; display: block;}*/

body,td,div,li	{
	font-family: メイリオ,Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',"Osaka";
	color: #434343;
	line-height : 150%;
	font-size: 14px;
}

p {
	float: left;
	padding-top: 20px;
	padding-right: 1.1em;
	padding-bottom: 20px;
	padding-left: 1.1em;
}

/* ----------------------------------------------------------------------------------
header
---------------------------------------------------------------------------------- */

#header {/* ポータルトップのヘッダ */
    position: relative;
 	width : 992px;
	height: 74px;
    margin: 0px auto;
    padding: 0px;
}


#header2 {/* ポータルトップ下の階層ののヘッダ */
    position: relative;
 	width : 992px;
	height: 85px;
    margin: 0px auto;
    padding: 0px;
}

#legend_logo {
	position: absolute;
	right: 730px;
	top: 5px;
}

#logo {
	position: absolute;
	right: 40px;
	top: 15px;
}

#calendar {
	position: absolute;
	right: 171px;
	top: 11px;
}





/* ----------------------------------------------------------------------------------
contents
---------------------------------------------------------------------------------- */


// YouTubeの埋め込み
    function onYouTubeIframeAPIReady() {
        ytPlayer = new YT.Player(
            'player', // 埋め込む場所の指定
            {
                videoId: 'JN-bmtN9OjA', // YouTubeのID
                playerVars: {
                    loop: 1,//0:ループしない 1:ループする 1の場合playlist設定必須
                    playlist: 'n_h1g1HuPXU',//次に流すYoutubeのID
                    controls: 0,//コントローラー無し
                    autoplay: 1,//オートプレイ
                    showinfo: 0//動画タイトルなど表示しない
                },
                events: {
                    'onReady': onPlayerReady
                }
            }
        );
    }
//プレイ準備完了後
      function onPlayerReady(event) {
        event.target.playVideo();
        event.target.mute();
      }



#wrapper {
	background: url(../img/wrapper_bg.png) no-repeat left top;
 	width: 992px;
	text-align: left;
    margin: 0px auto;
    padding: 0px;
}

#wrapperInner {
	overflow: hidden;
 	width: 992px;
	text-align: left;
    margin: 0px;
    padding: 0px 0px 30px 0px;
	min-height: calc(100vh - 243px - 171px - 30px);
}




#topmain {
	width: 657px;
	height: 300px;
	margin: 0px 0px 0px 0px;
	padding: 0px;
	float: left;

}


#pickup {
width: 335px;
float: right;	

 margin: 0px 0px 0px 0px;
 padding: 0px 0px 0px 0px;
 background-color: #ffffff;
}

#pickup_new {


 margin: 5px 10px 0px 10px;


}

#login_bottom_box {
	
  width: 305px;
 margin: 67px 50px 0px 9px;
    padding:  0px auto;
	  height: 240px;
	  border-top:1px solid #bbbbbb;
	  border-right:1px solid #bbbbbb;
border-left:1px solid #bbbbbb;
 background-color: #ffffff;
}



#newsbox0/* ニュースボックス大きい */ {
  width: 950px;
       margin: 0px auto;
    padding:  0px auto;
	  height: 236px;
}

#newsbox {
  width: 440px;
       margin: 0px auto;
    padding:  0px auto;
	  height: 266px;
}


#newsbox2/* バナー追加後　変更修正のお知らせ外枠 */ {
  width: 640px;
       margin: 0px 0px 10px 0px;
    padding:  0px auto;
	  height: 249px;
}

#scrollbox2 {
  overflow: scroll;   /* スクロール表示 */

  height: 228px;
      margin: 0px auto;
    padding: 0px 15px 0px 15px;


}


#scrollbox {
  overflow: scroll;   /* スクロール表示 */

 
      margin: 0px auto;
    padding: 0px 15px 0px 15px;


}

#newsbox_tabu { /* タブの中のボックス */
   width: 640px;
       margin: 8px 0px 10px 0px;
    padding:  0px auto;
	  height: 266px;
}


#scrollbox_tabu {
  overflow: scroll;   /* タブの中スクロール表示 */

  height: 245px;
      margin: 0px auto;
    padding: 0px 0px 0px 0px;


}


#newsbox636 {
  width: 634px;
       margin: 8px 0px 10px 0px;
    padding:  0px auto;
	
	
}
#scrollbox {
  overflow: scroll;   /* スクロール表示 */


  height: 244px;
  margin: 0px auto;
  padding: 0px 15px 0px 15px;


}


#top_container2 {

 	width: 962px;

    margin: 0px;
    padding: 0px 15px 0px 15px;
}

#naka_container {

 	width: 962px;

    margin: 0px;
    padding: 0px 15px 0px 15px;
}

#leftbotton {
	width: 644px;

	margin: 0px 0px 0px 0px;
	padding: 0px;
	float: left;	
	
}
#leftArea {
	width: 645px;

	margin: 6px 0px 0px 0px;
	padding: 0px;
	float: left;	
	
}




#newsbox317 {
	float: right;	
  width: 305px;
       margin: 0px 4px 0px 4px;
    padding: 30px auto;
	  /*height: 523px;*/
	  border-right:1px solid #ccc;
border-bottom:1px solid #ccc;
border-left:1px solid #ccc;

}

#scrollbox317 {

  height: 583px;
  overflow: scroll;   /* スクロール表示 */


  margin: 0px auto;
  padding: 0px 10px 0px 10px;
  

}


#QA_yohaku {

	
  
  margin: 15px;
  padding: 0px;


}


.clearfix:after { /*floatの解除、ここがポイント*/
display:block;
clear:both;
height:0px;
visibility:hidden;
content:".";
}

.clearfix {
 min-height: 1px; /*IE6、7対策*/

}

* html .clearfix {
 height: 1px;
 /*\*//*/ /*MAC IE5.x対策*/
 height: auto;
 overflow: hidden;

    /**/

}

#under_container {

 	width: 962px;

    margin: 0px;
    padding: 0px 15px 0px 15px;
}










div.box0 {
background-color: #ffffff;


background-image:url(../../css/bg_murasaki.jpg);
width:968px; 
margin: 0px 0px 10px 0px; padding:0; border:0px solid #bbbbbb;

} 



div.box {
background-color: #ffffff;

width:947px; 
background-image:url(../../css/bg_murasaki.jpg);

margin: 0px 0px 0px 0px; padding:0; border:1px solid #bbbbbb;

} 




#boxInner {

    margin: 0px auto;
    padding: 0px 15px 0px 15px;
}


#mitumori {
	width:957px; 
    margin: 8px 0px 0px 0px;
    padding: 0px auto;
}

#kokyaku {
	width:957px; 
    margin: 8px 0px 0px 0px;
    padding: 0px auto;
}

#hanbai {
	width:957px; 
    margin: 8px 0px 0px 0px;
    padding: 0px auto;
}

#dokodemo {
	width:957px; 
    margin: 8px 0px 0px 0px;
    padding: 0px auto;
}

#ansin {
	width:957px; 
    margin: 8px 0px 0px 0px;
    padding: 0px auto;
}



.productLine {
	clear: both;
	margin: 0px 1.1em;
	padding: 0px;
	border-bottom: 1px dotted #ccc;
}


.productLine_murasaki {
	clear: both;
	margin: 0px ;
	padding: 0px;
	border-bottom: 2px dotted #79499A;
}




#pageTop {
    clear: both;
	width: 955px;
	text-align: right;
	margin: 0px auto;
	padding: 0px;
}


#pankuzuArea {
	text-align: left;
	font-size: 13px;
	padding: 8px;
	border-bottom: 1px solid #bbb;
}
#pickup-box {
	margin: 0px auto;
	padding: 5px 0 5px 0;
	border-bottom: 1px dotted #ccc;
}
#pickup-box:after{
	clear: both;
	display: block;
	content: "";
	}
.pickup-img {
	float: left;
	margin: 0px 5px 0px 0px;
	
}


.imgRight {
	float: right;
	margin: 0px 0px 0px 0px;
}

.imgLeft {
	float: left;
	margin: 0px 0px 20px 20px;
}

.imgcenter {
	float: center;
	margin: 0px 0px 20px 20px;
	text-align:center;
}



.news dl {
	margin: 0px;
	padding: 0px;
	text-align: left;
}

.news dt {
	clear: left;
    float: left;
    padding: 0px 0px 0px 0px;
	font-weight: bold;
	font-size: 100%;
}

.news dd {
	margin-left: 0;
    padding: 0px 0px 0px 7em;
	border-bottom: 1px dotted #ccc;
	font-size: 100%;
}
.news bold {
	clear: left;
    float: left;
	font-weight: bold;
}




.news2 dl {
	margin: 0px;
	padding: 0px 0px 0px 0px;
	text-align: left;
}

.news2 dt {
	clear: left;
    float: left;
	margin: 0px;
    padding: 0px 5px 0px 0em;
	font-weight: bold;
	font-size: 100%;
}

.news2 dd {
	margin-left: 0;
    padding: 0px 0px 0px 6em;
	border-bottom: 1px dotted #ccc;
	font-size: 100%;
}
.news2 bold {
	clear: left;
    float: left;
	font-weight: bold;
}


.shiyouhenkou dl {
	margin: 0px;
	padding: 0px;
	text-align: left;
}

.shiyouhenkou dt {
	clear: left;
    float: left;
    padding: 0px 0px 0px 0px;
	font-weight: bold;
	font-size: 100%;
}

.shiyouhenkou dd {
	margin-left: 0;
    padding: 0px 0px 0px 7em;
	border-bottom: 1px dotted #ccc;
	font-size: 100%;
}
.shiyouhenkou bold {
	clear: left;
    float: left;
	font-weight: bold;
}






.dotline {
	margin-left: 0;
    padding: 0px 0px 0px 0em;
	border-bottom: 1px dotted #ccc;
	font-size: 100%;
}

.QA {
  overflow: scroll;   /* スクロール表示 */
  width: 100px;
  height: 100px;
  background-color: red;
  
}

.page_top {
    position:fixed;
    bottom:5px;
    right:20px;
    padding:0px;

    font-size:15px;
    text-decoration:none;

}
.page_top:hover {
    background:#e74c3c;
}


.sinple_hyou{

border-collapse: collapse;
}
.sinple_hyou th{

padding: 6px;


color: #333;
background-color: #ccc;
border: 1px solid #b9b9b9;
text-align:center;

}
.sinple_hyou td{
padding: 6px;
background-color: #fff;
border: 1px solid #b9b9b9;
text-align:center;
}


.sinple_hyou_2{

border-collapse: collapse;
}
.sinple_hyou_2 th{

padding: 6px;
color: #333;
background-color: #ccc;
border: 1px solid #b9b9b9;
text-align:center;

}
.sinple_hyou_2 td{
padding: 6px;
background-color: #fff;
border: 1px solid #b9b9b9;
text-align:left;
}


.catalog_hyou{

border-collapse: collapse;
}
.catalog_hyou th{

padding: 6px;
color: #333;
background-color: #ccc;
border: 1px solid #b9b9b9;
text-align:center;

}
.catalog_hyou td{
	/*padding: 6px;*/
	background-color: #fff;
	border: 1px solid #ddd;
	text-align: left;
}


.sinple_hyou_s{

border-collapse: collapse;

}
.sinple_hyou_s th{
font-size:90%;
padding: 6px;
color: #333;
background-color: #ccc;
text-align:center;
border: 0px solid #b9b9b9;
}
.sinple_hyou_s td{
font-size:88%;	
padding: 2px;
margin:0px;
background-color: #fff;
text-align:center;
border: 1px solid #b9b9b9;

}



.sinple_hyou_kanseiyou{

border-collapse: collapse;
}
.sinple_hyou_kanseiyou th{

padding: 6px;


color: #333;
background-color: #fff;
border: 1px solid #b9b9b9;
text-align:center;
font-weight: normal;

}
.sinple_hyou_kanseiyou td{
padding: 6px;
background-color: #fff;
border: 1px solid #b9b9b9;
text-align:left;
}



.sinple_hyou_sen_nasi{

border-collapse: collapse;

}
.sinple_hyou_sen_nasi th{

padding: 6px;
color: #333;
background-color: #ccc;
text-align:center;
border: 0px solid #b9b9b9;
}
.sinple_hyou_sen_nasi td{
padding: 2px;
margin:0px;
background-color: #fff;
text-align:center;
border: 0px solid #b9b9b9;

}



.sinple_hyou_sen_nasi2{

border-collapse: collapse;

}
.sinple_hyou_sen_nasi2 th{
font-size:90%;
padding: 6px;
color: #333;
background-color: #ccc;
text-align:center;
border: 0px solid #b9b9b9;
}
.sinple_hyou_sen_nasi2 td{
font-size:88%;	
padding: 2px;
margin:0px;
background-color: #fff;
text-align:center;
border: 0px solid #b9b9b9;

}


.subTitle {
    clear: both;
	background-color: #F1EDFF;
    font-size: 16px;
	color: #79499A;
	margin: 0px auto;
    padding: 8px 9px 6px 9px;
	border-left: 5px solid #79499A;
	line-height: 100%;
}

.subTitle2 {
	clear: both;
	background: url(../../img/sub_title2_bg.gif) repeat-x left top;
    font-size: 16px;
    font-weight: bold;
	color: #79499A;
	margin: 0px 1.1em;
    padding: 9px 0px 5px 0px;
	border-bottom: 1px solid #ccc;
}

.productLine {
	clear: both;
	margin: 0px 1.1em;
	padding: 0px;
	border-bottom: 1px dotted #ccc;
}

.subTitle3 {
    clear: both;
    font-weight: bold;
	font-size: 16px;
	margin: 0px;
    padding: 1px 10px 1px 8px;
	border-left: 4px solid #79499A;
}


.pageTopBody {
	clear: both;
	text-align: right;
	font-size: 14px;
	margin: 0px auto;
	margin-bottom: 10px;
	padding: 0px 1.1em;
}

.blue {
	color: #0000ff;
}

.red {
	color: #F00;
}

.redS {
	font-size: 12px;
	color: #F00;
}

.redS_r {
	font-size: 12px;
	color: #F00;
	float:right;
}

.redS_l {
	font-size: 12px;
	color: #F00;
	float:left;
}

.mojiS {
	font-size: 12px;

}

.mojiS_r {
	font-size: 12px;
	float:right;
}

.mojiS_l {
	font-size: 12px;
	float:left;
}

.mojiS_c {
	font-size: 12px;
	text-align:center;
	
}

.mojiSS {
	font-size: 12px;
	background-color:#FCC;

}



.moji_B/* ボタン点滅-*/ {
    clear: both;

	font-weight: bold;
    font-size: 16px;
	color: #0060c2;
	margin: 0px auto;
    padding: 8px 9px 6px 9px;
	line-height: 100%;
}
 
.moji_BK {
    clear: both;

	font-weight: bold;
    font-size: 16px;
	color: #000000;
	margin: 0px auto;

}
 
  
 
 
.sagaru{
	position: relative;
	top: 10px;
}
 


/* タブ
---------------------------------------------------------------*/ 
 /* --- ボックス --- */
div.section {
width: 642px; /* ボックスの幅 */
font-size:100%; /* ボックスの文字サイズ */
color: #000000; /* ボックスの文字色 */

}

/* --- タブエリア --- */
div.section ul.tabs {
width: 100%; /* タブエリアの幅 */
margin: 0;
padding: 0;
list-style-type: none;
}
div.section ul.tabs li {
position: relative;
z-index: 1;
width: 21em; /* タブの幅 */
margin: 0px 5px -2px 0px; /* タブのマージン（上右下左） */
padding: 0px 0px 0px 0px;
background: url(../img/tab_gen2_left.gif) no-repeat left top; /* タブの背景（左） */
border-bottom-style: none;
text-align: left;
float: left;
}

/* --- リンクエリア --- */
div.section ul.tabs li a {
display: block;
position: relative; /* IE6用 */
margin: 0px 0px 1px -1px;
padding: 9px 0px 0px 4px; /* リンクエリアのパディング（上、左右、下） */
background: url(../img/tab_gen2_right.gif) no-repeat right top; /* タブの背景（右） */
outline: none; /* アウトライン（なし） */
text-decoration: none; /* テキストの下線（なし） */
}
/* --- ポイント時の設定 --- */
div.section ul.tabs li a:hover {
text-decoration: underline; /* テキストの下線（あり） */
}

/* --- アクティブなタブ --- */
div.section ul.tabs li.active {
z-index: 3;
background: url(../img/tab_act2_left.gif) no-repeat left top; /* アクティブタブの背景（左） */
font-weight: bold; /* 太字 */
font-size:110%; /* アクティブタブの文字サイズ */
}
div.section ul.tabs li.active a {
background: url(../img/tab_act2_right.gif) no-repeat right top; /* アクティブタブの背景（右） */
color: #000000; /* アクティブタブの文字色 */
}
/* --- ポイント時の設定 --- */
div.section ul.tabs li.active a:hover {
text-decoration: none; /* テキストの下線（なし） */
}

/* --- 本文領域 --- */
div.section div.topicArea {
position: relative;
z-index: 2;
height:21em; /* 本文領域の高さ */
overflow: auto; /* はみ出た場合はスクロールで表示 */
padding: 14px; /* 本文領域のパディング */
background-color: #ffffff; /* 本文領域の背景色 */
border: 1px #c0c0c0 solid; /* 本文領域の境界線 */
}
/* --- 段落 --- */
div.section div.topicArea p {
margin: 0 0 1em; /* 段落のマージン（上、左右、下） */
}

/* --- 本文領域内の各ボックス --- */
div.section div.topicArea div.topic {
padding-top: 1em; /* JavaScriptがオフの場合の設定 */
border-bottom: 1px #c0c0c0 solid; /* JavaScriptがオフの場合の設定 */
}

/* --- clearfix --- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;
}
 
/* ボタン点滅
---------------------------------------------------------------*/
 .blinking_no {
 
         opacity: 0;
		 position: relative;
		top: 6px;
 } 
 .blinking {
         -ms-animation: animation01 1s infinite;         /* Internet Explorer */ 
         -webkit-animation: animation01 1s infinite;             /* Google Chrome、Safari */
         -moz-animation: animation01 1s infinite;                /* firefox */
         -o-animation: animation01 1s infinite;          /* opera */
         animation: animation01 1s infinite;             /* ベンダープレフェックス無し */
         opacity: 0;
		 position: relative;
		top: 4px;
 }
 
 
  .pickup_blinking {
         -ms-animation: animation01 2s infinite;         /* Internet Explorer */ 
         -webkit-animation: animation01 2s infinite;             /* Google Chrome、Safari */
         -moz-animation: animation01 2s infinite;                /* firefox */
         -o-animation: animation01 2s infinite;          /* opera */
         animation: animation01 2s infinite;             /* ベンダープレフェックス無し */
         opacity: 0;
		 position: relative;
		top: 0px;
 }
 
   .pickup_blinking4 { /* 下に4pxずらして表示する場合 */
         -ms-animation: animation01 2s infinite;         /* Internet Explorer */ 
         -webkit-animation: animation01 2s infinite;             /* Google Chrome、Safari */
         -moz-animation: animation01 2s infinite;                /* firefox */
         -o-animation: animation01 2s infinite;          /* opera */
         animation: animation01 2s infinite;             /* ベンダープレフェックス無し */
         opacity: 0;
		 position: relative;
		top: 4px;
 }

 /* Internet Explorer */
 @-webkit-keyframes animation01 {
  0% {
         opacity: 0;
         }
  
  50% {
         opacity: 1;
         }
         
  100% {
         opacity: 0;
         }
 }       
 /* Google Chrome、Safari */
 @-webkit-keyframes animation01 {
  0% {
         opacity: 0;
         }
  
  50% {
         opacity: 1;
         }
         
  100% {
         opacity: 0;
         }
 }       
 /* firefox */
 @-webkit-keyframes animation01 {
  0% {
         opacity: 0;
         }
  
  50% {
         opacity: 1;
         }
         
  100% {
         opacity: 0;
         }
 }       
 /* opera */
 @-webkit-keyframes animation01 {
  0% {
         opacity: 0;
         }
  
  50% {
         opacity: 1;
         }
         
  100% {
         opacity: 0;
         }
 }       
 /* ベンダープレフェックス無し */
 @keyframes animation01 {
  0% {
         opacity: 0;
         }
  
  50% {
         opacity: 1;
         }
         
  100% {
         opacity: 0;
         }
 }       
 
/* ボタン点滅
---------------------------------------------------------------*/


#new {
	position: absolute;
	right: 980px;
	top: 2473px;
}

  

/* ----------------------------------------------------------------------------------
news
---------------------------------------------------------------------------------- */

.newsPhotoArea {
	overflow: hidden;
	margin: 0px auto;
	padding: 0px;
}

.imgRightNews {
	float: right;
	margin: 0px 0px 0px 20px;
}

#newsimg {	
	/*display: none;*/
}

/* ----------------------------------------------------------------------------------
footer
---------------------------------------------------------------------------------- */

#footer {
    clear: both;
	background: url(../img/footer_bg.jpg) repeat left top;
 	width : 100%;
	height: 200px;
	margin: 0px auto;
    padding: 18px 0px 0px 0px;
}

#footerArea {
	position: relative;
 	width : 955px;
	font-size: 11px;
	text-align: left;
	color: #000000;
	margin: 0px auto;
    padding: 0px;
}

#footerArea a:link { color: #fff; text-decoration: none; }
#footerArea a:visited { color: #fff; text-decoration: none; }
#footerArea a:hover { color: #F2942F; text-decoration: underline; }
#footerArea a:active { color: #fff; }


.band-keiai {
	width:calc(100% + 30px);
	margin:45px 0 0 -15px;
	background-color: #eee;
}
.band-other {
	width:calc(100% + 30px);
	margin:20px 0 0 -15px;
	background-color: #eee;
}
.band-title{
  position: relative;
  display: inline-block;
  line-height: 50px;
  width: 200px;
  padding: 0 1em;
  background-color: #ccf;
  font-size: 13px;
  text-decoration: none;
  -webkit-transition: .2s;
  transition: .2s;
}
.band-title::before {
  position: absolute;
  top: 0;
  right: -40px;
  content: '';
  width: 0;
  height: 0;
  border-color: transparent transparent transparent #ccf;
  border-style: solid;
  border-width: 0 0 50px 40px;
  -webkit-transition: .2s;
  transition: .2s;
}
.year-title{
  position: relative;
  display: inline-block;
  line-height: 50px;
  width: 200px;
  padding: 0 1em;
  background-color: #999;
  font-size: 13px;
  color: white;
  text-decoration: none;
  -webkit-transition: .2s;
  transition: .2s;
}
.year-title::before {
  position: absolute;
  top: 0;
  right: -40px;
  content: '';
  width: 0;
  height: 0;
  border-color: transparent transparent transparent #999;
  border-style: solid;
  border-width: 0 0 50px 40px;
  -webkit-transition: .2s;
  transition: .2s;
}
.hyou_keiai {
	width:98% !important;
	margin:40px 5px !important;;
	float:none !important;
}
.catalog_hyou {
	width:48%;
	margin:0 0 15px 12px;
	float:left;
}
.slinkitem {
	clear:both;
	padding-top:20px;
}
.logoimg {
}
.logobottom {
  margin: 0 auto;
  padding: 0;
  border: 0;
  height: 1px;
  width: 300px !important;
  background: #ccc;
  background-image: -webkit-linear-gradient(left, #eee, #999, #eee);
  background-image: -moz-linear-gradient(left, #eee, #999, #eee);
  background-image: -ms-linear-gradient(left, #eee, #999, #eee);
  background-image: -o-linear-gradient(left, #eee, #999, #eee);
}
.catalog_hyou tr td {
	text-align:center;
}
#searchlink {
	margin: 50px 0 30px 0;
	text-align: center;
}
#searchlink a {
	text-decoration: none;
}
#searchlink ul {
    padding:0;
    margin-top:20px;
}
#searchlink ul li {
    display: inline;
    padding: 13px 18px;
	border: 1px solid #aaa;
	border-radius: 50px;
}
#searchlink li:hover {
	background-color: #eee;
	cursor:pointer;
}
.disableItem {
	background-color: #ddd !important;
	color:#bbb !important;
}
.disableItem:hover {
	background-color: #ddd !important;
	cursor:default !important;
}
#line-short {
	margin-left: 0;
	text-align:left;
	width:35px;
	border-width: 1px 0 0 0;
	margin-top:0;
	margin-bottom:15px;
}
#pdf-area {
	margin-top:15px;
	padding:0;
	overflow: scroll;
	overflow-x: hidden;
	height: 210px;
	width:100%;
}
#pdf-area p {
	margin:0 3px 0 0;
	width: 95px;
	height: 160px;
	text-align: center;
}
#pdf-area p.hor{
	width: 150px !important;

}
#pdf-area ul { 	
	margin:0;
}
#pdf-area ul li { 	
    display: inline;
}
#pdf-area img {
	border:1px solid #ccc;
}
span {
	display: inline-block;
}
.dateM {
	text-align: right;
	width: 2.8em;
}
.dateD {
	text-align: right;
	width: 5em;
	margin-right:8px;
}
p > img {
position: relative;
  top:0;
  left: 0;  
  display: inline-block;
	box-shadow: 1px 1px 1px rgba(100,100,100,0.4);
	margin-bottom: 3px;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	-ms-transition: all 0.3s;
	transition: all 0.3s;
}
p > img:hover {
  top: -3px;
  left: -3px;
	display: inline-block;
	box-shadow: 4px 4px 2px rgba(200,200,200,0.4);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	-ms-transition: all 0.3s;
	transition: all 0.3s;
}