@media screen and (min-width: 400px) {
  * { -webkit-text-size-adjust: none; }
}

body,
#contents,
#main,
#main_inner,
#header,
#header_inner,
#footer_inner,
#contents_inner,
#center,
#topic-path ul,
#library_display,
#photo-archive{
 width:100%;
  float:none;
  padding:0px;
margin-left:0px;
}

.simple-display #contents_inner,
body.simple-display #footer_inner,
.recent-actions{
width:auto;
margin-left:5px;
margin-right:5px;
}

#signin #contents,
#signup #contents{
max-width:500px;
margin:0px auto;
}

#header{
position:static;
overflow:hidden;
}

#footer{
 margin-top:10px; 
}

.simple-display #contents{
padding-bottom:15px;
padding-top:15px;
}

#listing-header{
margin-left:5px;
}

.sp-hidden{
display:none !important;
}

#library_display_inner{
padding-left:5px;
}

#right,
#mode_switcher,
#topic-path,
#site_id .toggle,
#site_id.hover .toggle,
#entry-edit,
#mv-edit,
.banner{
display:none !important;
}

#contents{
 padding-top:8px; 
}

#site_id_logo{
margin-left:10px;
}

#header_search,
#site_name{
  display:none;
}

#listing-content,
.content-description{
 margin:0px 5px 10px 5px !important;
}

.content .item-listing.listing-mode{
 margin:0px -5px 0px -5px !important; 
}

#main .item{
margin-right:0px;
}

.item .title {
 padding-right:5px; 
}

.item p.description{
font-size:14px;
}

.dynamicviewer-ajax{
 margin-bottom:10px; 
}

#main-visual{
margin-left:5px;
margin-right:4px;
background-size:100% auto !important;
}

#mv-desc{
 font-size:11px;
 box-sizing:border-box;
 -moz-box-sizing:border-box;
}

@media screen and (max-width: 480px) {
  #main-visual { height:110px; }
}

/******* navigation *********/

#navigation{
  display:none;
  width:auto;
  margin:0px;
  float:none;
font-size:14px;
border:0px;
}

#navigation .widget{ 
-moz-box-shadow:none;
-webkit-box-shadow:none;
box-shadow:none;
padding-top:0px;
background:none;
margin-bottom:0px;
padding:0px;
}

.widget select{
  margin:10px 5px 10px 5px;
}

.widget h3,
#navigation h2,
#folder-listing-headline{
padding:3px 0px 3px 10px;
font-size:12px;
background:#2e2e2e;
color:#fff;
text-shadow:none;
font-weight:normal;
-moz-box-shadow:0px 1px 0px rgba(255,255,255,0.1);
-webkit-box-shadow:0px 1px 0px rgba(255,255,255,0.1);
box-shadow:0px 1px 0px rgba(255,255,255,0.1);
border-bottom:1px solid #232323; 
border-top:1px solid #232323;
margin-bottom:0px;
}

#website #gnavi h2{
 display:none; 
}

#navigation .profile{
  margin:5px 10px 10px 10px;
padding:5px 0px 5px 0px;
}

#navigation #gnavi li{
border:none;
}
.profile a,
.profile .company{
  color:#e4e4e4;
  text-shadow:none;
}

#navigation .widget li{
 padding:0px; 
 margin:0px;
}

#navigation #gnavi li a.link,
#navigation .widget li a{
display:block;
background:none;
color:#e4e4e4;
text-shadow:none;
padding:12px 10px 9px 10px;
-moz-box-shadow:0px 1px 0px rgba(255,255,255,0.1);
-webkit-box-shadow:0px 1px 0px rgba(255,255,255,0.1);
box-shadow:0px 1px 0px rgba(255,255,255,0.1);
border-bottom:1px solid #232323; 
-webkit-tap-highlight-color: rgba(0,0,0,0); 
}

#navigation #gnavi li a.link:hover,
#navigation .widget li a:hover{
color:#fff;
text-shadow:0px -1px 0px #333;
background: #0072ff;
/*
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iIzAwNzJmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDM1ZDYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  #0072ff 1%, #0035d6 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#0072ff), color-stop(100%,#0035d6));
background: -webkit-linear-gradient(top,  #0072ff 1%,#0035d6 100%);
background: -o-linear-gradient(top,  #0072ff 1%,#0035d6 100%);
background: -ms-linear-gradient(top,  #0072ff 1%,#0035d6 100%);
background: linear-gradient(to bottom,  #0072ff 1%,#0035d6 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0072ff', endColorstr='#0035d6',GradientType=0 );
*/
box-shadow:0px 1px 0px #0035D6 inset;
}

