@CHARSET "utf-8";

@import url(http://fonts.googleapis.com/css?family=Varela+Round);

body {
    color: #444444;
    font-family: 'Hiragino Kaku Gothic ProN', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Helvetica, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 14px;
    background: #FAFAFA;
}



ul, li {
    margin: 0;
    padding: 0;
    list-style: none;
}

a {
    color: #428BCA;
    text-decoration: none;
}

a:hover, a:focus {
    color: #2A6496;
}

h1 {
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);
    font-size: 28px;
    margin: 0;
}

h1 span {
    display: block;
    font-size: 11px;
}

h1 a {
    color: #434A54;
}

h3 {
    border-bottom: 2px solid #978E83;
    margin-bottom: 30px;
    font-size: 24px;
    padding: 2px 3px;
    font-weight: normal;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);
}

h4 {
    margin-bottom: 30px;
    font-size: 18px;
    /*text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);*/
    padding: 2px 3px;
    font-weight: normal;
    border-bottom: 1px solid #978E83; /*AAB2BD;*/
}

h5 {
    font-size: 14px;
    margin: 15px 0;
}

label {
    cursor: pointer;
}

.center {
    margin-left: auto;
    margin-right: auto;
}

.left {
    float: left;
}

.right {
    float: right;
}

.tc {
    text-align: center;
}

.tr {
    text-align: right;
}

.mt10 {
    margin-top: 10px;
}

.mt20 {
    margin-top: 20px;
}

.mt30 {
    margin-top: 30px;
}

.mb5 {
    margin-bottom: 5px;
}

.ml30 {
    margin-left: 30px;
}

.w80px {
    width: 80px;
    height: auto;
    vertical-align: top;
}

.w120px {
    width: 120px;
    height: auto;
    vertical-align: top;
}

.nowrap {
    white-space: nowrap;
}

.clear {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

.clearfix:after {
    content: '';
    display: table;
    clear: both;
}

.red {
    color: #DA4453;
}

input, button, textarea, select {
    font-family: 'Varela Round', 'Hiragino Kaku Gothic ProN', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Helvetica, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

input[type="text"], input[type="password"], textarea, select {
    background-color: #FFFFFF;
    background-image: none;
    border: 1px solid #CCCCCC;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    color: #555555;
    font-size: 14px;
    line-height: 1.42857;
    padding: 4px 10px;
    -webkit-transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
}

input[type="text"]:focus, input[type="password"]:focus, textarea:focus {
    border-color: #66AFE9;
    outline: 0 none;
}

textarea {
    width: 90%;
}

hr {
    margin: 30px 0;
    border: none;
    border-top: 1px solid #D3D3D3;
    border-bottom: 1px solid rgba(255, 255, 255, 0.7);
}

.w30 {
    width: 30%;
}

.w50 {
    width: 48%;
}

.w60 {
    width: 60%;
}

.w80 {
    width: 80%;
}

.w100 {
    width: 100%;
}



/* ----------------------------------------Content*/

#wrapper {
    margin: 0 auto;
    width: 980px;
}

#wrapper-sm {
    margin: 0 auto;
    width: 700px;
}

#header {
    padding: 5px;
}

/*
#sidebar {
	font-size:11pt;
	width:180px;
	background-color:#EEEEEE;
	padding:3px;
	position:relative;
	border-radius:5px;
	-webkit-border-radius:5px;
	padding:5px;
}
#sidebar ul{
	margin:10px 0;
	padding:0;
}
#sidebar li{
	display:block;
}
#sidebar a{
	display:block;
	padding:2px 10px;
}
#sidebar a:hover{
	background:#DDDDDD;
	text-decoration:none;
}
*/
#main_content {
    vartical-align: top;
}



.desc-colored {
    display: inline-block;
    background: #fee5ea;
    width: 30px;
    height: 16px;
    border: 1px solid #CCC;
    vertical-align: top;
    margin-right: 5px;
}

/*------------------------------------------ tab */

.tab {
    border-bottom: 2px solid #009688; /*rgba(0, 0, 0, 0.2);*/
    /*border-bottom:2px solid #1ABC9C;*/
}

.tab li {
    float: left;
}

.tab li a {
    background: #FFF;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-top: 1px solid rgba(0, 0, 0, 0.2);
    border-left: 1px solid rgba(0, 0, 0, 0.2);
    border-right: 1px solid rgba(0, 0, 0, 0.2);
    cursor: pointer;
    float: left;
    padding: 7px 20px;
    text-align: center;
    -webkit-transition: all 0.25s ease 0s;
    transition: all 0.25s ease 0s;
    margin-right: 2px;
    color: #666;
    font-size: 1.2em;
}

.tab li a:hover, .tab li a.current {
    background-color: #009688;
    border-color: #009688;
    color: #FFF;
}

* + html .tab li {
    margin-bottom: -15px;
}

