body {
    margin: 0px;
    padding: 0px;
    font-family: Meiryo,Verdana,'游ゴシック体','Yu Gothic',YuGothic,'ヒラギノ角ゴ ProN','ＭＳ Ｐゴシック','Osaka',sans-serif;
}

.clearBoth {
    clear: both;
}

/* -------------------------------------------------------------------------------- */

#container {
    background: #edebec;
    width: 480px;
    height: 700px;
    position: relative;
    margin: 0px auto;
    overflow: hidden;
}

#headerContainer {
	background: #333333;
	border-bottom: 1px solid #cdd7df;
    width: 480px;
    height: 72px;
    text-align: center;
    display: none;
}

/* 
#editorContainer {
    width: 480px;
    height: 480px;
    border-top: 1px solid transparent;
    background: url(../images/itemID481_bundle.png);
    background-position: 0px -13px;
    background-size: contain;
} */
#editorContainer::before {
    content: "";
    position: absolute;
    width: 240px;
    height: 240px;
    top: 310px;
    left: 240px;
    background-color: #ededed;
    z-index: 1;
}
#editorContainer::after {
    content: "";
    position: absolute;
    width: 480px;
    height: 480px;
    top: 75px;
    border-top: 1px solid transparent;
    background: url(../images/itemID481_bundle.png);
    background-position: 0px -13px;
    background-size: contain;
    pointer-events: none;
    z-index: 100;
}

#commandContainer {
    width: 480px;
    height: 148px;
    text-align: center;
    display: none;
}

#bundleContainer {
    /* background: #ededed; */
    background: initial !important;
    width: 460px;
    height: 460px;
    /*border-radius: 69px;*/
    margin: 9.5px auto 0px auto;
    /*overflow: hidden;*/
    display: none;
}

#slideHorizonContainer {
    width: 480px;
    height: 630px;
    position: absolute;
    left: 0px;
    top: 72px;
    display: none;
}

/* -------------------------------------------------------------------------------- */

.slideHorizonDivs {
    width: 480px;
    position: absolute;
    left: 0px;
    top: 0px;
    display: none;
}

.blurOn {
    -webkit-filter: blur(30px);
    -ms-filter: blur(30px);
    filter: blur(30px);
}

.blurOn2 {
    opacity: 0;
}

/* -------------------------------------------------------------------------------- */

.designRow {
    width: 460px;
    height: 230px;
    display: table;
    table-layout: fixed;
}

.designCell {
    width: 180px;
    height: 180px;
    display: table-cell;
    table-layout: fixed;
    background: url('../commonImages/indexItemback.png');
    background-size: 180px 180px;
    background-position: 15px 15px;
    background-repeat:no-repeat;
}

.designItem {
    background-position: center center;
    width: 180px;
    height: 180px;
    /*border-radius: 115px;*/
    display: block;
    cursor: pointer;
    margin-top:15px;
    position:absolute;
}
.designItem.disable {
	opacity:0.3;
}
.flipInY {
    background-position-x: 26px !important;
    background-position-y: -14px !important;
    background-size: 160px 185px !important;
}

.emptyItem {
    background: url('../commonImages/indexEmptyItem.png');
    background-size: 180px 180px;
    /*background-position: 1px 3px;*/
    margin-left:15px;
}

.selectedItem {
    background: url('../commonImages/indexDesignHighlight.png');
    background-size: 212px 212px;
    background-position: 0px 0px;
    background-repeat:no-repeat;
    position:relative;
}

/* -------------------------------------------------------------------------------- */

.commandRow {
    width:480px;
    height:74px;
    /*width: 450px;
    height: 74px;
    margin: 0px auto;
    padding-left: 6px;*/
}

#countCommand{
	background: url('../commonImages/bn_3design.png');
}

#designCommand {
}

#bundleCommand {
}

.commandButton {
    height: 65px;
    float: left;
    cursor: pointer;
}

.setCountButtons{
    width: 115px;
    height: 50px;
    background-size: contain;
    background-repeat: no-repeat;
    float: left;
    margin-left: 4px;
    margin-top: 10px;
    display:none;
    
	/*width:106px;
	height:66px;
	background-size:contain;
	background-repeat:no-repeat;
	float:left;
	margin-left:4px;
	margin-top:10px;*/
/*	cursor:pointer;*/
}

.designCommandButton{
    width: 65px;
    margin-top: 6px;
    margin-right: 6px;
    background-size: contain;
    position:absolute;
    border-radius:30px;
}

.bundleCommandButton {
    width: 135px;
    margin-top: 3px;
    margin-right: 6px;
    
}

#designEditButton {
    top: 30%;
    /*background: url('../commonImages/indexDesignEdit.png');*/
}
#designEditButton.disable {
    background: url('../commonImages/indexDesignEdit_d.png');
}

#designCopyButton {
    top: 30%;
    left: 28%;
    /*background: url('../commonImages/indexDesignCopy.png');*/
}
#designCopyButton.disable {
    background: url('../commonImages/indexDesignCopy_d.png');
}