#gnavi li a.folder{
 background:url(../images/icon.png) no-repeat 0px 30px; 
 background-position: -80px -576px;
 padding-right:15px; 
}

#gnavi li a.return,
#gnavi li.return-portal a{
 background:url(../images/icon.png) no-repeat 0px 30px; 
 background-position: -88px -514px;
 padding-right:25px;
}

#logout li a.link{
background:url(../images/icon.png) no-repeat 0px 30px; 
color:#e4e4e4;
text-shadow:none;
padding-top:12px;
background-position: -312px -120px !important;
padding-left:30px;
}

#gnavi .folder-list,
#gnavi .admin{
 display:none; 
}

.subNavi #smart-menu.stay a{
z-index:1013;
}

.content{
margin-left:5px;
}

.content p img{
max-width:280px;
height:auto;
}

#main h1{
font-size:18px;
padding:0px 0px 5px 0px;
}

.entry-body{
 padding:0px 0px 15px 0px; 
}

.content .entry-data ul li.entry_edit,
.content .entry-data ul li.entry_comment{
 display:none; 
}

#photo-archive {
padding:0px 10px 0px 10px;
}

#photo-archive .item{
margin-left:0px;
width:280px;
margin-bottom:20px;
}

.stay #admin-menu{
display:none;
}

#header .subNavi {
position:absolute;
top:11px;
right:12px;
}

#header .subNavi a{
 color:#fff; 
}

#header .subNavi .stay > a{
 color:#666; 
}

.subNavi {
display:block;
}

#smart-menu{
list-style-type:none;
margin-left:5px;
 border-radius:3px;
 border-bottom:1px solid rgba(255,255,255,0.2);
}

.subNavi #smart-menu a{
display:block;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjE1Ii8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(top,  rgba(255,255,255,0.1) 0%, rgba(0,0,0,0.15) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.1)), color-stop(100%,rgba(0,0,0,0.15)));
background: -webkit-linear-gradient(top,  rgba(255,255,255,0.1) 0%,rgba(0,0,0,0.15) 100%);
background: -o-linear-gradient(top,  rgba(255,255,255,0.1) 0%,rgba(0,0,0,0.15) 100%);
background: -ms-linear-gradient(top,  rgba(255,255,255,0.1) 0%,rgba(0,0,0,0.15) 100%);
background: linear-gradient(to bottom,  rgba(255,255,255,0.1) 0%,rgba(0,0,0,0.15) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1affffff', endColorstr='#26000000',GradientType=0 );
box-shadow:0px 0px 3px #999 inset;
-moz-box-shadow:0px 0px 3px rgba(0,0,0,0.3) inset;
-webkit-box-shadow:0px 0px 3px rgba(0,0,0,0.3) inset;
box-shadow:0px 0px 3px rgba(0,0,0,0.3) inset;
border:1px solid rgba(0,0,0,0.2);
border-radius:5px;
position:relative;
z-index:1000;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	width:45px;
	height:26px;
background:url(../images/icon.png) no-repeat 0px 30px; 
background-position: -308px -454px;
}

.subNavi #smart-menu a:hover{
 text-decoration:none; 
}

#smart-menu.stay > a{
background:#ffffff;
background:rgba(255,255,255,0.98);
padding:4px 7px 1px 7px;
-moz-box-shadow:none;
-webkit-box-shadow:none;
box-shadow:none;
border:1px solid #ccc;
border-bottom:none;
border-radius:5px 5px 0px 0px;
text-decoration:none;
text-shadow:none;
color:#666;
}

.subNavi a:hover{
  text-decoration:none !important;
}
/********* category-selector ************/
.category-selector{
font-size:11px;
}

/********* entry-navi ************/
#entry-navi{
 margin:10px -10px -2px -10px; 
}

#entry-navi .label{
  float:none;
  margin-bottom:5px;
}

#entry-navi a{
 display:block;
}

/********* recommend ************/
#case-assets ul,
#recommend ul{
font-size:14px;
 margin:-5px -10px 0px -10px !important; 
}

#main #recommend ul li,
#main #case-assets ul li{
font-size:14px;
float:none;
clear:both;
width:auto;
overflow:hidden;
border-bottom:1px dotted #ccc;
padding:4px 10px 10px 5px;
margin-bottom:5px;
}

#main #case-assets ul li{
padding-left:12px;
padding-top:6px;
}

