@charset "utf-8";

/**********************************************************
	Insane Sheet Style : Sample Code
-----------------------------------------------------------
	Made by. Rout (Avocado / Tateck)
**********************************************************/

.sheet-wrap * {transition:none !important; -webkit-transition:none !important;}
.sheet-wrap input[type="text"],
.sheet-wrap input[type="number"],
.sheet-wrap select {display:block; width:100%;}
.sheet-wrap input[type="number"] {height:30px; text-align:center;}
.sheet-wrap input[type="number"]::-webkit-outer-spin-button,
.sheet-wrap input[type="number"]::-webkit-inner-spin-button {-webkit-appearance: none; margin:0;}

.sheet-wrap input[type="checkbox"] {display:none;}
.sheet-wrap input[type="checkbox"] + * {position:relative;}
.sheet-wrap input[type="checkbox"] + *:before {content:"✔"; margin-right:.2em; opacity:.3;}
.sheet-wrap input[type="checkbox"]:checked + * {font-weight:800;}
.sheet-wrap input[type="checkbox"]:checked + *:before {opacity:1;}


.sheet-state-box {overflow:hidden; padding:.5em 0;}
.sheet-state-box .sheet-ins {width:45%; float:left;}
.sheet-state-box .sheet-ins .sheet-frame {width:33.33%; float:left; padding:5px; box-sizing:border-box;}
.sheet-state-box .sheet-ins .sheet-frame strong {display:block; clear:both; text-align:center;}
.sheet-state-box .sheet-ins .sheet-frame input[type="number"],
.sheet-state-box .sheet-ins .sheet-frame input[type="text"]{display:block; vertical-align:middle; width:38%; float:left; text-align:center; background:transparent; border-width:0; border-bottom-width:1px; color:unset; border-radius:0;}
.sheet-state-box .sheet-ins .sheet-frame .dash {display:block; width:15%; text-align:center; line-height:30px; float:left;}
.sheet-state-box .sheet-ins .sheet-frame.wide input[type="number"],
.sheet-state-box .sheet-ins .sheet-frame.wide input[type="text"] {width:100%; float:none;}
.sheet-state-box .sheet-ins .sheet-checkbox {display:block; clear:both; padding-top:.5em;}
.sheet-state-box .sheet-ins .sheet-checkbox label {display:inline-block; vertical-align:middle; margin-right:.5em;}

.sheet-state-box .sheet-backs {width:49%; float:right;}
.sheet-title-content {display:table; width:100%; table-layout:fixed;}
.sheet-title-content + .sheet-title-content {margin-top:.3em;}
.sheet-title-content > * {display:table-cell; vertical-align:middle;}
.sheet-title-content > strong {width:70px;}
.sheet-title-content select,
.sheet-title-content input[type="text"] {border-radius:0; border-width:0; border-bottom-width:1px; color:unset; background-color:transparent;}

@media all and (max-width:800px) {
	.sheet-state-box > * {width:auto !important; float:none !important; overflow:hidden;}
	.sheet-state-box > * + * {padding-top:1em; margin-top:1em; border-top:1px solid rgba(0,0,0,.2);}
}


.sheet-spec-table {clear:both; padding:1em 0;}
.sheet-spec-table table {table-layout:fixed;}
.sheet-spec-table table th {text-align:center;}
.sheet-spec-table table td {padding:0;}
.sheet-spec-table table td label {display:block; padding:.2em 0 .2em 1em;}

@media all and (max-width:520px) {
	.sheet-spec-table {overflow:auto;}
	.sheet-spec-table table {width:550px;}
}


/* 갭 처리 */
.sheet-ins-style-Z {display:none;}
.sheet-element-to-determine-style-A:not([value='1']) ~ div .sheet-ins-style-A {background:transparent; border-color:transparent;}
.sheet-element-to-determine-style-B:not([value='1']) ~ div .sheet-ins-style-B {background:transparent; border-color:transparent;}
.sheet-element-to-determine-style-C:not([value='1']) ~ div .sheet-ins-style-C {background:transparent; border-color:transparent;}
.sheet-element-to-determine-style-D:not([value='1']) ~ div .sheet-ins-style-D {background:transparent; border-color:transparent;}
.sheet-element-to-determine-style-E:not([value='1']) ~ div .sheet-ins-style-E {background:transparent; border-color:transparent;}


