@charset "shift_jis";

/* --------------------------------- 
------------------------------------
editer-wrap
------------------------------------
------------------------------------*/
.left-box {
	float: left;
}
.middle-box {
	float: left;
}
.right-box {
	float: right;
}
/* ----- .utility-btn  ----- */
.utility-btn {
	position: relative;
	z-index: 10;
	display: none;
}
.utility-btn ul {
	position: absolute;
	left: -52px;
	top: 38px;
}
.utility-btn ul li {
	float: left;
	padding: 0 0 0 5px;
}

/*
---------------------------------------------------------
 .color-edit
--------------------------------------------------------- */
.color-edit {
    overflow: hidden;
    padding: 1px;
}
.color-edit li {
    width: 10%;
    height: 17px;
    overflow: hidden;
    text-indent: -9999px;
    float: left;
    cursor: pointer;
    box-shadow: 1px 1px 0px 0px #ccc, inset 1px 1px 0px 0px #ccc;
}
.color-edit li:hover {
	border: 1px solid #E7003C;
}
/*
---------------------------------------------------------
 .img
--------------------------------------------------------- */
.img-list {}
.img-list li {
	overflow: hidden;
	float: left;
	margin-right: 3px;
	margin-bottom: 3px;
	cursor: pointer;
}
/* ----- .design  ----- */
/*.font-list*/
.font-list {
  zoom: 1;
	padding-bottom: 8px;
}
.font-list:after {  
  content: ".";  
  display: block;  
  visibility: hidden;  
  height: 0.1px;  
  font-size: 0.1em;  
  line-height: 0;  
  clear: both;  
}
.font-list dt {
	float: left;
	font-size: 12px;
	font-weight: bold;
	padding-right: 10px;
	padding-top: 3px;
}
.font-list dd {
	float: left;
}
.font-list dd input#textfield {
	width: 220px;
}
.stack-list {}
.stack-list dt {
	font-size: 10px;
	text-align: center;
	padding-bottom: 2px;
}
.stack-list dd {
	position: relative;
}
.stack-list dd img.other {
	position: absolute;
	left: 0;
	top: 0;
	cursor: pointer;
}
.stack-list dd img.self {
	position: absolute;
	left: 12px;
	top: 5px;
	cursor: pointer;
}

/* scaling-list */
.scaling-list {
	clear: both;
	padding: 0 0 3px;
  zoom: 1;  
}
.scaling-list:after {  
  content: ".";  
  display: block;  
  visibility: hidden;  
  height: 0.1px;  
  font-size: 0.1em;  
  line-height: 0;  
  clear: both;  
}
.scaling-list dt {
	font-size: 10px;
	float: left;
	width: 30px;
}
.scale-bar {
	position: relative;
	background: url(../img/scale_bar_bg45.png);
	width: 45px;
	height: 4px;
	float: left;
	margin-top: 5px;
}
.scale-bar img.pointer {
	position:absolute;
	top: -3px;
	left: 0;
	cursor: pointer;
}

/* color-list */

.color-list {
  zoom: 1;  
}
.color-list:after {  
  content: ".";  
  display: block;  
  visibility: hidden;  
  height: 0.1px;  
  font-size: 0.1em;  
  line-height: 0;  
  clear: both;  
}
.color-list dt{
	float: left;
	width: 36px;
	font-size: 10px
}
.color-list dd{
	float: left;
	width: 30px;
	height: 15px;
	overflow: hidden;
	text-indent: -9999px;
	border: 1px solid #CCCCCC;
	cursor: pointer;
}
/*stack-list*/
.stack-list {}
/*.imgupload-list*/
.imgupload-list {}
.imgupload-list dt {
	font-size: 10px;
	float: left;
	padding: 3px 5px 0 0;
}
.imgupload-list dd {
	float: left;
}
.imgupload-list dd img {
	cursor: pointer;
}
/*.imgarea*/
.imgarea {
	width: 45px;
	height: 45px;
	background: #CCCCCC;
	margin: 0 15px 0 0;
}

/* --------------------------------------------------------
-----------------------------------------------------------
 design-btn-box
-----------------------------------------------------------
----------------------------------------------------------- */
.design-btn-box {
	margin: 0 0 10px;
}
.design-btn {
	overflow: hidden;/* clearfixの代用 */
	list-style: none;
	padding: 0;
}
.design-btn li {
    float: left;
    cursor: pointer;
    background-position: center center;
    background-repeat: no-repeat;
    width: 76px;
    height: 61px;
    border: 1px solid #bbb;
    background-color: #efefef;
    border-radius: 5px;
}
.design-btn li:hover {
	background-color: #d6ddef;	
}
.design-btn li + li {
	margin-left: 5px;
}
.design-btn li img {
	display: none;
}
/*
---------------------------------------------------------
 .editer-box.color
--------------------------------------------------------- */
.editer-box.color .item--color--color {
    width: 14px;
    height: 14px;
    border: 1px solid #ccc;
    display: inline-block;
    vertical-align: middle;
    background: #fff;
    margin-right: 5px;
}
.editer-box.color .item--color--name {
    padding: 2px 0;
    display: inline-block;
    vertical-align: middle;
    line-height: 1.3;
    max-width: 140px;
}
.editer-box.color .item--color--button {
    float: right;
    padding: 2px 0;
}