#recommend li .date,
#case-assets li .date{
 margin-top:0px;
 margin-bottom:1px;
}

#recommend li .thumb,
#case-assets li .thumb{
  color:#f9f9f9;
  float:left;
  margin-right:10px;
  width:50px;
  height:50px;
  margin-bottom:0px;
}

#recommend li .thumb a,
#case-assets li .thumb a{
 font-size:10px;
 height:50px; 
 padding-left:0px !important;
}


#recommend li .thumb img,
#case-assets li .thumb img{
 width:50px;
 height:auto;
}

#entry-body{
 padding:0px 0px 10px 0px;
}

table{
width:auto;
font-size:14px;
margin-left:-8px;
margin-right:-8px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
	width:103%;
}

#entry-body tr{
    display: block;
    width:100% !important;
}

#entry-body th,
#entry-body td{
-webkit-text-size-adjust:none;
font-size:14px !important;
    width:100% !important;
    display: list-item;
    list-style-type:none;
    border: none !important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}


#case-listing .case-id,
#case-listing .status,
#case-listing .owner{
  display:none;
}

#case-listing .subject{
width:65%;
}

#case-listing .lastmodified{
width:35%;
}

/********** manage ********/
.toggle,
.icon_edit,
#entry_edit,
#entry-comment-count,
li.admin{
  display:none !important; 
}

/********* form **********/

#main label{
float:none;
}

#main .field-content{
width:100% !important;
}

.field-content{
margin-left:0px;
}

.field-content input[type="text"],
.field-content input[type="password"],
.field-content textarea{
width:100% !important;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box; 
    box-sizing: border-box;
}

#signin .description{
display:none;
}

.simple-display #contents_inner{
 font-size:14px; 
}

.simple-display .field{
 width:auto; 
 padding:5px 0px 10px 0px;
}

.simple-display .field-content{
margin-bottom:0px;
}

.simple-display form{
 padding:0px 10px 0px 10px; 
}

.simple-display #remember-me{
 width:auto; 
 padding:0px 0px 0px 0px;
}

.simple-display .description{
 margin:0px 0px 10px 0px;
}

#signin.simple-display .actions-bar{
 margin-left:0px; 
 padding-left:0px;
 margin-bottom:0px;
}

#signin.simple-display #sign-in-button{
   float:none;
  width:100%;
  margin-bottom:15px;
}

.simple-display .msg{
margin:0px 0px 10px 0px;  
}

#account-action {
 margin-left:0px;
 float:none;
}

.comment-content{
 font-size:14px; 
}

div#comments-open {
    padding-top: 10px;
}

div#comments-open-text{
width:auto;
float:none;
margin-right:10px;
}

#comments-open-text textarea{
width:100%;
height:80px;
font-size:14px;
box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
}
#comments-open-footer {
margin-right:10px;
}

#community-post .button,
#comment-submit{
font-size:14px;
width:100%;
padding:8px;
box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
}

#comment-submit{
margin-top:5px;
}

.dynamicviewer-ajax {
margin-top:20px;
}

.dynamicviewer-ajax button.loading{
  background:url(/common/images/ajax-loader.gif) no-repeat 100px 15px !important;
}

#asset-listing col.date{
 width:28%; 
}

#asset-listing table col.title{
 width:70%; 
}

th.tags,
td.tags{
 display:none;
}

#asset-listing table.display .thumbnail{
float:none;
}

#asset-listing table{
margin-left:-5px;
margin-right:-5px;
width:auto;
}

#asset-listing table td.date{
vertical-align:top;
}

#asset-listing .dataTables_info{
width:100%;
float:none;
text-align:left;
}

#asset-listing .dataTables_paginate{
  overflow:hidden;
width:100%;
float:none;
  padding-top:10px;
text-align:left;
}

.listing-mode .item-listing .odd{
 background:#fbfbfb !important; 
}

/************ sp width***************/

.sp-c5{
width:5% !important;
}

.sp-c10{
width:10% !important;
}

.sp-c15{
width:15% !important;
}

.sp-c20{
width:20% !important;
}
.sp-c25{
width:25% !important;
}

.sp-c30{
width:30% !important;
}

.sp-c35{
width:35% !important;
}

.sp-c40{
width:40% !important;
}

.sp-c45{
width:45% !important;
}

.c50{
width:50% !important;
}

.sp-c55{
width:55% !important;
}

.sp-c60{
width:60% !important;
}

.sp-c65{
width:65% !important;
}