/*------------------------------------------ Table */
table {
    border-collapse: collapse;
}

th {
    background-color: #F0EFEF; /*#DBDBDB; #656D78;*/
    padding: 5px 7px;
    /*color:#FFF;*/
    font-weight: normal;
    /*text-shadow: 0 1px 0 rgba(0, 0, 0, 0.3);*/
    border: solid 1px #CCC;
}

th.other {
    background-color: #FFE4B5;
    padding: 3px;
    border: solid 1px #a9a9a9;
}

td {
    padding: 5px 7px;
    border: solid 1px #CCC; /*#E6E9ED;*/
    background: #FFF;
}

td img {
    vertical-align: top;
}

td.today, td.thismonth {
    background: #ffff8d;
}
.full-width{
  width: 100%;
}
table.search {
  width: 100%;
    margin-bottom: 10px;
}

table.search th {
    width: 120px;
}

table.list {
    margin-bottom: 10px;
}

table.detail {
    margin-bottom: 10px;
}

table.detail th {
    white-space: nowrap;
}

table.categories {
    width: 100%;
    margin-bottom: 20px;
}

table.categories th.name {
    width: 20%;
}

table.categories th.icon {
    width: 20%;
}

table.categories th.mark {
    width: 20%;
}

table.categories th.parent {
    width: 20%;
}

table.categories th.del {
    width: 20%;
}

table.admins {
    width: 100%;
    margin-bottom: 20px;
    clear: both;
}

table.admins tr.colored td {
    background: #fee5ea;
}

table.admins th.id {
    width: 20%;
}

table.admins th.name {
    width: 20%;
}

table.admins th.email {
    width: 20%;
}

table.admins th.status {
    width: 20%;
}

table.admins th.del {
    width: 20%;
}

table.admins_m {
    width: 60%;
    margin-bottom: 20px;
}

table.category_pages {
    width: 100%;
    margin-bottom: 20px;
}

table.category_pages th.name {
    width: 20%;
}

table.category_pages th.title {
    width: 20%;
}

table.category_pages th.description {
    width: 20%;
}

table.category_pages th.status {
    width: 20%;
}

table.category_pages th.del {
    width: 20%;
}

table.edit {
    margin-bottom: 20px;
}

th .red {
    color: #FC6E51;
}

div.operation {
    display: inline-block;
    width: 50px;
    text-align: right;
    padding-right: 10px;
}

.color-pick {
    display: inline-block;
    width: 20%;
    padding: 5px 20px;
}

/*------------------------------------------ Paging */
div.paging {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 10pt;
}

div.paging div.left {
    float: left;
    width: 50%;
    text-align: left;
}

div.paging div.right {
    margin-left: 50%;
    text-align: right;
    margin-bottom: 10px;
}

div.paging div.end {
    clear: both;
    text-align: right;
}

div.paging .right b {
    display: inline-block;
    line-height: 1.42857;
    padding: 1px 6px;
}

div.paging .right li {
    display: inline-block;
    margin-left: 3px;
}

div.paging .right a {
    -moz-user-select: none;
    background-image: none;
    border: 1px solid rgba(0, 0, 0, 0);
    border-radius: 3px;
    -webkit-border-radius: 3px;
    cursor: pointer;
    display: inline-block;
    line-height: 1.42857;
    margin-bottom: 0;
    padding: 1px 6px;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    background-color: #FFFFFF;
    border-color: #CCCCCC;
    color: #333333;
}

div.paging .right a:focus, div.paging .right a:active:focus {
    outline: thin dotted;
    outline-offset: -2px;
}

div.paging .right a:hover, div.paging .right a:focus {

    text-decoration: none;
    background-color: #EBEBEB;
    border-color: #ADADAD;
    color: #333333;
}

/*-------------------------------------- Button */
/*button, input[type="submit"], input[type="button"]{ padding:3px 10px; cursor:pointer;}*/
button, input[type="submit"], input[type="button"], input[type="reset"], .btn {
    background-color: #009688;
    border-radius: 4px;
    color: #FFF;
    display: inline-block;
    padding: 5px 15px;
    /*width:180px;*/
    vertical-align: middle;
    border: none;
    text-align: center;
    cursor: pointer;
}

input[type="reset"], .btn-gray {
    background-color: #DDDDDD !important;
    color: #333 !important;
}

button:hover, input[type="submit"]:hover, input[type="button"]:hover, .btn:hover {
    text-decoration: none;
    color: #FFF;
    filter: alpha(opacity=70);
    -moz-opacity: 0.70;
    opacity: 0.70;
}

input[type="reset"]:hover, .btn-gray:hover {
    text-decoration: none;
    color: #333;
    filter: alpha(opacity=70);
    -moz-opacity: 0.70;
    opacity: 0.70;
}

.btn-sm {
    font-size: 0.9em;
    padding: 3px 10px;
}