/*
---------------------------------------------------------
 .editer-box.item-edit
--------------------------------------------------------- */
.editer-box.item-edit {
    padding: 0;
    overflow: hidden;
}
.editer-box.item-edit table {
    width: 100%;
    table-layout: fixed;
    border-radius: 2px;
}
.editer-box.item-edit table tr + tr th,
.editer-box.item-edit table tr + tr td {
    border-top: 1px solid #ccc;
}
.editer-box.item-edit table th,
.editer-box.item-edit table td {
    padding: 8px;
    vertical-align: middle;
}
.editer-box.item-edit table th {
    width: 97px;
    background: #4e5f77;
    color: #FFF;
    font-weight: bold;
    font-size: 11px;
}
.editer-box.item-edit .item-color td .item-color-name {
    float: left;
    width: calc(100% - 5px - 48px);
    padding-top: 4px;
    position: relative;
    padding-left: 18px;
}
.editer-box.item-edit .item-color td .item-color-name .item--color--color {
    width: 14px;
    height: 14px;
    border: 1px solid #ccc;
    background: #fff;
    position: absolute;
    top: 4px;
    left: 0;
}
.editer-box.item-edit .item-color td .item-color-name .item--color--name {
    line-height: 1.3;
    font-size: 13px;
}

.editer-box.item-edit .item-color td .item--color--button {
    float: right;
    width: 48px;
    padding: 3px 0 3px 0.2em;
    font-size: 12px;
    text-align: center;
    border-radius: 4px;
    letter-spacing: 0.2em;
    background: #555;
    color: #FFF;
    cursor: pointer;
}
.editer-box.item-edit .item-color td .item--color--button:hover {
	opacity: 0.8;
}
.editer-box.item-edit .item-part select {
    width: 100%;
    font-size: 14px;
    padding: 4px;
}

/*
---------------------------------------------------------
 txt-wrap
--------------------------------------------------------- */
.txt-wrap .alpha-box {
	padding: 0 0 10px;
  zoom: 1;  
}
.txt-wrap .alpha-box:after {  
  content: ".";  
  display: block;  
  visibility: hidden;  
  height: 0.1px;  
  font-size: 0.1em;  
  line-height: 0;  
  clear: both;  
} 
.txt-wrap .alpha-box .color-list {
	padding-right: 17px;
	width: 35px;
}
.txt-wrap .alpha-box .color-list dt{
	float: none;
	text-align: center;
}
.txt-wrap .alpha-box .color-list dd{
	float: none;
	height: 20px;
}
.txt-wrap .alpha-box .middle-box {
	padding: 7px 0 0;
}
.txt-wrap .alpha-box .scaling-list dt {
	width: 40px;
}
.txt-wrap .alpha-box .scaling-list .scale-bar {
	background: url(../img/scale_bar_bg110.png);
	width: 110px;
}
.txt-wrap .alpha-box .right-box {
	padding-right: 10px;
}
.txt-wrap .beta-box,
.txt-wrap .gamma-box,
.txt-wrap .delta-box {
	width: 80px;
	padding: 5px;
	float: left;
	height: 97px;
}
.txt-wrap .beta-box {
	border-right: 1px solid #ccc;
	padding-left: 0;
}
.txt-wrap .gamma-box {
	border-right: 1px solid #ccc;
}
.txt-wrap .delta-box {
	padding-right: 0;
}
.txt-wrap .txt-title {
	text-align: center;
	font-weight: bold;
	padding: 0 0 5px;
	font-size: 12px;
}

.txt-wrap table,
.team-wrap table,
.color table {
    width  : 100%;
    margin : 0;
    padding: 0;
	border-collapse: collapse;
}
.txt-wrap table th,
.team-wrap table th,
.color table th  {
    margin : 0;
    padding: 2px 0px 2px 3px;
    font-weight: bold;
    text-align : left;
    font-size  : 11px;
    vertical-align: midle;
    width: 58px;
    border-bottom: 1px dotted #999999;
}
.color table th {
    width: 94px;
}
.txt-wrap table td,
.team-wrap table td,
.color table td  {
    margin : 0;
    padding: 5px 0px;
    font-weight: normal;
    text-align: left;
    font-size  : 11px;
    vertical-align: middle;
    border-bottom: 1px dotted #999999;
}
.txt-wrap table td img {
}
.txt-wrap .txt-edit-btn {
	padding-bottom: 5px;
}
.txt-wrap .font-edit-btn{
	float: left;
	padding: 2px 0 0 8px;
}
.font-img-wrap {
	width: 175px;
	display: block;
	/*border: 1px solid #7F9DB9;*/
	/*background: #fff;*/
	float: left;
}
.font-img-wrap img {
    margin-top: 3px;
	height: 13px;
}
.txt-wrap .scale-bar,
.team-wrap .scale-bar {
	background: url(../img/scale_bar_bg110.png);
	width: 110px;
}
.txt-wrap .btn-list,
.team-wrap .btn-list {

}
.txt-wrap .btn-list li ,
.team-wrap .btn-list li {
	float :left;
	padding: 0 3px 3px 0 ;
    cursor: pointer;
}
.txt-wrap .btn-list li.last ,
.team-wrap .btn-list li.last {
	padding-right: 0;
}

/* form--text--element--style
--------------------------------------------------------- */
.txt-wrap .btn-list.form--text--element--style li img {
    width: 26px;
}

/* form--text--element--style
--------------------------------------------------------- */
.txt-wrap .btn-list.form--text--element--type--list li img {
    width: 45px;
}