.sp-c70{
width:70% !important;
}

.sp-c75{
width:75% !important;
}

.sp-c80{
width:80% !important;
}

.sp-c85{
width:85% !important;
}

.sp-c90{
width:85% !important;
}

.sp-c95{
width:85% !important;
}

/********* quote ************/
#quote-detail{
 font-size:14px;
 width:100%;
}

/********* profile *********/
#pass_verify-field.field,
#pass-field.field{
  margin-left:0px;
  padding-left:10px;
}

#customfield_author_self_introduction-field textarea{
height:100px;
}

/********* toc ***********/
@media screen and (max-width: 400px) {
	#toc {
		width:100%;
		border:none;
		margin-right:0px;
		float:none;
	}
	#toc-content{
	        margin-left: 0px;
	}
}
/**** community ****/

#community-post{
margin-left:5px;
margin-right:5px;
}

.entry-post #community-post{
margin-left:0px;
margin-right:0px;
position:absolute;
width:100%;
top:0px;
left:0px;
z-index:10000;
}

#community-post #file-upload-field{
   border-bottom: 1px solid #F2F2F2;
    margin: 25px 0 7px;
    padding: 7px 0;
}

#file-upload-field #asset-ui{
display:none;
}

#case-description-field{
height:150px;
}

#case-description-field textarea{
height:150px;
}

#case-description-field .hint{
display:none;
}

.entry-post #smart-menu{
    display:none;
}


.entry-post #listing-content{
display:none;
}

.entry-post #case-toggle{
background:none;
text-indent:auto;
}

.entry-post #case-toggle{
color:#fff;
text-shadow:none;
text-align:center;
 border-bottom:1px solid rgba(255,255,255,0.2);
display:block;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjE1Ii8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(top,  rgba(255,255,255,0.1) 0%, rgba(0,0,0,0.15) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.1)), color-stop(100%,rgba(0,0,0,0.15)));
background: -webkit-linear-gradient(top,  rgba(255,255,255,0.1) 0%,rgba(0,0,0,0.15) 100%);
background: -o-linear-gradient(top,  rgba(255,255,255,0.1) 0%,rgba(0,0,0,0.15) 100%);
background: -ms-linear-gradient(top,  rgba(255,255,255,0.1) 0%,rgba(0,0,0,0.15) 100%);
background: linear-gradient(to bottom,  rgba(255,255,255,0.1) 0%,rgba(0,0,0,0.15) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1affffff', endColorstr='#26000000',GradientType=0 );
box-shadow:0px 0px 3px #999 inset;
-moz-box-shadow:0px 0px 3px rgba(0,0,0,0.3) inset;
-webkit-box-shadow:0px 0px 3px rgba(0,0,0,0.3) inset;
box-shadow:0px 0px 3px rgba(0,0,0,0.3) inset;
border:1px solid rgba(0,0,0,0.2);
border-radius:5px;
	overflow:hidden;
	width:45px;
	height:26px;
line-height:120%;
top:-40px;
right:12px;
}

/********* Menu **********/
body.slide-enabled {
 overflow:hidden; 
}

body.slide-enabled #header{
position:absolute;
left:0px;
top:0px;
}

body.slide-enabled #footer{
position:absolute;
left:0px;
}

body.slide-enabled #contents{
padding-top:59px;
position:absolute;
left:0px;
}

body.slide-enabled #body{
 position:fixed;
 left:0px;
 top:0px;
 z-index:20000;
}

.slide-enabled #navigation{
width:260px;
}

#navigation{
position:absolute;
right:0px;
  top:0px;
z-index:1;
padding-bottom:0px;
    background-color: #333;
//    -webkit-box-shadow: inset 0 0 5px 5px #222;
//    -moz-shadow: inset 0 0 5px 5px #222;
//    box-shadow: inset 0 0 5px 5px #222;
}

#folder-listing,
#folder-listing ul{
width:260px;
}

#folder-listing .children{
left:260px;
}

#pageslide {
    /* These styles MUST be included. Do not change. */
    display: none;
    float:right;
    top: 0;
    height: 100%;
    z-index: 999999;
    
    /* Specify the width of your pageslide here */
    width: 260px;
    padding: 0px;
    
    /* These styles are optional, and describe how the pageslide will look */
    background-color: #333;
    color: #FFF;
    -webkit-box-shadow: inset 0 0 5px 5px #222;
    -moz-shadow: inset 0 0 5px 5px #222;
    box-shadow: inset 0 0 5px 5px #222;
}