@charset "utf-8";

/* --------------------------------------------------------
-----------------------------------------------------------
 layout-design-box
-----------------------------------------------------------
----------------------------------------------------------- */
.layout-design-box dl dd .design1 {
	color: #FFF;
	background: #70D7D3;
	border-color: #70D7D3;
}

/* --------------------------------------------------------
-----------------------------------------------------------
 others
-----------------------------------------------------------
----------------------------------------------------------- */
body {
	background: #fff;
}
.Header {
	background-color: #f1f5fd;
    border-bottom: 3px solid #043173;
}
/*
.Shadow-element,
.editer-box,
.design-btn li {
    box-shadow: none;
}*/

/* --------------------------------------------------------
-----------------------------------------------------------
 editer-box
-----------------------------------------------------------
----------------------------------------------------------- */
.editer-box {
    background-color: #e7e7e7;
    border: none;
}
.editer-box a{
    background-color: #efbc03;
}
.editer-box .box-title,
.editer-box .inbox-title {
	background-color: #043173;
}
.editer-box.color .box-title-btn li .action--help01 {
    background-color: #ffd300;
}

/*
---------------------------------------------------------
 item-edit
--------------------------------------------------------- */
.editer-box.item-edit table th {
    background-color:#043173;
    color:#fff;
}
.editer-box.item-edit table tr + tr th,
.editer-box.item-edit table tr + tr td {
    border-color: #c5c5c5;
}
.editer-box.item-edit .item-color td .item--color--button {
	background-color: #fbc502;
}
/*
-----------------------------------------------------------
 intab
----------------------------------------------------------- */
.editer-box .intab {
    border-bottom:2px solid #042c66;
}
.editer-box .intab .inbox.selected {
	background: #042c66;
}

/* --------------------------------------------------------
-----------------------------------------------------------
 design-btn
-----------------------------------------------------------
----------------------------------------------------------- */
.btn-save-design a,
.btn-load-design a {
	background-color: #fbde27;
	border: 1px solid #e8cc89;
    color: #333;
}
/* --------------------------------------------------------
-----------------------------------------------------------
 price-wrap-box
-----------------------------------------------------------
----------------------------------------------------------- */
.price-wrap-box {
    background-color: #e7e7e7;
}
.price-wrap-box .btn-box li a.action--makekey{
	background-image: none;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ff7398+0,ff5280+100 */
	background: #fbdf2b; /* Old browsers */
	background: -moz-linear-gradient(top,  #fbdf2b 0%, #f3aa07 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  fbdf2b 0%,#f3aa07 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #fbdf2b 0%,#f3aa07 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7398', endColorstr='#ff5280',GradientType=0 ); /* IE6-9 */
    color: #fff;
    text-indent: inherit;
    padding: 8px 0;
    font-size: 15px;
    text-align: center;
    font-weight: bold;
    letter-spacing: 1px;
	box-shadow: inset 0 0 5px 0px rgba(0,0,0,0.05);
}
.price-wrap-box .btn-box li a.action--order{
	background-image: none;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ff7398+0,ff5280+100 */
	background: #ff7398; /* Old browsers */
	background: -moz-linear-gradient(top,  #ff7398 0%, #ff5280 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #ff7398 0%,#ff5280 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #ff7398 0%,#ff5280 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7398', endColorstr='#ff5280',GradientType=0 ); /* IE6-9 */
    color: #fff;
    text-indent: inherit;
    padding: 12px 0;
    font-size: 18px;
    text-align: center;
    font-weight: bold;
    letter-spacing: 1px;
}
.price-wrap-box .btn-box li a.action--makekey:hover,
.price-wrap-box .btn-box li a.action--order:hover{
    background-image: none;
    background-color: #f3aa07;
    color: #fff;
    text-decoration: none;
}

/* --------------------------------------------------------
-----------------------------------------------------------
 design-btn
-----------------------------------------------------------
----------------------------------------------------------- */
.design-btn li {
    background-color: #e7e7e7;
    border: none;
}
.design-btn li.add--element--type--text {
	background-image: url(./img/design_btn_txt.svg);
}
.design-btn li.add--element--type--clipart {
	background-image: url(./img/design_btn_clip.svg);
}
.design-btn li.add--element--type--image {
	background-image: url(./img/design_btn_pic.svg);
}
.design-btn li.add--element--type--designtemp {
	background-image: url(./img/design_btn_temp.svg);
}

/* --------------------------------------------------------
-----------------------------------------------------------
 design-btn
-----------------------------------------------------------
----------------------------------------------------------- */
.undo-btn ul li a {
    background-color: #e7e7e7;
    border: none;
}
.undo-btn ul li.btn-undo a {
	background-image: url(./img/icon_undo.svg);
}
.undo-btn ul li.btn-redo a {
	background-image: url(./img/icon_redo.svg);
}

/* --------------------------------------------------------
-----------------------------------------------------------
 zoom-btn
-----------------------------------------------------------
----------------------------------------------------------- */
.zoom-btn{
    top: 110px;
}
.zoom-btn ul li a{
	background-color:#e7e7e7;
}
.zoom-btn ul li.btn-zoomin a{
	background-image: url(./img/icon_zoom_in.svg);
}
.zoom-btn ul li.btn-zoomout a{
	background-image: url(./img/icon_zoom_out.svg);
}

/* --------------------------------------------------------
-----------------------------------------------------------
 popup-box
-----------------------------------------------------------
----------------------------------------------------------- */
.popup-box.load-data-popbox .input-area .btn-wrap a {
	background: #f3aa07 !important;
}

/* --------------------------------------------------------
-----------------------------------------------------------
 layout-design-box
-----------------------------------------------------------
----------------------------------------------------------- */
.layout-design-box{
	background-color:#fff;
}