.popup-box.txt-wrap {
	background: #fff;
	border: 1px solid #ccc;
	width: 340px;
	/* -CSS3/ --------------------------------- */
  border-radius         : 5px;
  -moz-border-radius    : 5px;
  -webkit-border-radius : 5px;
  /* -/CSS3 --------------------------------- */
}
.popup-box.txt-wrap .box-content {
    padding: 0;
}
/*team-wrap*/
.team-wrap {}
.team-wrap .add-btn {
	padding-top: 5px;
	float: left;
	width :40%;
}
.team-wrap .detail-btn {
	padding-top: 8px;
	float: right;
	width :50%;
	text-align: right;
}
.curve-wrap {}
.outborder-inwrap {}
.outborder-inwrap .scaling-list dt {
	width: 0;
	overflow: hidden;
	text-indent: -999px;
}
.outborder-inwrap .scaling-list dd {
	background: url(../img/scale_bar_bg70.png);
	width: 70px;
}
.shadow-inwrap {}

/*imgupload-wrap*/
.imgupload-wrap {
    /*text-align: center;*/
}
.imgupload-wrap .middle-box {
	padding-top: 8px;
}
.imgupload-wrap .scale-bar {
	background: url(../img/scale_bar_bg70.png);
	width: 70px;
}
.imgupload-wrap .color-list {
	padding-right: 17px;
	width: 35px;
}
.imgupload-wrap .color-list dt{
	float: none;
	text-align: center;
}
.imgupload-wrap .color-list dd{
	float: none;
	height: 20px;
}
/*clip-wrap*/
.clip-wrap .middle-box {
	padding-top: 8px;
}
.clip-wrap .scale-bar {
	background: url(../img/scale_bar_bg70.png);
	width: 70px;
}
.clip-wrap .color-list {
	padding-right: 17px;
	width: 35px;
}
.clip-wrap .color-list dt{
	float: none;
	text-align: center;
}
.clip-wrap .color-list dd{
	float: none;
	height: 20px;
}
/*.clipart-select-wrap*/
.clipart-select-wrap {
}
.clipart-select-wrap .editer-box-arrow{
	left: 107px;
}
.clipart-select-wrap.editer-box .inbox-content{
	height: 270px;
	margin-left: -5px;
}
.intabpanel {}
/*.img-select-wrap*/
.img-select-wrap {
}
.img-select-wrap .editer-box-arrow {
	left: 193px;
}
/* .temp-select-wrap */
.temp-select-wrap {
}
.temp-select-wrap .inbox-title {
}
.temp-select-wrap .inbox-content {
	height: 270px;
	margin-left: -5px;
}
/* design-select-wrap */
.design-select-wrap {
}
.design-select-wrap .inbox-title {
}

.intabpanel .editer-box-arrow {
	left: 267px;
}
/* ----- .clip-popbox ----- */
.clip-popbox .folder-box dt:hover,
.clip-popbox .img-box dt:hover {
	background: #eee;
}
.clip-popbox .box-content {
	overflow-y: auto;
	height    : 460px;
}
.clip-popbox .folder-box {
	float: left;
	margin: 0 4px 10px 0;
	padding: 0;
	text-align: center;
}
.clip-popbox .folder-box dt {
	margin: 0 0 3px;
	padding: 0;
	width : 83px;
	height: 83px;
	/*border: 1px solid #ccc;*/
}
.clip-popbox .folder-box dd {
	margin: 0;
	padding: 0;
	font-size: 10px;
    width : 80px;
    height: 15px;
}
.clip-popbox .folder-box dt img {
	/*padding: 12px 0 0;*/

}
.clip-popbox .img-box {
	float: left;
	margin: 0 4px 10px 0;
	padding: 0;
	text-align: center;
}
.clip-popbox .img-box dt {
	margin: 0 0 3px;
	padding: 0;
	width : 83px;
	height: 83px;
	border: 1px solid #ccc;
}
.clip-popbox .img-box dd {
	margin: 0;
	padding: 0;
	font-size: 10px;
}
.clip-popbox .img-box dt img {
	/*width: 83px;*/
}
.clip-popbox .folder-box.last,
.clip-popbox .img-box.last {
	margin: 0;
	padding: 0;
}
.clip-popbox dl {
    cursor: pointer;
}
/* ----- .temp-popbox ----- */
.temp-popbox .folder-box dt:hover,
.temp-popbox .img-box dt:hover {
	background: #eee;
}
.temp-popbox .box-content {
	overflow-y: auto;
	height    : 460px;
}
.temp-popbox .folder-box {
	float: left;
	margin: 0 4px 10px 0;
	padding: 0;
	text-align: center;
}
.temp-popbox .folder-box dt {
	margin: 0 0 3px;
	padding: 0;
	width : 83px;
	height: 83px;
	/*border: 1px solid #ccc;*/
}
.temp-popbox .folder-box dd {
	margin: 0;
	padding: 0;
	font-size: 10px;
    width : 80px;
    height: 15px;
}
.temp-popbox .folder-box dt img {
	/*padding: 12px 0 0;*/

}
.temp-popbox .img-box {
	float: left;
	margin: 0 4px 10px 0;
	padding: 0;
	text-align: center;
}
.temp-popbox .img-box dt {
	margin: 0 0 3px;
	padding: 0;
	width : 83px;
	height: 83px;
	border: 1px solid #ccc;
}
.temp-popbox .img-box dd {
	margin: 0;
	padding: 0;
	font-size: 10px;
}
.temp-popbox .img-box dt img {
	/*width: 83px;*/
}
.temp-popbox .folder-box.last,
.temp-popbox .img-box.last {
	margin: 0;
	padding: 0;
}
.temp-popbox dl {
    cursor: pointer;
}
/* ----- .team-table ----- */