#designDeleteButton {
    top: 10%;
    left: 28%;
    /*background: url('../commonImages/indexDesignDelete.png');*/
}
#designDeleteButton.disable {
    background: url('../commonImages/indexDesignDelete_d.png');
}

#bundleMenuButton {
    background: url('../commonImages/saveThisDesign.png');
}
#bundleMenuButton.disable {
    background: url('../commonImages/saveThisDesign_d.png');
}

#bundleTytle{
    width: 280px;
    height: 66px;
    line-height: 66px;
    text-align: center;
    left: 100px;
    top: 0px;
    position: absolute;
    font-size: 15px;
    font-weight: bold;
    color:#333333;
}
#bundleTytle::before {
    content: "デザイン面を選択して下さい";
    position: absolute;
    left: 0px;
    top: 5px;
    width: 280px;
    height: 66px;
    color: white;
}

#bundleCartButton {
    width:359px;
    height:59px;
	position:absolute;
    top:90%;
    left:60px;
    background: url('../commonImages/cart.png');
}
#bundleCartButton.disable {
    background: url('../commonImages/buyThisItem_d.png')!important;
}

/* -------------------------------------------------------------------------------- */

#createSaveContainer {
    background: rgba(0, 0, 0, 0.2);
    height: 100%;
    overflow-x: hidden;
    overflow-y: scroll;
    padding-top:10px;
}

#closeSaveMenu {
    width:135px;
	height:66px;
    left:-1px;
    top:3px;
	background-image:url("../commonImages/closeSaveDialog.png");
    position: absolute;
    cursor: pointer;
    display:none;
}

.saveMenuTitles, .saveMenuCommands {
    width: 410px;
    height: 50px;
    margin-left: 35px;
}

.saveMenuTitles {
    color: #ffffff;
    line-height: 50px;
    text-align: center;
}

.saveMenuCommands {
    margin-bottom: 8px;
    cursor: pointer;
}

#backToHome{
    margin-top:20px;
}
#readDesignDiv {
    display: none;
}

#readDesignInput, #readDesignButton {
    float: left;
}

#readDesignInput {
    width: 300px;
    height: 48px;
    font-size: 25px;
    line-height: 48px;
    border: none;
    margin-right: -20px;
    padding-left: 10px;
    outline: 0;
    float: left;
}

#readDesignButton {
    width: 100px;
    height: 50px;
    float: right;
    cursor: pointer;
}

.shareBySomething {
    width: 66px;
    height: 66px;
    float: left;
    margin-left: 25px;
}

#shareMenusContainer {
	display: none;
	clear: both;
}

#stockBundlesContainer {
    clear: both;
}

#stockBundles {
    width: 480px;
}

/* -------------------------------------------------------------------------------- */

#confirmDialogContainer, #alertDialogContainer {
    background: rgba(0, 0, 0, 0.2);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    display: none;
}

#confirmDialog, #alertDialog {
    background: #ffffff;
    width: 216px;
    height: 120px;
    position: relative;
    left: 120px;
    top: 150px;
    border: 2px solid #edebec;
    border-radius: 10px;
    padding: 10px;
}

.confirmButtons {
    width: 70px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    position: absolute;
    top: 90px;
    border: 2px solid #edebec;
    cursor: pointer;
}

#confirmYes {
    left: 28px;
}

#confirmNo {
    left: 135px;
}

#alertOK {
    left: 81.5px;
}

/* -------------------------------------------------------------------------------- */

#loadingImageBack {
    background: rgba(0, 0, 0, 0.6);
    color: white;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
    padding-top: 300px;
    display: none;
    z-index: 100;
}

#loadingImageBack img {
    margin-left: 216px;
}

#loadingImageBackMessage {
    text-align: center;
}

#saveDesignDialogContainer{
    background:rgba(0,0,0,0.6);
    width: 480px;
    height: 694px;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 3;
    display: none;
}
#saveDesignDialog{
    width: 464px;
    height: 565px;
    position: absolute;
    top: 74px;
    left: 8px;
    background-image: url("../commonImages/saveBundle.png");
}
#saveDesignID{
    position: absolute;
    top: 203px;
    left: 57px;
    width: 320px;
    height: 288px;
    font-size: 42px;
    text-align: center;
    resize: none;
    border: 3px solid black;
    padding: 10px;
    font-family:Arial;
}
#closeSaveDesignDialog{
    width: 66px;
    height: 66px;
    position: absolute;
    top: 0px;
    right: 0px;
    background: #333333;
    background-image: url("../commonImages/cancelThisItem.png");
    background-position: 50% 0%;
    cursor:pointer;
}

/* -------------------------------------------------------------------------------- */

::-webkit-input-placeholder {
    text-align: center;
    font-size: 20px;
    font-weight: bold;
}

:-moz-placeholder {
    text-align: center;
    font-size: 20px;
    font-weight: bold;
}

::-moz-placeholder {
    text-align: center;
    font-size: 20px;
    font-weight: bold;
}

:-ms-input-placeholder {
    text-align: center;
    font-size: 20px;
    font-weight: bold;
}