/* Reset */ .charsheet select, .charsheet div, .charsheet button, .charsheet textarea, .charsheet span, .charsheet input, .charsheet img, .charsheet label{box-sizing: border-box; outline:0; outline:0; appearance:none !important; -webkit-appearance:none !important;} .ui-dialog .charsheet {padding:0;} .sheet-wrap {font-size:12px; color:#000; font-family: 'Noto Sans KR', sans-serif;} .sheet-wrap * {color:inherit; outline:0 !important; font-family:inherit; letter-spacing:-0.01em; font-weight:400; box-sizing:border-box;} .sheet-wrap p {margin:0;} .sheet-wrap input, .sheet-wrap textarea, .sheet-wrap select, .sheet-wrap .uneditable-input {margin:0; border-radius:0 !important;} .sheet-wrap input[type="checkbox"], .sheet-wrap input[type="radio"] {display:block; position:absolute; top:0; left:0; opacity:0; border:none !important;} .sheet-wrap input[type="text"], .sheet-wrap input[type="number"] {border:none; border-radius:0; background:transparent; padding:0; font-size:inherit; width:100%;} .sheet-wrap select {border:none; padding:0; font-size:inherit; width:100%; background:transparent;} .sheet-wrap input[type="number"]::-webkit-outer-spin-button, .sheet-wrap input[type="number"]::-webkit-inner-spin-button {appearance:none; -webkit-appearance:none; -moz-appearance:none; margin:0;} .sheet-wrap input[type=number] {-moz-appearance: textfield;} .sheet-wrap select, .sheet-wrap input[type="checkbox"], .sheet-wrap input[type="radio"], .sheet-wrap button {cursor:pointer;} .sheet-wrap button[type="roll"]:before {display:none !important;} .sheet-wrap input:-internal-autofill-selected {background-color:transparent !important; appearance:none !important; -webkit-appearance:none !important; -moz-appearance:none !important;} .sheet-wrap input[type="number"] {width:100% !important;} .sheet-wrap select * {color:#000 !important;} .sheet-wrap input[type="checkbox"], .sheet-wrap input[type="radio"], .sheet-wrap button, .sheet-wrap select {box-shadow: none !important; appearance:none; -webkit-appearance:none; -moz-appearance:none;} .sheet-wrap select {padding-right:15px; background:url(https://i.imgur.com/frzQkll.png) no-repeat top 50% right 0px;} .sheet-wrap button, .sheet-wrap button:focus, .sheet-wrap button:hover {border:none; margin:0; background:transparent; background-color:inherit; color:inherit;} .sheet-wrap button, .sheet-wrap button * {text-shadow:none;} .sheet-wrap textarea {width:100%; background:transparent; border:none; resize:none; line-height:1.5;} .sheet-wrap fieldset {margin:0; padding:0; border:none;} .sheet-wrap .repcontrol {overflow:hidden;} .sheet-wrap .repcontrol button {color:#fff; font-size:11px !important; font-weight:100;} .sheet-wrap .repcontrol {border-top:2px solid #000; background:transparent;} .sheet-wrap .repcontrol button {background:#000; position:relative; border-radius:0 !important; padding:0 10px; font-size:11px !important; height:25px; border:none; line-height:1; font-weight:400 !important;} .sheet-wrap .repcontrol button:before {content:""; display:block; position:absolute; top:0; bottom:0; right:100%; width:0; height:0; border:25px solid transparent; border-right-width:0; border-bottom-width:0; border-top-color:#000;} .sheet-wrap .repcontrol button + button:before {right:auto; left:100%; border-right-width:25px; border-left-width:0;} .sheet-wrap .repcontainer.editmode .repitem .itemcontrol {z-index:99;} .sheet-wrap .repcontainer.editmode .repitem .itemcontrol a, .sheet-wrap .repcontainer.editmode .repitem .itemcontrol button {border-radius:0 !important; margin:0 !important; width:30px; height:30px; line-height:30px; padding:0 !important; border:none;} .sheet-wrap .repcontainer.editmode .repitem .itemcontrol .repcontrol_del {background-color:#cb0000;} .sheet-wrap .sheet-dice {display:inline-block; vertical-align:middle; border:none; padding:0 !important; margin:0 !important; width:20px; height:20px; border-radius:0; background:url(https://i.imgur.com/pzWsKtd.png) no-repeat 50% 50% !important;} .sheet-wrap .sheet-dice:before {display:none !important;} .sheet-wrap input::placeholder {color:rgba(0,0,0, .3);} .sheet-wrap textarea::placeholder {color:rgba(0,0,0, .3);} .charsheet .sheet-tal {text-align:left !important;} .charsheet .sheet-tar {text-align:right !important;} .charsheet .sheet-tac {text-align:center !important;} .sheet-wrap .inlinerollresult {display:inline !important; font-size:1em !important; opacity:1 !important; padding:0 !important; background:transparent !important; border:none !important;} .sheet-bar > span {display:block; position:relative; height:5px; background:rgba(0,0,0,.1); border-radius:9em; overflow:hidden;} .sheet-bar > span:before {content:""; display:block; position:absolute; top:0; bottom:0; left:0; border-radius:9em; background:#bb1b21; transition:.3s all; -webkit-transition:.3s all; z-index:0;} .sheet-graph-per[value="1"]~ * .sheet-bar span:before {width:1%;} .sheet-graph-per[value="2"]~ * .sheet-bar span:before {width:2%;} .sheet-graph-per[value="3"]~ * .sheet-bar span:before {width:3%;} .sheet-graph-per[value="4"]~ * .sheet-bar span:before {width:4%;} .sheet-graph-per[value="5"]~ * .sheet-bar span:before {width:5%;} .sheet-graph-per[value="6"]~ * .sheet-bar span:before {width:6%;} .sheet-graph-per[value="7"]~ * .sheet-bar span:before {width:7%;} .sheet-graph-per[value="8"]~ * .sheet-bar span:before {width:8%;} .sheet-graph-per[value="9"]~ * .sheet-bar span:before {width:9%;} .sheet-graph-per[value="10"]~ * .sheet-bar span:before {width:10%;} .sheet-graph-per[value="11"]~ * .sheet-bar span:before {width:11%;} .sheet-graph-per[value="12"]~ * .sheet-bar span:before {width:12%;} .sheet-graph-per[value="13"]~ * .sheet-bar span:before {width:13%;} .sheet-graph-per[value="14"]~ * .sheet-bar span:before {width:14%;} .sheet-graph-per[value="15"]~ * .sheet-bar span:before {width:15%;} .sheet-graph-per[value="16"]~ * .sheet-bar span:before {width:16%;} .sheet-graph-per[value="17"]~ * .sheet-bar span:before {width:17%;} .sheet-graph-per[value="18"]~ * .sheet-bar span:before {width:18%;} .sheet-graph-per[value="19"]~ * .sheet-bar span:before {width:19%;} .sheet-graph-per[value="20"]~ * .sheet-bar span:before {width:20%;} .sheet-graph-per[value="21"]~ * .sheet-bar span:before {width:21%;} .sheet-graph-per[value="22"]~ * .sheet-bar span:before {width:22%;} .sheet-graph-per[value="23"]~ * .sheet-bar span:before {width:23%;} .sheet-graph-per[value="24"]~ * .sheet-bar span:before {width:24%;} .sheet-graph-per[value="25"]~ * .sheet-bar span:before {width:25%;} .sheet-graph-per[value="26"]~ * .sheet-bar span:before {width:26%;} .sheet-graph-per[value="27"]~ * .sheet-bar span:before {width:27%;} .sheet-graph-per[value="28"]~ * .sheet-bar span:before {width:28%;} .sheet-graph-per[value="29"]~ * .sheet-bar span:before {width:29%;} .sheet-graph-per[value="30"]~ * .sheet-bar span:before {width:30%;} .sheet-graph-per[value="31"]~ * .sheet-bar span:before {width:31%;} .sheet-graph-per[value="32"]~ * .sheet-bar span:before {width:32%;} .sheet-graph-per[value="33"]~ * .sheet-bar span:before {width:33%;} .sheet-graph-per[value="34"]~ * .sheet-bar span:before {width:34%;} .sheet-graph-per[value="35"]~ * .sheet-bar span:before {width:35%;} .sheet-graph-per[value="36"]~ * .sheet-bar span:before {width:36%;} .sheet-graph-per[value="37"]~ * .sheet-bar span:before {width:37%;} .sheet-graph-per[value="38"]~ * .sheet-bar span:before {width:38%;} .sheet-graph-per[value="39"]~ * .sheet-bar span:before {width:39%;} .sheet-graph-per[value="40"]~ * .sheet-bar span:before {width:40%;} .sheet-graph-per[value="41"]~ * .sheet-bar span:before {width:41%;} .sheet-graph-per[value="42"]~ * .sheet-bar span:before {width:42%;} .sheet-graph-per[value="43"]~ * .sheet-bar span:before {width:43%;} .sheet-graph-per[value="44"]~ * .sheet-bar span:before {width:44%;} .sheet-graph-per[value="45"]~ * .sheet-bar span:before {width:45%;} .sheet-graph-per[value="46"]~ * .sheet-bar span:before {width:46%;} .sheet-graph-per[value="47"]~ * .sheet-bar span:before {width:47%;} .sheet-graph-per[value="48"]~ * .sheet-bar span:before {width:48%;} .sheet-graph-per[value="49"]~ * .sheet-bar span:before {width:49%;} .sheet-graph-per[value="50"]~ * .sheet-bar span:before {width:50%;} .sheet-graph-per[value="51"]~ * .sheet-bar span:before {width:51%;} .sheet-graph-per[value="52"]~ * .sheet-bar span:before {width:52%;} .sheet-graph-per[value="53"]~ * .sheet-bar span:before {width:53%;} .sheet-graph-per[value="54"]~ * .sheet-bar span:before {width:54%;} .sheet-graph-per[value="55"]~ * .sheet-bar span:before {width:55%;} .sheet-graph-per[value="56"]~ * .sheet-bar span:before {width:56%;} .sheet-graph-per[value="57"]~ * .sheet-bar span:before {width:57%;} .sheet-graph-per[value="58"]~ * .sheet-bar span:before {width:58%;} .sheet-graph-per[value="59"]~ * .sheet-bar span:before {width:59%;} .sheet-graph-per[value="60"]~ * .sheet-bar span:before {width:60%;} .sheet-graph-per[value="61"]~ * .sheet-bar span:before {width:61%;} .sheet-graph-per[value="62"]~ * .sheet-bar span:before {width:62%;} .sheet-graph-per[value="63"]~ * .sheet-bar span:before {width:63%;} .sheet-graph-per[value="64"]~ * .sheet-bar span:before {width:64%;} .sheet-graph-per[value="65"]~ * .sheet-bar span:before {width:65%;} .sheet-graph-per[value="66"]~ * .sheet-bar span:before {width:66%;} .sheet-graph-per[value="67"]~ * .sheet-bar span:before {width:67%;} .sheet-graph-per[value="68"]~ * .sheet-bar span:before {width:68%;} .sheet-graph-per[value="69"]~ * .sheet-bar span:before {width:69%;} .sheet-graph-per[value="70"]~ * .sheet-bar span:before {width:70%;} .sheet-graph-per[value="71"]~ * .sheet-bar span:before {width:71%;} .sheet-graph-per[value="72"]~ * .sheet-bar span:before {width:72%;} .sheet-graph-per[value="73"]~ * .sheet-bar span:before {width:73%;} .sheet-graph-per[value="74"]~ * .sheet-bar span:before {width:74%;} .sheet-graph-per[value="75"]~ * .sheet-bar span:before {width:75%;} .sheet-graph-per[value="76"]~ * .sheet-bar span:before {width:76%;} .sheet-graph-per[value="77"]~ * .sheet-bar span:before {width:77%;} .sheet-graph-per[value="78"]~ * .sheet-bar span:before {width:78%;} .sheet-graph-per[value="79"]~ * .sheet-bar span:before {width:79%;} .sheet-graph-per[value="80"]~ * .sheet-bar span:before {width:80%;} .sheet-graph-per[value="81"]~ * .sheet-bar span:before {width:81%;} .sheet-graph-per[value="82"]~ * .sheet-bar span:before {width:82%;} .sheet-graph-per[value="83"]~ * .sheet-bar span:before {width:83%;} .sheet-graph-per[value="84"]~ * .sheet-bar span:before {width:84%;} .sheet-graph-per[value="85"]~ * .sheet-bar span:before {width:85%;} .sheet-graph-per[value="86"]~ * .sheet-bar span:before {width:86%;} .sheet-graph-per[value="87"]~ * .sheet-bar span:before {width:87%;} .sheet-graph-per[value="88"]~ * .sheet-bar span:before {width:88%;} .sheet-graph-per[value="89"]~ * .sheet-bar span:before {width:89%;} .sheet-graph-per[value="90"]~ * .sheet-bar span:before {width:90%;} .sheet-graph-per[value="91"]~ * .sheet-bar span:before {width:91%;} .sheet-graph-per[value="92"]~ * .sheet-bar span:before {width:92%;} .sheet-graph-per[value="93"]~ * .sheet-bar span:before {width:93%;} .sheet-graph-per[value="94"]~ * .sheet-bar span:before {width:94%;} .sheet-graph-per[value="95"]~ * .sheet-bar span:before {width:95%;} .sheet-graph-per[value="96"]~ * .sheet-bar span:before {width:96%;} .sheet-graph-per[value="97"]~ * .sheet-bar span:before {width:97%;} .sheet-graph-per[value="98"]~ * .sheet-bar span:before {width:98%;} .sheet-graph-per[value="99"]~ * .sheet-bar span:before {width:99%;} .sheet-graph-per[value="100"]~ * .sheet-bar span:before {width:100%;} /* 기본 레이아웃 틀 작업 */ .sheet-wrap {display:block; position:relative; width:850px; margin:0 auto; padding:20px; min-height:400px; background:url(https://i.imgur.com/G60lDNj.png) no-repeat 100% 0, url(https://i.imgur.com/TBfB496.png) no-repeat 50% 0, url(https://i.imgur.com/g0oXx2I.png) repeat-y 50% 0; background-size:auto auto, 100% auto, 100% auto; z-index:0;} .sheet-wrap:before {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:-1;} .sheet-copyright {position:absolute; font-size:11px; opacity:.4; top:193px; left:20px; z-index:-2;} .sheet-header {display:block; position:relative; padding:10px 0 10px 285px; min-height:160px; background:url(https://i.imgur.com/mkBh0eE.png) no-repeat 0 10px; background-size:auto 130px;} .sheet-header .sheet-free-dice {display:block; position:absolute; left:0; width:250px; bottom:10px; text-align:center;} .sheet-header .sheet-free-dice > * {display:inline-block; vertical-align:middle; float:left;} .sheet-header .sheet-free-dice input[type="text"], .sheet-header .sheet-free-dice input[type="number"] {width:34px !important; text-align:center; border-bottom:1px solid rgba(0,0,0,.1); background:rgba(255,255,255,.5);} .sheet-header .sheet-free-dice .sheet-dot ~ input[type="text"], .sheet-header .sheet-free-dice .sheet-dot ~ input[type="number"] {width:60px !important;} .sheet-header .sheet-codename {display:block; position:relative; width:250px; height:20px; background:#000; color:#fff; padding-left:7em; margin-bottom:15px;} .sheet-header .sheet-codename strong {display:block; position:absolute; top:0; left:.5em; line-height:20px;} .sheet-header .sheet-codename input[type="text"] {display:block; position:relative; width:100%; height:100%; color:#fff;} .sheet-header .sheet-codename input[type="text"]::placeholder {color:rgba(0,0,0, .3);} .sheet-header .sheet-username {display:block; position:absolute; top:10px; right:0; width:140px; height:20px; padding-left:4.5em; margin-bottom:15px;} .sheet-header .sheet-username strong {display:block; position:absolute; top:0; left:.5em; line-height:20px;} .sheet-header .sheet-username input[type="text"] {display:block; position:relative; width:100%; height:100%; border-bottom:1px solid rgba(0,0,0,.1);} .sheet-header .sheet-username input[type="text"]::placeholder {color:rgba(0,0,0, .3);} .sheet-header .sheet-chname {display:block; position:relative; height:40px; border-bottom:1px solid rgba(0,0,0,.2);} .sheet-header .sheet-chname input[type="text"] {display:block; position:relative; width:100%; height:100%; color:#000; font-size:25px; font-weight:800;} .sheet-header-profile {display:grid; position:relative; margin-top:10px; grid-template-columns:1fr 1fr .8fr;} .sheet-header-profile select, .sheet-header-profile input[type="text"] {display:block; position:relative; width:100%; height:100%; text-align:center; padding:0 !important; background:transparent !important; border-bottom:1px solid rgba(0,0,0,.1);} .sheet-header-profile > * {display:block; position:relative; padding-left:5.9em; padding-right:.3em; height:20px; margin:2px 0;} .sheet-header-profile > * strong {display:block; position:absolute; top:0; left:0; bottom:0; padding:0; width:6em; font-size:11px; background:rgba(0,0,0,.8); color:#fff; letter-spacing:-0.01em; text-align:center; line-height:20px; font-weight:400; border-radius:0;} .sheet-select-sydrom {display:block; position:relative; padding-left:200px; margin:20px 0;} .sheet-select-sydrom:before {content:""; display:block; position:absolute; left:200px; right:330px; top:50%; height:1px; background:#000;} .sheet-select-sydrom:after {content:""; display:block; clear:both;} .sheet-select-sydrom > .sheet-syndrom-type {display:block; position:absolute; left:0; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%);} .sheet-select-sydrom > .sheet-syndrom-type .sheet-syndrom-type-text {display:none; font-weight:800; font-size:30px; letter-spacing:-.07em; color:#aaa;} .sheet-select-sydrom > .sheet-syndrom-type .sheet-syndrom-type-text em {font-weight:800; font-size:30px; font-style:normal; letter-spacing:-.07em; color:#bb1b21;} .sheet-select-sydrom .sheet-item-group {display:block; position:relative; float:right; background:#000; width:330px;} .sheet-select-sydrom .sheet-item-group:before {content:""; display:block; position:absolute; width:0; height:0; border:15px solid transparent; border-right-color:#000; right:100%; top:50%; margin-top:-15px;} .sheet-select-sydrom .sheet-item-group > .sheet-item {display:block; position:relative; width:33.33%; float:left; height:30px; text-align:center; font-weight:800;} .sheet-select-sydrom .sheet-item-group > .sheet-item + .sheet-item:before {content:""; display:block; position:absolute; top:50%; left:0; width:1px; height:1em; margin-top:-.5em; background:rgba(0,0,0,.3);} .sheet-select-sydrom .sheet-item-group > .sheet-item select {display:block; position:relative; width:100%; height:100%; text-align:center; padding:0 !important; background:transparent !important; font-weight:800; color:#fff;} .sheet-check-syndrome[value=""] ~ * .sheet-syndrom-type-text.sheet-syndrom-0, .sheet-check-syndrome[value="0"] ~ * .sheet-syndrom-type-text.sheet-syndrom-0 {display:block;} .sheet-check-syndrome[value="1"] ~ * .sheet-syndrom-type-text.sheet-syndrom-1 {display:block;} .sheet-check-syndrome[value="2"] ~ * .sheet-syndrom-type-text.sheet-syndrom-2 {display:block;} .sheet-check-syndrome[value="3"] ~ * .sheet-syndrom-type-text.sheet-syndrom-3 {display:block;} .sheet-mid-section {display:block; position:relative;} .sheet-mid-section:after {content:""; display:block; clear:both;} .sheet-mid-section .sheet-life {display:block; position:relative; width:550px; float:left;} .sheet-mid-section .sheet-life .sheet-tit {display:block; position:relative; float:left; font-size:12px; color:#fff; font-weight:800; padding:0 10px; background:#000; height:30px; line-height:30px;} .sheet-mid-section .sheet-life .sheet-tit:after {content:""; display:block; position:absolute; width:0; height:0; border:30px solid transparent; border-top-width:0; border-left-width:0; border-bottom-color:#000; left:100%; bottom:0;} .sheet-mid-section .sheet-life .sheet-rand-side {position:absolute; top:5px; right:0; padding-right:20px;} .sheet-mid-section .sheet-life .sheet-rand-side select {display:block; position:relative; height:20px; border-radius:9em !important; background:rgba(0,0,0,.1); padding:0; width:80px; text-align:center;} .sheet-mid-section .sheet-life .sheet-rand-side .sheet-dice {position:absolute; top:0; right:0;} .sheet-mid-section .sheet-life-group {display:block; position:relative; padding:10px; border:1px solid #000; clear:both; background:#fff;} .sheet-mid-section .sheet-life-group > div {display:grid; grid-auto-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;} .sheet-mid-section .sheet-life-group > div > *:nth-child(1) {grid-column:1/5;} .sheet-mid-section .sheet-life-group > div > *:nth-child(2) {grid-column:5/9;} .sheet-mid-section .sheet-life-group > div > *:nth-child(3) {grid-column:1/3;} .sheet-mid-section .sheet-life-group > div > *:nth-child(4) {grid-column:3/5;} .sheet-mid-section .sheet-life-group > div > *:nth-child(5) {grid-column:5/7;} .sheet-mid-section .sheet-life-group > div > *:nth-child(6) {grid-column:7/9;} .sheet-mid-section .sheet-life-group select, .sheet-mid-section .sheet-life-group input[type="text"] {display:block; position:relative; width:100%; height:25px; padding:0 !important; border-bottom:1px solid rgba(0,0,0,.1);} .sheet-mid-section .sheet-life-group > div > * {position:relative; padding-left:4.5em; padding-right:.5em; margin:2px 0;} .sheet-mid-section .sheet-life-group > div > * strong {display:block; position:absolute; top:0; left:0; bottom:0; padding:0; width:4em; font-size:12px; background:rgba(0,0,0,.8); color:#fff; letter-spacing:-0.01em; text-align:center; line-height:25px; font-weight:400; border-radius:0;} .sheet-mid-section .sheet-life-group .sheet-has-dice select, .sheet-mid-section .sheet-life-group .sheet-has-dice input[type="text"] {float:left; width:7em; margin-right:5px;} .sheet-mid-section .sheet-life-group .sheet-has-dice .sheet-dice {height:25px; float:left;} .sheet-mid-section .sheet-life-group .sheet-has-input select {width:60%; float:left;} .sheet-mid-section .sheet-life-group .sheet-has-input input[type="text"] {float:right; width:38%;} .sheet-mid-section .sheet-other {display:block; position:relative; width:250px; padding-top:30px; float:right;} .sheet-mid-section .sheet-other input[type="text"], .sheet-mid-section .sheet-other input[type="number"] {height:25px; border-bottom:1px solid rgba(0,0,0,.1); text-align:center;} .sheet-mid-section .sheet-other input[type="text"][readonly], .sheet-mid-section .sheet-other input[type="number"][readonly] {border-bottom-color:transparent;} .sheet-mid-section .sheet-other .sheet-hp {display:grid; grid-template-columns:45px 150px 1fr; margin-bottom:10px;} .sheet-mid-section .sheet-other .sheet-hp > * {position:relative; padding:0 3px;} .sheet-mid-section .sheet-other .sheet-hp strong {display:block; position:relative; background:#000; text-align:center; color:#fff; line-height:25px;} .sheet-mid-section .sheet-other .sheet-hp .sheet-nowtotal > * {display:block; float:left; height:25px; text-align:center; width:20% !important;} .sheet-mid-section .sheet-other .sheet-hp .sheet-nowtotal span {width:5% !important; line-height:25px;} .sheet-mid-section .sheet-other .sheet-hp .sheet-bar {position:absolute; left:0; right:0; top:50%; margin-top:-2px;} .sheet-mid-section .sheet-other .sheet-move-group {display:grid; grid-template-columns:1.8fr 1fr 1fr;} .sheet-mid-section .sheet-other .sheet-move-group > * {padding:0 1px;} .sheet-mid-section .sheet-other .sheet-move-group strong {display:block; position:relative; background:#000; text-align:center; color:#fff; line-height:20px !important; height:20px !important; clear:both; width:auto !important; float:none !important;} .sheet-mid-section .sheet-other .sheet-move-group .sheet-math > * {display:block; float:left; height:25px; text-align:center; width:30% !important;} .sheet-mid-section .sheet-other .sheet-move-group .sheet-math > strong {width:auto !important;} .sheet-mid-section .sheet-other .sheet-move-group .sheet-math span {width:5% !important; line-height:25px;} .sheet-mid-section .sheet-other .sheet-rand-side {position:absolute; top:5px; right:0;} .sheet-mid-section .sheet-other .sheet-rand-side > div {float:left; margin-left:5px;} .sheet-mid-section .sheet-other .sheet-rand-side strong {display:block; line-height:20px; float:left; margin-right:4px;} .sheet-mid-section .sheet-other .sheet-rand-side input[type="text"], .sheet-mid-section .sheet-other .sheet-rand-side input[type="number"] {display:block; position:relative; float:left; height:20px; border-radius:9em !important; background:rgba(0,0,0,.1); padding:0; width:45px !important; text-align:center; border:none !important;} .sheet-reduction-section {display:grid; grid-template-columns:100px 240px 1fr 75px 75px; margin:20px 0;} .sheet-reduction-section > * {position:relative;} .sheet-reduction-section .sheet-tit {font-size:16px; font-weight:800; background:#000; color:#fff; line-height:40px; padding:0 10px; text-align:center;} .sheet-reduction-section .sheet-tit:after {content:""; display:block; position:absolute; width:0; height:0; border:20px solid transparent; border-right-width:0; border-left-color:#000; left:100%; top:50%; margin-top:-20px;} .sheet-reduction-section .sheet-tit + * {padding-left:30px;} .sheet-reduction-section .sheet-form {padding-right:10px;} .sheet-reduction-section .sheet-form > * {display:block; position:relative; float:left; text-align:center; width:4%;} .sheet-reduction-section .sheet-form input[type="text"], .sheet-reduction-section .sheet-form input[type="number"] {width:22% !important; height:40px; font-size:16px; font-weight:800; border-bottom:1px solid rgba(0,0,0,.1);} .sheet-reduction-section .sheet-form input[type="text"][readonly], .sheet-reduction-section .sheet-form input[type="number"][readonly] {border-bottom-color:transparent;} .sheet-reduction-section .sheet-form span {line-height:40px; font-size:14px;} .sheet-reduction-section .sheet-graph-box {position:absolute; left:0; right:10px; top:50%; margin-top:-2px;} .sheet-reduction-section .sheet-ohter {padding:0 1px;} .sheet-reduction-section .sheet-ohter strong {display:block; position:relative; height:20px; line-height:20px; background:#000; color:#fff; text-align:center;} .sheet-reduction-section .sheet-ohter input[type="text"], .sheet-reduction-section .sheet-ohter input[type="number"] {height:20px; border-bottom:1px solid rgba(0,0,0,.1); text-align:center;} .sheet-spec-group {display:block; position:relative; margin:30px -10px;} .sheet-spec-group:after {content:""; display:block; clear:both;} .sheet-spec-group > .sheet-item {display:block; position:relative; width:25%; float:left; box-sizing:border-box; padding:-0 10px;} .sheet-spec-group .sheet-tit {display:block; position:relative; height:65px; padding-left:70px; padding-top:8px;} .sheet-spec-group .sheet-tit:before, .sheet-spec-group .sheet-tit:after {content:""; display:block; position:absolute; height:1px; bottom:-1px; left:0; background:rgba(0,0,0,.2);} .sheet-spec-group .sheet-tit:after {height:2px; background:#000; width:100%;} .sheet-spec-group .sheet-tit .sheet-act {display:block; position:relative; z-index:0;} .sheet-spec-group .sheet-tit .sheet-act strong, .sheet-spec-group .sheet-tit .sheet-act span {display:inline-block; vertical-align:bottom;} .sheet-spec-group .sheet-tit .sheet-act strong {color:#000; font-size:16px; font-weight:600; margin-right:10px;} .sheet-spec-group .sheet-tit .sheet-act span {opacity:.8;} .sheet-spec-group .sheet-tit .sheet-act button {display:block; position:absolute; width:100% !important; height:100% !important; top:0; left:0; z-index:1; opacity:0;} .sheet-spec-group .sheet-tit .sheet-cmm-spec {display:block; position:relative; padding-right:50px; margin-top:1px; line-height:20px;} .sheet-spec-group .sheet-tit .sheet-cmm-spec input[type="text"], .sheet-spec-group .sheet-tit .sheet-cmm-spec input[type="number"] {width:25px !important; height:20px !important; border-bottom:1px solid rgba(0,0,0,.2); text-align:center !important;} .sheet-spec-group .sheet-tit .sheet-cmm-spec input[type="text"][readonly], .sheet-spec-group .sheet-tit .sheet-cmm-spec input[type="number"][readonly] {border-bottom:transparent;} .sheet-spec-group .sheet-tit .sheet-cmm-spec .sheet-cri {position:absolute; right:0; bottom:0;} .sheet-spec-group .sheet-tit .sheet-cmm-spec .sheet-cri span {font-size:11px;} .sheet-spec-group .sheet-circle-graph {position:absolute; top:50%; left:3px; width:45px; height:45px; margin-top:-22px;} .sheet-spec-group .sheet-circle-graph .sheet-total {display:block; position:absolute; top:0; left:0; width:100%; height:100%; z-index:0; background:transparent !important; border:none !important; text-align:center; color:#fff; font-size:20px; font-weight:800 !important;} .sheet-spec-group .sheet-circle-graph .sheet-circle {display:block; position:absolute; width:80%; height:80%; top:50%; left:50%; z-index:-1; background:#000; transform:translate(-50%, -50%) rotate(-45deg); -webkit-transform:translate(-50%, -50%) rotate(-45deg);} .sheet-spec-group .sheet-circle-graph .sheet-circle:before {content:""; display:block; position:relative; padding-top:100%;} .sheet-spec-group .sheet-circle-graph .sheet-circle:after {content:""; display:block; position:absolute; top:4px; left:4px; bottom:4px; right:4px; background:#070709; border-radius:100%;} .sheet-skill-box {display:block; z-index:0;} .sheet-skill-box .sheet-skill {display:block; padding:0; border-bottom:1px solid rgba(0,0,0,.1);} .sheet-skill-box .sheet-skill:after {content:""; display:block; clear:both;} .sheet-skill-box > .sheet-skill:nth-child(even) {background:rgba(0,0,0,.08);} .sheet-skill-box .sheet-skill button {display:block; width:40px; height:30px; float:left; font-size:12px !important; padding:0 !important; text-align:center !important; margin:0 !important; background:transparent;} .sheet-skill-box .sheet-txt {display:block; width:95px; height:30px; float:left; border-right:1px solid rgba(0,0,0,.2);} .sheet-skill-box .sheet-txt input {height:30px !important; float:left; font-size:12px; border-left:1px solid rgba(0,0,0,.1) !important; padding:0 5px;} .sheet-skill-box .sheet-skill > div:not(.sheet-txt) {display:block; float:left; width:46px; height:30px;} .sheet-skill-box .sheet-skill > div:not(.sheet-txt) span {display:block; float:left; width:20px; line-height:30px; text-align:center;} .sheet-skill-box .sheet-skill > div:not(.sheet-txt) input[type="number"] {text-align:center; width:25px !important; height:30px !important; float:left;} .sheet-wrap .repcontainer > .repitem:nth-child(even) .sheet-skill {background:rgba(0,0,0,.08);} .sheet-data-section + .sheet-data-section {margin-top:20px;} .sheet-flip-title {display:Block; position:relative; padding:10px 0 15px; margin-bottom:20px; border-bottom:2px solid #000; z-index:0;} .sheet-flip-title:after {content:"▼"; display:inline-block; vertical-align:middle; margin-left:10px; font-size:.8em;} .sheet-flip-title > * {z-index:0;} .sheet-flip-title input[type="checkbox"] {width:100% !important; height:100% !important; z-index:1;} .sheet-flip-title strong {display:inline-block; position:relative; min-width:4em; vertical-align:middle; font-size:18px; font-weight:800; padding-left:10px;} .sheet-flip-content {display:none; position:relative; border-top:1px solid rgba(255,255,255,.2); padding-top:15px; padding-bottom:30px; margin-top:10px;} .sheet-flip-content .sheet-sub-title {display:block; position:relative; font-weight:600; margin-bottom:10px; padding-left:18px; color:#000;} .sheet-flip-content .sheet-sub-title:before {content:""; display:block; position:absolute; width:10px; height:2px; top:50%; left:0; margin-top:-1px; background:#000;} .sheet-flip-content * ~ .sheet-sub-title {margin-top:20px;} .sheet-chk-flip-state[value="1"] ~ .sheet-flip-title {margin-bottom:0; color:#bb1b21;} .sheet-chk-flip-state[value="1"] ~ .sheet-flip-title:after {content:"▲";} .sheet-chk-flip-state[value="1"] ~ .sheet-flip-content {display:block;} /* 테이블 스타일 */ .sheet-table {display:block; position:relative;} .sheet-table input[type="text"], .sheet-table input[type="number"] {display:block !important; width:100% !important; vertical-align:middle !important; height:30px !important; padding:0 10px !important;} .sheet-table input[type="number"] {text-align:center !important;} .sheet-table .sheet-tac {text-align:center !important;} .sheet-table .sheet-tbody > .sheet-table-item:nth-child(even), .sheet-table .sheet-tbody > .sheet-row:nth-child(even){background:rgba(0,0,0,.08);} .sheet-table .repcontainer > .repitem:nth-child(even) > .sheet-row, .sheet-table .repcontainer > .repitem:nth-child(even) .sheet-table-item {background:rgba(0,0,0,.08);} .sheet-table .sheet-tbody .sheet-fixed-line {border-bottom:1px solid #bb1b21 !important;} .sheet-table .sheet-thead {display:block; position:relative; background:#000000; border:1px solid rgba(255,255,255,.2); overflow:hidden;} .sheet-table .sheet-row {display:table !important; table-layout:fixed; width:100%;} .sheet-table .sheet-row > * {display:table-cell; vertical-align:middle; height:25px; border:0px solid rgba(0,0,0,.1); border-bottom-width:1px;} .sheet-table .sheet-row-side {display:table !important; table-layout:fixed; width:100%;} .sheet-table .sheet-row-side > * {display:table-cell; vertical-align:middle; height:25px; border:0px dashed rgba(0,0,0,.1); border-bottom-width:1px;} .sheet-table .sheet-row-side + .sheet-row-side > * {border-color:rgba(0,0,0,.2); border-style:solid;} .sheet-table .sheet-thead .sheet-row > * {text-align:center; border-bottom-width:0; border-color:rgba(255,255,255,.3); color:#fff;} .sheet-table .sheet-thead .sheet-row > * + * {border-left-width:2px;} .sheet-table .sheet-flip .sheet-effect-eff-view {display:block; position:relative; width:20px; height:20px; margin:0 auto; background:url(https://i.imgur.com/jghDVX0.png) no-repeat 50% 50%; opacity:.3;} .sheet-table .sheet-flip-item-content {display:none; position:relative; padding:0; border-bottom:1px solid rgba(0,0,0,.5);} .sheet-table .sheet-flip-item-content textarea {display:block; position:relative; padding:15px; height:100px; font-size:12px;} .sheet-table .sheet-flip-item-content input[type="text"] {padding:0 15px !important; background:rgba(0,0,0,.1); border-top:1px solid rgba(0,0,0,.2);} .sheet-table .sheet-chk-flip[value="1"] ~ * .sheet-effect-eff-view {opacity:1;} .sheet-table .sheet-chk-flip[value="1"] ~ .sheet-flip-item-content {display:block;} .sheet-table .sheet-titus input[type="checkbox"] {display:block; position:relative; width:20px; height:20px; margin:0 auto; opacity:1; background:url(https://i.imgur.com/FDojloQ.png) no-repeat 50% 50%; opacity:.2;} .sheet-table .sheet-titus input[type="checkbox"]:checked {opacity:1;} .sheet-table .sheet-fixed .sheet-titus input[type="checkbox"] {background-image:url(https://i.imgur.com/edghZHV.png);} .sheet-table .sheet-emot > div {display:block; position:relative; padding-left:30px;} .sheet-table .sheet-emot > div > input[type="checkbox"] {display:block; position:absolute; top:0; left:0; width:30px !important; height:30px !important; z-index:2;} .sheet-table .sheet-emot > div > input[type="checkbox"] + span {display:block; position:absolute; top:0; left:0; width:30px; height:30px; z-index:0;} .sheet-table .sheet-emot > div > input[type="checkbox"] + span:before {content:""; display:block; position:absolute; width:5px; height:5px; border:2px solid rgba(0,0,0,.5); top:50%; left:50%; transform:translate(-50% ,-50%) rotate(-45deg); -webkit-transform:translate(-50% ,-50%) rotate(-45deg);} .sheet-table .sheet-emot > div > input[type="checkbox"]:checked + span:before {background:#000;} .sheet-table .sheet-txt-small, .sheet-table .sheet-txt-small input[type="number"], .sheet-table .sheet-txt-small input[type="text"] {font-size:11px !important;} .sheet-table .sheet-lv > * {display:block; float:left;} .sheet-table .sheet-lv > input[type="number"] {width:40% !important; padding:0 !important;} .sheet-table .sheet-lv .sheet-dash {width:20%; height:30px; line-height:30px; opacity:.3;} .sheet-table .sheet-custom > * {display:block; float:left;} .sheet-table .sheet-custom > input[type="number"] {width:20px !important; padding:0 !important;} .sheet-table .sheet-custom span {width:auto; padding:0 4px !important; height:30px; line-height:30px; opacity:.8;} .sheet-table .sheet-dic, .sheet-table .sheet-flip, .sheet-table .sheet-titus {width:30px; text-align:center;} .sheet-table .sheet-no {width:65px;} .sheet-table .sheet-name {width:125px;} .sheet-table .sheet-emot {width:100px;} .sheet-table .sheet-rel {width:80px;} .sheet-table .sheet-tim {width:80px;} .sheet-table .sheet-har {width:60px;} .sheet-table .sheet-target {width:80px;} .sheet-table .sheet-dis {width:60px;} .sheet-table .sheet-spe {width:60px;} .sheet-table .sheet-lim {width:70px;} .sheet-table .sheet-attack {width:60px;} .sheet-table .sheet-reu {width:80px;} .sheet-table .sheet-lv {width:40px;} .sheet-table .sheet-custom {padding-left:5px;} .sheet-table .sheet-th {text-align:center; background:#000; width:60px; color:#fff;} .sheet-table .sheet-cate, .sheet-table .sheet-spe, .sheet-table .sheet-mark, .sheet-table .sheet-dot, .sheet-table .sheet-act {width:60px;} .sheet-table .sheet-dam, .sheet-table .sheet-def, .sheet-table .sheet-dist, .sheet-table .sheet-cost, .sheet-table .sheet-exp {width:50px;} .sheet-memo {display:block !important; height:400px !important; border:1px solid rgba(0,0,0,.1) !important;} .sheet-rolltemplate-Dx3Dice {color:#000; font-size:12px; font-weight:400; padding:10px; border:1px solid #000; border-top-width:3px; border-bottom-width:3px; border-radius:10px; line-height:1.4; text-align:center; background:url(https://i.imgur.com/g0oXx2I.png) repeat-y 50% 0; background-size:100% auto;} .sheet-rolltemplate-Dx3Dice .inlinerollresult {display:inline !important; color:inherit; font-size:inherit !important; opacity:1 !important; padding:0 !important; background:transparent !important; border:none !important; vertical-align:baseline !important;} .sheet-rolltemplate-Dx3Dice .sheet-title, .sheet-rolltemplate-Dx3Dice .sheet-sub-title {margin:10px 0 20px; padding-bottom:10px;} .sheet-rolltemplate-Dx3Dice .sheet-title {font-size:18px; color:#bb1b21; font-weight:800; border-bottom:1px solid #999;} .sheet-rolltemplate-Dx3Dice .sheet-title span {font-size:11px; opacity:.6; display:block; color:#fff; padding-bottom:5px; font-weight:400;} .sheet-rolltemplate-Dx3Dice .sheet-sub-title {font-size:14px; font-weight:800; border-bottom:1px solid #999;} .sheet-rolltemplate-Dx3Dice .sheet-title + .sheet-sub-title {margin-top:-10px;} .sheet-rolltemplate-Dx3Dice .sheet-dicegroup {display:table; width:100%; table-layout:fixed; margin-bottom:10px; margin-top:-10px;} .sheet-rolltemplate-Dx3Dice .sheet-dicegroup > * {display:table-cell; vertical-align:middle; text-align:center; height:50px;} .sheet-rolltemplate-Dx3Dice .sheet-dicedetail {width:50%; text-align:left; word-break:keep-all; text-align:center;} .sheet-rolltemplate-Dx3Dice .sheet-dicedetail * {font-weight:400 !important; font-size:11px; color:#9e9e9e;} .sheet-rolltemplate-Dx3Dice .sheet-dicearea {font-size:30px; z-index:0;} .sheet-rolltemplate-Dx3Dice .sheet-mid-title {padding:10px; margin:15px -10px; background:rgba(0,0,0,.1);} .sheet-rolltemplate-Dx3Dice .sheet-mid-title strong:after {content:" | "; font-weight:400; margin:0 1em; opacity:.5;} .sheet-rolltemplate-Dx3Dice .sheet-info {display:grid; grid-template-columns:1fr 1fr; text-align:left; padding:0 10px; font-size:11px;} .sheet-rolltemplate-Dx3Dice .sheet-info p {margin:.3em 0;} .sheet-rolltemplate-Dx3Dice .sheet-info strong {display:inline-block; vertical-align:middle; background:rgba(0,0,0,.1); border-radius:3px; padding:0 .5em; margin-right:5px; min-width:3em; text-align:center; font-size:11px; font-weight:400;} .sheet-rolltemplate-Dx3Dice .sheet-info span {display:inline-block; vertical-align:middle; font-size:11px;} .sheet-rolltemplate-Dx3Dice .sheet-descript {display:block; position:relative; word-break:keep-all; margin:10px 0; padding:0 5px; color:#777;} .sheet-rolltemplate-Dx3Dice .sheet-tatus {display:block; position:relative; margin:15px -10px; padding:5px 20px; background:rgb(177 7 7 / 40%); text-align:center;} .sheet-rolltemplate-Dx3Dice .sheet-tatus span {display:block; font-size:11px; opacity:.5; padding-bottom:5px; word-break:keep-all;} .sheet-rolltemplate-Dx3Dice .sheet-tatus strong {display:block; font-size:14px;} .sheet-rolltemplate-Dx3Dice .sheet-tatus strong em {font-style:normal;} .sheet-rolltemplate-Dx3Dice .sheet-tatus .sheet-notice {padding-top:5px; color:#fff; opacity:1; font-size:12px; padding-bottom:0;}