.team-table {
	width: 100%;
	border: 1px #E3E3E3 solid;
	border-collapse: collapse;
	border-spacing: 0;
	color: #666666;
}

table.team-table .size-line td {
    padding: 2px 5px;
    border: #E3E3E3 solid;
    border-width: 0 0 1px 1px;
    background: #F5F5F5;
    font-weight: bold;
    line-height: 120%;
    text-align: center;
    vertical-align: middle;
}
table.team-table td {
    padding: 2px;
    border: 1px #E3E3E3 solid;
    border-width: 0 0 1px 1px;
    text-align: center;
    vertical-align: middle;
}
table.team-table thead th {
    padding: 2px 5px;
    border: #E3E3E3 solid;
    border-width: 0 0 1px 1px;
    background: #F5F5F5;
    font-weight: bold;
    line-height: 120%;
    text-align: center;
    vertical-align: middle;
}
table.team-table td input {
    width: 90%;
}
table.team-table th.team-delete {
    width: 18px;
}
table.team-table th.team-size {
    width: 50px;
}
table.team-table th.team-name {
    width: 130px;
}
table.team-table th.team-number {
    width: 24px;
}
table.team-table td.team-number input {
    text-align: right;
}
div.team-table-box {
    max-height: 132px;
    overflow  : auto;
}
/* ----- .clip-thumbnail ----- */
.clip-thumbnail {
    position: absolute;
    top : 0px;
    left: 0px;
    z-index: 12000;
    padding: 8px;
    border : 1px solid #CCC;
    background-color: #FFF;
}
/* ----- .temp-thumbnail ----- */
.temp-thumbnail {
    position: absolute;
    top : 0px;
    left: 0px;
    z-index: 12000;
    padding: 8px;
    border : 1px solid #CCC;
    background-color: #FFF;
}
/* ----- .pop-clipcolor ----- */
.pop--clipcolor {
    position: absolute;
    top : 0px;
    left: 0px;
    z-index: 3001;
    padding: 8px;
    border : 1px solid #CCC;
    background-color: #FFF;
    width: 320px;
    /* -CSS3/ --------------------------------- */
    border-radius         : 4px;
    -moz-border-radius    : 4px;
    -webkit-border-radius : 4px;
	box-shadow: 0px 0px 10px 1px #999;
	-webkit-box-shadow: 0px 0px 10px 1px #999;
	-moz-box-shadow: 0px 0px 10px 1px #999;
	 behavior: url(./js/etc/PIE.htc);
    /* -/CSS3 --------------------------------- */
}
.pop--clipcolor span.editer-box-arrow {
    top: -20px;
}
.pop--clipcolor--bg {
    position: fixed;
    top : 0;
    left: 0;
    z-index: 3000;
    width : 100%;
    height: 100%;
    background-color: #000;
    filter:alpha(opacity=5);
    -moz-opacity: 0.05;
    opacity: 0.05;
}
.pop--clipcolor .color-edit li {
}
/* ----- .pop-itemcolor ----- */
.pop--itemcolor {
    position: absolute;
    top : 0px;
    left: 0px;
    z-index: 3001;
    padding: 8px;
    border : 1px solid #CCC;
    background-color: #FFF;
    width: 320px;
    /* -CSS3/ --------------------------------- */
    border-radius         : 4px;
    -moz-border-radius    : 4px;
    -webkit-border-radius : 4px;
	box-shadow: 0px 0px 10px 1px #999;
	-webkit-box-shadow: 0px 0px 10px 1px #999;
	-moz-box-shadow: 0px 0px 10px 1px #999;
	 behavior: url(./js/etc/PIE.htc);
    /* -/CSS3 --------------------------------- */
}
.pop--itemcolor span.editer-box-arrow {
    top: -20px;
}
.pop--itemcolor--bg {
    position: fixed;
    top : 0;
    left: 0;
    z-index: 3000;
    width : 100%;
    height: 100%;
    background-color: #000;
    filter:alpha(opacity=5);
    -moz-opacity: 0.05;
    opacity: 0.05;
}
/* ----- .pop-image ----- */
.pop--image {
    position: absolute;
    top : -9999px;
    left: -9999px;
    width  : 298px;
    z-index: 3001;
    padding: 10px;
    margin : 0;
}
.pop--image--bg {
    position: fixed;
    top : 0;
    left: 0;
    z-index: 3000;
    width : 100%;
    height: 100%;
    background-color: #000;

    filter:alpha(opacity=5);
    -moz-opacity: 0.05;
    opacity: 0.05;
}
/* ----- .pop-type ----- */
.pop--type {
    position: absolute;
    top : 0px;
    left: 0px;
    z-index: 3001;
    padding: 8px;
    border : 1px solid #CCC;
    background-color: #FFF;
    width: 300px;
    /* -CSS3/ --------------------------------- */
    border-radius         : 4px;
    -moz-border-radius    : 4px;
    -webkit-border-radius : 4px;
    /* -/CSS3 --------------------------------- */
}
.pop--type--bg {
    position: fixed;
    top : 0;
    left: 0;
    z-index: 3000;
    width : 100%;
    height: 100%;
    background-color: #000;
    filter:alpha(opacity=20);
    -moz-opacity: 0.2;
    opacity: 0.2;
}
/* ----- .pop-font ----- */
.pop--font {
    position: absolute;
    top : 0px;
    left: 0px;
    z-index: 3001;
    padding: 8px;
    border : 1px solid #CCC;
    background-color: #FFF;
    width: 320px;
    /* -CSS3/ --------------------------------- */
    border-radius         : 4px;
    -moz-border-radius    : 4px;
    -webkit-border-radius : 4px;
    /* -/CSS3 --------------------------------- */
}
.pop--font--bg {
    position: fixed;
    top : 0;
    left: 0;
    z-index: 3000;
    width : 100%;
    height: 100%;
    background-color: #000;
    filter:alpha(opacity=20);
    -moz-opacity: 0.2;
    opacity: 0.2;
}
.pop--font .group {
    text-align    : center;
    padding-bottom: 4px;
    padding-top   : 4px;
}
.pop--font .group.last {
}
.pop--font .item {
    border: 1px solid #ccc;
    float : left;
    cursor: pointer;
}
.pop--font .item.last {
    margin-left: 6px;
}
.pop--font .item:hover {
    background-color: #eee;
}
.pop--font .box-child {
    height    : 256px;
    overflow  : auto;
    overflow-y: scroll;
}
.pop--font.editer-box .img-box {
    width: 148px;
    margin: 0 6px 6px 0;
}
.pop--font.editer-box .img-box.last {
	margin-right: 0;
}
.pop--font.editer-box .img-box dt {
    padding-bottom: 24%;
}
.pop--font.editer-box .img-box dt img {
    max-height: calc(100% - 6px);
    margin: auto !important;
    width: auto !important;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    max-width: calc(100% - 6px);
}
/* ----- .pop-team ----- */
.pop--team {
    position: absolute;
    top : 0px;
    left: 0px;
    z-index: 2999;
    padding: 14px 8px;
    border : 1px solid #CCC;
    background-color: #FFF;
    width: 300px;
    /* -CSS3/ --------------------------------- */
    border-radius         : 4px;
    -moz-border-radius    : 4px;
    -webkit-border-radius : 4px;
    /* -/CSS3 --------------------------------- */
}
.pop--team--bg {
    position: fixed;
    top : 0;
    left: 0;
    z-index: 2998;
    width : 100%;
    height: 100%;
    background-color: #000;
    filter:alpha(opacity=20);
    -moz-opacity: 0.2;
    opacity: 0.2;
}
.pop--team .pop-team-close {
    text-align: right;
}
.pop--team div.box-menubutton ul {
    top: -7px;
}
/* ----- .save-design-popbox ----- */
.save-design-popbox table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
    margin: 0;
}
.save-design-popbox table th {
    margin : 0;
    padding: 0 8px 8px 0;
    text-align: left;
    font-weight: normal;
    vertical-align: top;
}
.save-design-popbox table td {
    margin : 0;
    padding: 0 0 8px 0;
    text-align: left;
    font-weight: normal;
    vertical-align: top;
}
.save-design-popbox input[type='text'] {
    width: 100%;
}
.save-design-popbox textarea {
    width: 100%;
    height: 96px;
}
.save-design-popbox .btm-btn {
    text-align: center;
    padding   : 8px 0 0;
}
/* ----- .cart-design-popbox ----- */
.cart-design-popbox table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
    margin: 0;
}
.cart-design-popbox table th {
    margin : 0;
    padding: 0 8px 8px 0;
    text-align: left;
    font-weight: normal;
    vertical-align: top;
}
.cart-design-popbox table td {
    margin : 0;
    padding: 0 0 8px 0;
    text-align: left;
    font-weight: normal;
    vertical-align: top;
}
.cart-design-popbox input {
    width: 100%;
}
.cart-design-popbox textarea {
    width: 100%;
    height: 96px;
}
.cart-design-popbox .btm-btn {
    text-align: center;
    padding   : 8px 0 0;
}
/* ----- .client-design-popbox ----- */
.client-design-popbox table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
    margin: 0;
}
.client-design-popbox table th {
    width  : 80px;
    margin : 0;
    padding: 2px 4px;
    text-align: left;
    font-weight: normal;
    vertical-align: top;
    font-size  : 10px;
}
.client-design-popbox table td {
    margin : 0;
    padding: 2px 4px;
    text-align: left;
    font-weight: normal;
    vertical-align: top;
}
.client-design-popbox table td.client-design-image {
    vertical-align: middle;
    text-align    : center;
    width : 256px;
    height: 256px;
    padding : 0 16px 0 0;
}
.client-design-popbox table td.client-design-thumb {
    vertical-align: top;
    text-align    : center;
    padding : 0 0 16px 0;
}
.client-design-popbox table td.client-design-thumb div {
    float  : left;
    border : 1px solid #ccc;
    margin : 0 0 0 4px;
    width  : 64px;
    height : 64px;
    background-color: #fff;
}
.client-design-popbox table td.client-design-thumb div:hover {
    background-color: #ffffcc;
}
.client-design-popbox div.pop--clipart--design--item {
    padding   : 0;
    max-height: 520px;
    overflow  : auto;
}
.client-design-popbox div.pop--client--design--item--item {
    position: relative;
    padding-bottom: 4px;
    padding-top   : 4px;
    border-bottom : #ccc solid 1px;
}
.client-design-popbox div.pop--client--design--item--item:hover {
    background-color: #eee;
}
.client-design-popbox div.pop--client--design--item--item.last {
    border-bottom : none;
}
.client-design-popbox table td.pop--client--design--item--memo {
    padding-bottom: 32px;
}
.client-design-popbox div.pop--client--design--item--button {
    position: absolute;
    right   : 12px;
    bottom  : 12px;
}
/* ----- .form--text--element--type ----- */
.form--text--element--type {
    cursor: pointer;
}
/* ----- .form--text--element--font ----- */
.form--text--element--font {
    /*cursor: pointer;*/
    /*border: 1px solid #ccc;*/
}
/* ----- .pop--client--design--item--item--empty ----- */
div.pop--client--design--item--item--empty {
    padding   : 12px;
    text-align: center;
}
/* ----- .cart-design-popbox ----- */
div.cart-design-popbox p {
    text-align: center;
    padding   : 0 0 16px;
}
/* ----- .form--text--element--text ----- */
input.form--text--element--text {
    width: 175px;
    font-size: 16px;
}
/* ----- .font-tab ----- */
div.font--tab {
}
div.font--tab div.box {
    float     : left;
    text-align: center;
    margin    : 1px;
    padding   : 4px 4px;
    cursor    : pointer;
    width     : 92px;
    border    : 1px solid #ccc;
    /* -CSS3/ --------------------------------- */
    border-radius         : 4px;
    -moz-border-radius    : 4px;
    -webkit-border-radius : 4px;
    /* -/CSS3 --------------------------------- */
}
div.font--tab div.box:hover {
    background-color: #eee;
}
div.font--tab div.box.selected {
    background-color: #eee;
}
div.pop--font .tabpanel .panel {
    padding-top: 10px;
}
/* ----- .box-pages ----- */
div.box-pages {
    position: relative;
    overflow: hidden;
}
div.box-pages ul {
    float   : left;
    left    : 50%;
    position: relative;
    padding : 0;
    margin  : 0 auto;
    list-style-type: circle;
    list-style-position: inside;
}
div.box-pages ul li {
    float  : left;
    text-indent: -9999px;
    left    : -50%;
    position: relative;
    width  : 16px;
    height : 16px;
    margin : 0 10px;
    padding: 0;
    cursor : pointer;
    border : 1px solid #ccc;
    /* -CSS3/ --------------------------------- */
    border-radius         : 9999px;
    -moz-border-radius    : 9999px;
    -webkit-border-radius : 9999px;
    /* -/CSS3 --------------------------------- */
}
div.box-pages ul li:hover {
    background-color: #ccc;
}
div.box-pages ul li.selected {
    border : 1px solid #D5347B;
    background-color: #D5347B;
}
/* ----- .box-menubutton ----- */
div.box-menubutton {
    position: relative;
}
div.box-menubutton ul {
    z-index: 10;
    position: absolute;
    top  :   0px;
    right:   0px;
    padding: 0;
    margin : 0;
    list-style-type: none;
}
div.box-menubutton ul li {
    float  : left;
    padding: 0 0 0 8px;
    margin : 0;
}
/* ----- .pop-text ----- */
.pop--text {
    position: absolute;
    top : 0px;
    left: 0px;
    z-index: 2999;
    padding: 14px 8px;
    border : 1px solid #CCC;
    background-color: #FFF;
    width: 300px;
    /* -CSS3/ --------------------------------- */
    border-radius         : 10px;
    -moz-border-radius    : 10px;
    -webkit-border-radius : 10px;
    /* -/CSS3 --------------------------------- */
}
.pop--text--bg {
    position: fixed;
    top : 0;
    left: 0;
    z-index: 2998;
    width : 100%;
    height: 100%;
    background-color: #000;
    filter:alpha(opacity=20);
    -moz-opacity: 0.2;
    opacity: 0.2;
}
.pop--text .pop-team-close {
    text-align: right;
}
.pop--text div.box-menubutton ul {
    top: -7px;
}
.pop--text textarea {
    margin: 0;
    width : 100%;
    height: 144px;
}
.pop--text div.pop--text--box--submit {
    text-align: center;
    padding: 16px 0 0; 
}
/* ----- .pop-help ----- */
.pop--help01,
.pop--help02,
.pop--help03 {
    position: absolute;
    top : 0px;
    left: 0px;
    z-index: 3001;
    padding: 10px 8px;
    border : 1px solid #CCC;
    background-color: #FFF;
    width: 300px;
    /* -CSS3/ --------------------------------- */
    border-radius         : 4px;
    -moz-border-radius    : 4px;
    -webkit-border-radius : 4px;
    /* -/CSS3 --------------------------------- */
}
.pop--help01--bg,
.pop--help02--bg,
.pop--help03--bg {
    position: fixed;
    top : 0;
    left: 0;
    z-index: 3000;
    width : 100%;
    height: 100%;
    background-color: #000;
    filter:alpha(opacity=20);
    -moz-opacity: 0.2;
    opacity: 0.2;
}
.pop--help01 span.color-sample-box {
    overflow : hidden;
    font-size: 1px;
    margin   : 0 2px 0 2px;
    padding  : 1px 14px;
    border   : 1px solid #999999;
    background-color: #ffe496;
}
.pop--help01 p,
.pop--help02 p,
.pop--help03 p {
    font-size: 11px;
    line-height: 2em;
    margin : 0;
    padding: 0;
}
.pop--help02 table {
    margin: 16px 0 0;
    width : 100%;
}
.pop--help02 table td.fst {
    padding: 0 16px 16px 0;
}
.pop--help02 table td.snd {
    vertical-align: top;
    font-size: 11px;
    padding  : 0 0;
}
.pop--help01 span.attention,
.pop--help02 span.attention,
.pop--help03 span.attention {
    color: #C8214C;
}
/* ----- .msg--attention ----- */
.msg--attention {
    margin   : 8px 0 0;
    font-size: 11px;
    color    : #C8214C;
    background-color: #fdd;
    padding  : 12px;
    /* -CSS3/ --------------------------------- */
    border-radius         : 4px;
    -moz-border-radius    : 4px;
    -webkit-border-radius : 4px;
    /* -/CSS3 --------------------------------- */
}
/* ----- .size-one ----- */
.size-one {
	font-size: 11px;
	font-weight: normal;
    padding-left: 12px;
}
.size-one .size--box--self {
	color: #C8214C;
	font-size  : 14px;
	font-weight: normal;
}
/* ----- .otherdesign-popbox ----- */
.otherdesign-popbox .img-box dt:hover {
	background: #eee;
}
.otherdesign-popbox .pop--otherdesign--item--item {
	overflow-y: auto;
	height    : 480px;
}
.otherdesign-popbox .img-box {
	float: left;
	margin: 0 4px 10px 0;
	padding: 0;
	text-align: center;
}
.otherdesign-popbox .img-box dt {
	margin : 0 0 3px;
	padding: 0;
	width : 128px;
	height: 128px;
	border: 1px solid #ccc;
}
.otherdesign-popbox .img-box dd {
	margin : 0;
	padding: 0;
	font-size: 10px;
    width : 128px;
    height: 16px;
    overflow: hidden;
}
.otherdesign-popbox .folder-box.last,
.otherdesign-popbox .img-box.last {
	margin: 0;
	padding: 0;
}
.otherdesign-popbox dl {
    cursor: pointer;
}