.sheet-repeat-data {overflow:hidden; padding-top:1em;}
.sheet-repeat-data .sheet-abill {width:55%; float:left;}
.sheet-repeat-data .sheet-relation {width:43%; float:right;}
.sheet-repeat-data .sheet-title {display:block; font-size:1.1em; font-weight:800;}

.sheet-list {display:block; border-top:1px solid rgba(0,0,0,.7); margin-top:10px; padding:10px 0 0 0;}

.sheet-ab-item {display:block; position:relative; padding-left:25px; margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid rgba(0,0,0,.1); overflow:hidden;}
.sheet-ab-item input[type="text"],
.sheet-ab-item input[type="number"] {padding:0 10px;}
.sheet-ab-item input[type="text"],
.sheet-ab-item input[type="number"],
.sheet-ab-item select {border-radius:5px; height:30px;}
.sheet-ab-item input[type="text"],
.sheet-ab-item input[type="number"],
.sheet-ab-item select,
.sheet-ab-item textarea {display:block; width:100%;}
.sheet-ab-item > * {display:block; float:left;}
.sheet-ab-item .sheet-check-flag,
.sheet-ab-item .sheet-check-flag-visual {display:block !important; position:absolute !important; width:25px; height:25px !important; top:0; left:0; background:url('./img/ico_flag_open.png') no-repeat 50% 50%; float:none;}
.sheet-ab-item .sheet-check-flag {z-index:5; opacity:0;}
.sheet-ab-item .sheet-check-flag-visual:before {display:none !important;}
.sheet-ab-item input:checked + .sheet-check-flag-visual {background-image:url('./img/ico_flag_close.png');}
.sheet-ab-item .sheet-ab-control {width:30px;}
.sheet-ab-item .sheet-ab-name {width:60%;}
.sheet-ab-item .sheet-ab-type {padding:0 5px; width:20%; box-sizing:border-box;}
.sheet-ab-item .sheet-ab-spec {width:20%;}
.sheet-ab-item .sheet-ab-spec input {text-align:center !important;}
.sheet-ab-item .sheet-ab-emotion {width:20%;}

.sheet-ab-item .sheet-ab-option {padding:0 5px; width:20%; box-sizing:border-box;}
.sheet-ab-item .sheet-ab-option .sheet-txt-check {display:block; position:relative;}
.sheet-ab-item .sheet-ab-option .sheet-txt-check span {display:block; height:30px; text-align:center; opacity:.5; background:Rgba(0,0,0,.2); line-height:30px; border-radius:5px;}
.sheet-ab-item .sheet-ab-option input {display:block !important; position:absolute; top:0; left:0; right:0; bottom:0; width:100%; height:100%; z-index:2; opacity:0;}
.sheet-ab-item .sheet-ab-option input:checked + span {opacity:1; background:#b13a3a; color:#fff;}

.sheet-ab-item .sheet-ab-effect {display:none; width:100%; clear:both; padding-top:10px; height:100px; border-left:1px solid rgba(0,0,0,.1); padding-left:10px; box-sizing:border-box;}
.sheet-ab-item .sheet-ab-effect textarea {height:100%; box-sizing:border-box;}
.sheet-ab-item .sheet-check-flag:checked ~ .sheet-ab-effect {display:block;}

@media all and (max-width:800px) {
	.sheet-ab-item .sheet-ab-name {width:50%;}
	.sheet-ab-item .sheet-ab-type {width:25%;}
	.sheet-ab-item .sheet-ab-spec {width:25%;}
	.sheet-ab-item .sheet-ab-emotion {width:25%;}
	.sheet-ab-item .sheet-ab-option {width:25%;}
}

@media all and (max-width:750px) {
	.sheet-repeat-data .sheet-abill,
	.sheet-repeat-data .sheet-relation {width:auto; float:none;}
	.sheet-repeat-data .sheet-relation {padding-top:1em;}
}