.btn-lg {
    padding: 5px 10px;
    min-width: 180px;
}

.btn-xlg {
    padding: 18px 40px;
    font-size: 1.6em;
}

.btn-search {
    padding: 6px 10px;
    width: inherit;
}

.btn.btn-disabled {
    background: #bdc3c7;
}

.btn.btn-disabled:hover {
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
    cursor: default;
}

.btn-delete {
    background: #d9534f !important;
}

.btn-delete.btn-sm {
    padding: 3px 10px;
    background: #d9534f;
}

/*-------------------------------------- Label */
.label {
    background: none repeat scroll 0 0 #DA4453;
    color: #fff;
    display: inline-block;
    font-size: 11px;
    font-weight: normal;
    margin-left: 10px;
    margin-right: 3px;
    padding: 0 10px;
    vertical-align: middle;
}

.label-white {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #DA4453;
    color: #DA4453;
}

/* メッセージ表示 */
div.header_msg_base {
    margin-top: 10px;
    margin-bottom: 10px;
}

div.header_msg_error {
    border-left: 3px solid #DA4453;
    padding: 5px 20px;
    background: #F2838F;
    color: #FFF;
}

div.header_msg_valid {
    border-left: 3px solid #3C9773;
    padding: 5px 20px;
    background: #B9DF90;
    color: #4B9F76;
}

div.header_msg_warn {
    border-left: 3px solid #DA4453;
    padding: 5px 20px;
    background: #F2838F;
    color: #FFF;
}

/*
div.header_msg_warn{
    border-left: 3px solid #F6BB42;
    padding: 5px 20px;
	 background:#FFDD87;
}
*/
/* 青
div.header_msg_info{
    border-left: 3px solid #31708F;
    padding: 5px 20px;
	 background:#7CD1EF;
	 color:#FFF;
}
*/
div.header_msg_info {
    border-left: 3px solid #31708F;
    padding: 5px 20px;
    background: #B9DF90;
    color: #FFF;
}

div.h2msg {
    background-color: yellowgreen;
    padding: 3px;
    font-size: 11pt;
    margin-bottom: 10px;
}

/*-------------------------------------- Jmenu */
#jMenu {
    display: table;
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
    table-layout: fixed;
}

#jMenu li {
    display: table-cell;
    background-color: #F49D48; /*#4A89DC;*/
    margin: 0;
    list-style: none;
    text-align: center;
    border-left: 1px solid rgba(0, 0, 0, 0.1);
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

#jMenu li a {
    padding: 6px 15px;
    display: block;
    background-color: transparent;
    color: #fff;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
    text-transform: uppercase;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    cursor: pointer;
    font-size: 14px;
}

#jMenu li a:hover {
    background-color: #009688; /*#5D9CEC;*/
}

#jMenu li:hover > a {
    background-color: #009688; /*#5D9CEC;*/
}

#jMenu li ul {
    display: none;
    position: absolute;
    z-index: 9999;
    padding: 0;
    margin: 0;
    margin-top: -2px;
    list-style: none;
}

#jMenu li ul li {
    background-color: #F49D48; /*#4A89DC;*/
    display: block;
    /*border-bottom:1px solid rgba(0, 0, 0, 0.1);*/
    padding: 0;
    list-style: none;
    position: relative;
}

#jMenu li ul li a {
    text-transform: none;
    display: block;
    padding: 6px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

#jMenu li ul li a.isParent {
    background-color: #009688; /*#5D9CEC;*/
    /*border-bottom:1px solid rgba(0, 0, 0, 0.1);*/
}

#jMenu li ul li a:hover {
    background-color: #009688 /*#5D9CEC;*/
    /*border-bottom:1px solid #322f32;*/
}

/*-------------------------------------- News */
ul.news li {
    padding: 0 0 10px 0;
    border-bottom: 1px dotted #CCC;
    word-break: break-all;
}

ul.news h5 span {
    display: inline-block;
    width: 100px;
    font-weight: normal;
}

/*table#add_color tr#add th:nth-child(5) {*/
    /*display: none;*/
/*}*/

/*table#add_size tr#addSize th:nth-child(5) {*/
    /*display: none;*/
/*}*/

/*---商品管理、項目追加ボタン----*/
.clone-color ,
.cloneSize ,
.cloneImg ,
.tsuika {
	background-color: #009688;
	border-radius: 4px;
	color: #FFF;
	display: inline-block;
	padding: 5px 15px;
	/* width: 180px; */
	vertical-align: middle;
	border: none;
	text-align: center;
	cursor: pointer;
}

.mt-10{
  margin-top: 10px;
}
.delete_category_btn {
    background: none repeat scroll 0 0 #DA4453;
    color: #fff;
    display: inline-block;
    font-size: 11px;
    font-weight: normal;
    margin-left: 10px;
    margin-right: 3px;
    padding: 0 10px;
    vertical-align: middle;
    border-radius: 0;
}