/* --------------------------------------------------------
-----------------------------------------------------------
 .tabpanel .panel .box.clipart
-----------------------------------------------------------
----------------------------------------------------------- */
.tabpanel .panel .box.clipart table,
.tabpanel .panel .box.clipart tbody,
.tabpanel .panel .box.clipart tr,
.tabpanel .panel .box.clipart th,
.tabpanel .panel .box.clipart td {
	display: block;
}
/* --------------------------------------------------------
-----------------------------------------------------------
 load-data-popbox / select-design-popbox
-----------------------------------------------------------
----------------------------------------------------------- */
.popup-box.load-data-popbox .box-title,
.popup-box.select-design-popbox .box-title {
    font-size: 16px;
    margin-bottom: 12px;
    padding-top: 3px;
}
.popup-box.load-data-popbox .box-menubutton ul .pop--act--close,
.popup-box.select-design-popbox .box-menubutton ul .pop--act--close {
    font-size: 22px;
    color: #ccc;
}
/*
---------------------------------------------------------
 load-data-popbox
--------------------------------------------------------- */


.popup-box.load-data-popbox .input-area {
	overflow: hidden;/* clearfixの代用 */
    margin-bottom: 12px;
}

.popup-box.load-data-popbox input.key-input-box {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 1px solid #ddd;
    padding: 8px 9px;
    font-size: 15px;
    width: 86%;
    float: left;
    min-height: 35px;
}
.popup-box.load-data-popbox .input-area .btn-wrap {
    float: right;
    width: 14%;
}

.popup-box.load-data-popbox .input-area .btn-wrap a {
    display: block;
    background-color: #555;
    color: #FFF;
    font-size: 15px;
    padding: 0 5px;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    line-height: 35px;
}
.popup-box.load-data-popbox .indent-text {
    text-indent: -1em;
    padding-left: 1em;
    display: block;
    color: #777;
}

/*
---------------------------------------------------------
 select-design-popbox
--------------------------------------------------------- */
.popup-box.select-design-popbox .inbox-content {
	overflow: hidden;/* clearfixの代用 */
}

.popup-box.select-design-popbox .inbox-content dl {
    float: left;
    display: table;
    table-layout: fixed;
    cursor: pointer;
    border: 1px solid #DDD;
    width: calc((100% - 31px) / 3);
    margin: 0 0 15px 15px;
}
.popup-box.select-design-popbox .inbox-content dl:nth-of-type(3n+1) {
    margin-left: 0;
    clear: both;
}
.popup-box.select-design-popbox .inbox-content dl:hover {
    opacity: 0.8;
}
.popup-box.select-design-popbox .inbox-content dt {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    padding: 10px;
}
.popup-box.select-design-popbox .inbox-content dt img {
    max-height: 100%;
}
.popup-box.select-design-popbox .inbox-content dd {
    display: none;
}

/* --------------------------------------------------------
-----------------------------------------------------------
 popup-box.view-key-popbox
-----------------------------------------------------------
----------------------------------------------------------- */
.popup-box.view-key-popbox {
}
.popup-box.view-key-popbox .box-content {
	padding: 0;
}
.popup-box.view-key-popbox .section-title {
    font-weight: bold;
    font-size: 13px;
    border-left: 3px solid;
    line-height: 1.2;
    padding: 2px 0 1px 5px;
    margin-bottom: 5px;
    color: #333;
}
.popup-box.view-key-popbox .main-area {
    margin-bottom: 10px;
}

/*
---------------------------------------------------------
 box-c-alpha
--------------------------------------------------------- */
.popup-box.view-key-popbox .box-c-alpha {
	width: 34%;
	float: left;
}
.popup-box.view-key-popbox .box-in-img {
    margin-bottom: 6px;
    position: relative;
    text-align: center;
}
/*
.view--key--thumb {
    width : 120px;
    height: 112px;
}
*/
.popup-box.view-key-popbox .box-in-img .view--key--thumb {
    height: 112px;
}
.popup-box.view-key-popbox .box-in-img .view--key--thumb img {
	margin: 0 !important;
}
.popup-box.view-key-popbox .box-in-img .sub-list {
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
}
.popup-box.view-key-popbox .box-in-img .sub-list div {
	display: inline-block;
	height:7px;
	width:7px;
	overflow: hidden;
	text-indent:-9999px;
	background:url(../img/sub_list.gif) no-repeat center center;
	margin: 3px;
	vertical-align: middle;
}
.popup-box.view-key-popbox .box-in-img .sub-list div.select {
	background:url(../img/sub_list_on.gif) no-repeat center center;
}
.popup-box.view-key-popbox .box-in-img .btn-prev,
.popup-box.view-key-popbox .box-in-img .btn-next {
	width:19px;
	height:26px;
	overflow: hidden;
	text-indent:-9999px;
	position:absolute;
	cursor:pointer;
	margin-top: -20px;
}
.popup-box.view-key-popbox .box-in-img .btn-prev {
	top: 50%;
	left: 0px;
	background: url(../img/view_key_prev.png) no-repeat left top;
}
.popup-box.view-key-popbox .box-in-img .btn-next {
	top: 50%;
	right: 0px;
	background: url(../img/view_key_next.png) no-repeat left top;
}
.popup-box.view-key-popbox .box-c-alpha .box-btn li a {
    display: block;
    text-align: center;
    text-decoration: none;
    border: 1px solid #c3c3c3;
    border-radius: 3px;
    line-height: 1.2;
    padding: 5px 3px;
    font-weight: bold;
    color: #333;
    font-size: 11px;
	
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #eeeeee 100%);
    background: -webkit-linear-gradient(top, #ffffff 0%,#eeeeee 100%);
    background: linear-gradient(to bottom, #ffffff 0%,#eeeeee 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 );
}

/*
---------------------------------------------------------
 box-c-beta
--------------------------------------------------------- */
.popup-box.view-key-popbox .box-c-beta {
	width: 63%;
	float: right;
}
.popup-box.view-key-popbox .box-c-beta .section-body .design-key-note {
    color: #e60012;
    font-weight: bold;
    margin-bottom: 8px;
    padding-top: 5px;
}
.popup-box.view-key-popbox .box-c-beta input[type="text"]{
    width: 100%;
    font-size: 13px;
    padding: 5px;
}

/*
---------------------------------------------------------
 mail-area
--------------------------------------------------------- */
.popup-box.view-key-popbox .mail-area {
    border: 1px solid #e8e8e8;
    padding: 8px;
    background: #f7f7f7;
	font-size: 11px;
}
.popup-box.view-key-popbox .mail-area .design-key-text,
.popup-box.view-key-popbox .mail-area .mail-body-sample {
    margin-bottom: 6px;
}
.popup-box.view-key-popbox .mail-area .design-key-mail-send input[type="text"],
.popup-box.view-key-popbox .mail-area .design-key-mail-send textarea {
    font-size: 12px;
    padding: 4px;
    width: 100%;
}
.popup-box.view-key-popbox .mail-area .design-key-mail-send .design-key-memo-input {
    margin-top: 8px;
}
.popup-box.view-key-popbox .mail-area .design-key-captcha-box {
    padding-top: 8px;
}
.popup-box.view-key-popbox .mail-area .design-key-captcha-box .captcha-img-wrap,
.popup-box.view-key-popbox .mail-area .design-key-captcha-box .design-key-mail-send-input {
    float: left;
}
.popup-box.view-key-popbox .mail-area .design-key-captcha-box .design-key-mail-send-input {
    margin-top: 4px;
    width: calc(100% - 168px);
}
.popup-box.view-key-popbox .mail-area .design-key-captcha-box .captcha-img-wrap {
    margin-left: 8px;
	width: 160px;
    min-height: 40px;
}
.popup-box.view-key-popbox .mail-area .design-key-mail-send .design-key-mail-send-btn {
    text-align: center;
    padding-top: 5px;
}
.popup-box.view-key-popbox .mail-area .design-key-mail-send .design-key-mail-send-btn a {
    display: inline-block;
    text-decoration: none;
    text-align: center;
    font-weight: bold;
    letter-spacing: 0.1em;
    color: #fff;
    background: #043173;
    border-radius: 3px;
    font-size: 12px;
    padding: 5px 20px;
}

/*
---------------------------------------------------------
 btm-btn
--------------------------------------------------------- */
.popup-box.view-key-popbox .btm-btn {
	padding-top: 10px;
}
.popup-box.view-key-popbox .btm-btn li {
	float: left;
	width: 49%;
}
.popup-box.view-key-popbox .btm-btn li + li {
	margin-left: 2%;
}
.popup-box.view-key-popbox .btm-btn a {
	display: block;
	text-align: center;
	text-decoration: none;
	background: #E4E4E4;
	padding: 2px 0;
	font-size: 9px;
    border-radius: 3px;
}