@charset "utf-8";

.btn_confirm {padding:3em 0; text-align:center;}

/*****************CUSTOM**************************/
:root
{
--list-bg-color:#111; /*리스트 배경*/
--list-txt-color:#fff; /*리스트 기본 폰트*/
--viewer-bg-color:#333; /*안쪽 디테일 배경*/
--viewer-txt-color:#fff; /*안쪽 디테일 컬러*/
--hash-bg-color: rgba(0,0,0,0.1); /*해시태그 배경 컬러*/
--hash-txt-color:#fff; /*해시태그 폰트 컬러*/
--shadow_color:#007BFF;
--shadow_color2:rgba(0, 0, 0, 0.9);
}

@font-face {
    font-family: 'WarhavenB';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2312-1@1.1/WarhavenB.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'SEBANG_Gothic_Bold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2104@1.0/SEBANG_Gothic_Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/*도트 글씨체*/
@font-face {
    font-family: 'DOSSaemmul';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_eight@1.0/DOSSaemmul.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/*제목*/
@font-face {
    font-family: 'Cafe24Dangdanghae';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.2/Cafe24Dangdanghae.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/*에스코어드림*/
@font-face {
	font-family: 'S-CoreDream-3Light';
	src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-3Light.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

/*나눔바른고딕*/
@font-face {
	font-family: 'NanumBarunGothic';
	font-style: normal;
	font-weight: 400;
	src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.eot');
	src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.eot?#iefix') format('embedded-opentype'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.woff') format('woff'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.ttf') format('truetype');
   }
   
   @font-face {
	font-family: 'NanumBarunGothic';
	font-style: normal;
	font-weight: 700;
	src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.eot');
	src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.eot?#iefix') format('embedded-opentype'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.woff') format('woff'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.ttf') format('truetype')
   }
   
   @font-face {
	font-family: 'NanumBarunGothic';
	font-style: normal;
	font-weight: 300;
	src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.eot');
	src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.eot?#iefix') format('embedded-opentype'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.woff') format('woff'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.ttf') format('truetype');
   }
   
   .nanumbarungothic * {
	font-family: 'NanumBarunGothic', sans-serif;
   }

   /*Pretendard*/
   @font-face {
    font-family: 'Pretendard-Regular';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Cafe24Danjunghae';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.1/Cafe24Danjunghae.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}




/***********************************************
	List
***********************************************/

.log-board-wrap {display:block; position:relative;}
.log-board-wrap .empty-list {text-align:center; padding:100px 0; opacity:.5; border:1px solid var(--point_color); border-left-width:0; border-right-width:0;}

.campaign-list-slider {display:block; position:relative;}
.campaign-list-slider + .campaign-list-slider {margin-top:50px;}
.campaign-list-slider .category-title {display:block; position:relative; /*font-size:25px; margin:20px 0;*/}
.campaign-list-slider .swiper-button-prev,
.campaign-list-slider .swiper-button-next {display:block; position:absolute; top:0; bottom:0; width:100px; height:100%; text-indent:-999px; overflow:hidden; margin:0; opacity:0;}
.campaign-list-slider .swiper-button-prev:hover,
.campaign-list-slider .swiper-button-next:hover {opacity:1;}
.campaign-list-slider .swiper-button-prev {left:0; background:linear-gradient(90deg, var(--shadow_color) 0%, var(--shadow_color2)) 100%;}
.campaign-list-slider .swiper-button-next {right:0; background:linear-gradient(-90deg, var(--shadow_color) 0%, var(--shadow_color2)) 100%;}
.campaign-list-slider .swiper-button-prev.swiper-button-disabled,
.campaign-list-slider .swiper-button-next.swiper-button-disabled {opacity:0;}
.campaign-list-slider .slider {display:block;  position:relative;}
.campaign-list-slider .slider .swiper-slide {width:auto; max-width:80%;}

.campaign-list {overflow:hidden;}
.campaign-list > .list {margin:0 -10px; text-align:center;}
.campaign-list > .list > li {display:inline-block; width:auto; max-width:50%; box-sizing:border-box;}

.campaign-slider-item {max-width:100%; padding:10px;}
.campaign-slider-item .frame {display:block; position:relative; border-radius:20px; overflow:hidden;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
}
.campaign-slider-item .frame .pad {display:block; position:relative;}
.campaign-slider-item .frame .pic,
.campaign-slider-item .frame .pic > * {display:block; position:absolute; top:0; left:0; right:0; bottom:0;}
.campaign-slider-item .frame .pic > em {background:no-repeat 50% 50%; background-size:cover;}
.campaign-slider-item .frame .has-img + .cover {top:70%; background:linear-gradient(0, var(--shadow_color) 0%, var(--shadow_color2)) 100%;}
.campaign-slider-item .frame .has-img + .cover * {color:var(--font_color);}
.campaign-slider-item .frame:hover .has-img + .cover {top:0;}

.campaign-slider-item .frame .pic .cover > * {display:table; width:100%; height:100%; table-layout:fixed;}
.campaign-slider-item .frame .pic .cover > * > * {display:table-cell; text-align:center; vertical-align:middle;}

.campaign-slider-item .frame {border:1px solid var(--point_color); background:var(--bg_color);}
.campaign-slider-item.img-frame .frame {border-width:0;}
.campaign-slider-item .frame .subject {display:block; padding:1em; font-size:16px; word-break:break-all; text-align:center;}


@media all and (max-width:1024px) {
	.campaign-list-slider .category-title {font-size:20px; margin:15px 0;}
	.campaign-slider-item .frame .subject {font-size:15px;}
}
@media all and (max-width:640px) {
	.campaign-list-slider .category-title {font-size:18px;}
	.campaign-slider-item .frame .subject {font-size:14px;}
}
@media all and (max-width:420px) {
	.campaign-list > .list > li {max-width:100%;}
}


/***********************************************
	Viewer
***********************************************/

.campaignViewer {display:block; position:relative; overflow:hidden; min-height:80vh; line-height:1.8; /* border-radius:3em;*/ overflow:hidden;
  /* background:#eeeeee; */
  background:transparent;
  color:var(--viewer-txt-color);
    z-index:0;
	-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.2);
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.2);
}
.campaignViewer .visual-box {display:block; position:relative; padding-top:350px; padding-bottom:40px;}
.campaignViewer .visual-box.no-visual {padding-top:100px;}
.campaignViewer .visual-box .bak {position:absolute; top:0; left:0; right:0; bottom:0; background:linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0)) 100%; z-index:-1;background-color: var(--viewer-bg-color);}
.campaignViewer .visual-box .bak img {display:block; position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; -webkit-mask-image:linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);}

.campaignViewer .info_divider {
  display: flex;
  padding: 20px;
  gap: 40px;
  font-family:'S-CoreDream-3Light';
  background: var(--viewer-bg-color);
  color: var(--viewer-txt-color);
  font-size:13px;
  line-height:1.5em;
}
.campaignViewer .info_divider p {
  margin-bottom:8px;
}
.campaignViewer .info_divider .review {
  margin:10px 0;
	font-family:'Chosunilbo_myungjo';
}

.campaignViewer .camp-default-info {display:block; position:relative; padding:20px; padding-bottom:0; text-shadow: 0px 0px 10px var(--shadow_color); word-break:keep-all;}
.campaignViewer .camp-default-info .subj {display:block; position:relative; font-size:40px; font-weight:800; line-height:1.2; margin-bottom:.3em;}
.campaignViewer .camp-default-info .sub-text {display:block; position:relative; font-size:18px; margin-bottom:10px; opacity:.6;}
.campaignViewer .camp-default-info .txt {font-size:14px;}
.campaignViewer .action-box {padding:15px 0;}
.campaignViewer .tab-log-content {display:block; position:relative; padding:0 40px 50px; background:var(--viewer-bg-color)}

@media all and (max-width:820px) {
	.campaignViewer {margin:-80px -20px 0; border-radius:0;}
	.campaignViewer .visual-box {padding-top:200px; padding-bottom:0px;}
	.campaignViewer .camp-default-info {padding:20px;}
	.campaignViewer .tab-log-content {padding:0 20px 50px;}
}
@media all and (max-width:640px) {
	.campaignViewer .camp-default-info .subj {font-size:30px;}
	.campaignViewer .camp-default-info .sub-text {font-size:15px;}
	.campaignViewer .camp-default-info .txt {font-size:1em;}
}
@media all and (max-width:520px) {
	.campaignViewer {margin:-80px -10px 0;}
	.campaignViewer .camp-default-info {padding:10px;}
	.campaignViewer .tab-log-content {padding:0 10px 30px;}
}

.campaignViewer .tab-log-content .tabs {display:block; position:relative; overflow:hidden; z-index:0; margin-bottom:20px;}
.campaignViewer .tab-log-content .tabs:after {content:""; display:block; position:absolute; left:0; right:0; bottom:0; height:1px; z-index:-1; background:var(--default_color); opacity:.2;}
.campaignViewer .tab-log-content .tabs li {display:block; position:relative; float:left;}
.campaignViewer .tab-log-content .tabs a {display:block; position:relative; font-size:16px; padding:.8em 1em; opacity:.6;}
.campaignViewer .tab-log-content .tabs a span {color:var(--viewer-txt-color)!important;}
.campaignViewer .tab-log-content .tabs a:after {content:""; display:block; position:absolute; left:0; right:0; bottom:0; height:0px; background:var(--point_color);}
.campaignViewer .tab-log-content .tabs li + li {margin-left:1.5em;}
.campaignViewer .tab-log-content .tab-content .tab-con {display:none; min-height:300px;}
.campaignViewer .tab-log-content[data-tabs="E"] .tabs a[data-tabs="E"],
.campaignViewer .tab-log-content[data-tabs="C"] .tabs a[data-tabs="C"],
.campaignViewer .tab-log-content[data-tabs="R"] .tabs a[data-tabs="R"],
.campaignViewer .tab-log-content[data-tabs="G"] .tabs a[data-tabs="G"] {opacity:1;}
.campaignViewer .tab-log-content[data-tabs="E"] .tabs a[data-tabs="E"]:after,
.campaignViewer .tab-log-content[data-tabs="C"] .tabs a[data-tabs="C"]:after,
.campaignViewer .tab-log-content[data-tabs="R"] .tabs a[data-tabs="R"]:after,
.campaignViewer .tab-log-content[data-tabs="G"] .tabs a[data-tabs="G"]:after {height:3px;}
.campaignViewer .tab-log-content[data-tabs="E"] .tab-content .tab-con[data-tabs="E"],
.campaignViewer .tab-log-content[data-tabs="C"] .tab-content .tab-con[data-tabs="C"],
.campaignViewer .tab-log-content[data-tabs="R"] .tab-content .tab-con[data-tabs="R"],
.campaignViewer .tab-log-content[data-tabs="G"] .tab-content .tab-con[data-tabs="G"] {display:block;}

@media all and (max-width:640px) {
	.campaignViewer .tab-log-content .tabs a {font-size:15px;}
}
@media all and (max-width:520px) {
	.campaignViewer .tab-log-content .tabs a {font-size:14px;}
}

.campaignViewer .tab-con .no-data {display:block; position:relative;}
.campaignViewer .tab-con .no-data:after {content:""; display:block; position:absolute; left:0; right:0; bottom:0; height:1px; z-index:-1; background:var(--default_color); opacity:.2;}
.campaignViewer .tab-con .no-data > * {display:block; padding:5em 0 6em; text-align:center; opacity:.6; font-size:14px;}

.campaignViewer .comment-data-box .modify {display:none; border-left:3px solid var(--default_color); padding-left:10px;}
.campaignViewer .comment-data-box.mod .modify {display:block;}

.addEpisodeWrap,
.addCharacterWrap,
.addReviewWrap {display:none !important;}
.addEpisodeWrap.open,
.addCharacterWrap.open,
.addReviewWrap.open {display:block !important;}

.campaign-write-form {display:block; position:relative; padding:20px 0; margin-top:20px; z-index:0;}
.campaign-write-form dl {display:table; width:100%; table-layout:fixed; margin:0;}
.campaign-write-form dl > * {display:table-cell; vertical-align:middle; padding:5px 10px;}
.campaign-write-form dl dt {width:65px;}
.campaign-write-form .control {text-align:center; padding-top:20px;}
.campaign-write-form .control .ui-btn {min-width:200px;}


.campaignViewer .roll20-log .log {
  /* padding:20px; margin-top:10px; border-radius:1em; */
  background: #00000080 !important;
	border:1px solid rgba(0,0,0,.2);
  /*backdrop-filter: blur(10px);*/
}
.campaignViewer .roll20-log .log #textchat {color:var(--font_color);}
.campaignViewer .roll20-log .textchatcontainer .message .spacer {background:var(--default_color); opacity:.05;}


/**********************************************
	Viewer Episode
**********************************************/
.episodeViewer .action-box {background:var(--viewer-bg-color); padding:15px 0;}

/**********************************************
	Episode
**********************************************/

.item-episode {display:block; position:relative; padding:20px 0;}
.item-episode + .item-episode:before {content:""; display:block; position:absolute; left:0; right:0; top:0; height:1px; z-index:-1; background:var(--default_color); opacity:.2;}
.episode-list {display:table; width:100%; table-layout:fixed;}
.episode-list > * {display:table-cell; position:relative; vertical-align:middle;}
.episode-list .thumb {width:220px;}
.episode-list .thumb a {display:block; position:relative; border-radius:15px; overflow:hidden; padding-top:60%;}
.episode-list .thumb a img {display:block; position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.episode-list .desc .subj {display:block; position:relative; font-size:16px; font-weight:800; margin-bottom:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.episode-list .desc .txt {display:block; opacity:.6; line-height:1.4em;  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.episode-list .desc .date {display:inline-block; vertical-align:middle; margin-top:.5em;}
.episode-list .control {display:inline-block; vertical-align:middle; margin-top:.5em; margin-left:.5em;}
.episode-list .control a {line-height:20px !important; height:20px !important; font-size:11px !important;}
.episode-list .control a + a {margin-left:5px;}

.episode-list .thumb ~ .desc {padding-left:20px;}
.episode-list .thumb ~ .desc a { color:var(--viewer-txt-color);}
.episode-list .thumb ~ .desc .txt {height:2.8em; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; white-space:normal;}


@media all and (max-width:520px) {
	.episode-list .thumb {width:150px;}
	.episode-list .desc .subj {margin-bottom:10px;}
}


/**********************************************
	Character
**********************************************/

.item-character {display:block; position:relative; padding:20px 0;}
.item-character + .item-character:before {content:""; display:block; position:absolute; left:0; right:0; top:0; height:1px; z-index:-1; background:var(--default_color); opacity:.2;}
.character-list {display:table; width:100%; table-layout:fixed;}
.character-list > * {display:table-cell; position:relative; vertical-align:middle;}
.character-list .thumb {width:80px; vertical-align:top;}
.character-list .thumb > * {display:block; position:relative; border-radius:15px; overflow:hidden; padding-top:100%; border-radius:100%; border:1px solid var(--default_color);}
.character-list .thumb > * img {display:block; position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.character-list .thumb ~ .desc {padding-left:20px;}
.character-list .desc .subj {display:block; position:relative; font-size:16px; font-weight:800; margin-bottom:5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.character-list .desc .txt {display:block; opacity:.6; line-height:1.4em;}
.character-list .desc .date {display:inline-block; vertical-align:middle; margin-top:.5em;}
.character-list .control {display:inline-block; vertical-align:middle; margin-left:.5em; line-height:1;}
.character-list .control a {line-height:20px !important; height:20px !important; font-size:11px !important;}
.character-list .control a + a {margin-left:5px;}


/**********************************************
	Review
**********************************************/

.item-review {display:block; position:relative; padding:20px 0;}
.item-review + .item-review:before {content:""; display:block; position:absolute; left:0; right:0; top:0; height:1px; z-index:-1; background:var(--default_color); opacity:.2;}
.review-list {display:table; width:100%; table-layout:fixed;}
.review-list > * {display:table-cell; position:relative; vertical-align:middle;}
.review-list .name {width:80px; vertical-align:top;}
.review-list .name ~ .desc {padding-left:20px;}
.review-list .desc .txt {display:block; opacity:.6; line-height:1.4em;}
.review-list .desc .date {display:inline-block; vertical-align:middle; margin-top:.5em;}
.review-list .control {display:inline-block; vertical-align:middle; margin-top:.5em; margin-left:.5em;}
.review-list .control a {line-height:20px !important; height:20px !important; font-size:11px !important;}
.review-list .control a + a {margin-left:5px;}



/*커스텀 코드*/
.txt{font-family: 'S-CoreDream-4Regular';}
.sub-text{font-family: 'GmarketSansMedium';}
.tabs{font-family: 'GmarketSansMedium';}
.subject {
    font-weight: 800;
    text-align: left;
    font-size: 25px;
    font-family: 'WarhavenB', 'Pretendard JP Variable', sans-serif;
    text-shadow: 0 0 3px #000;
    color: #fff !important;
}

/*ㅅㄷ님 roll20호환*/
.message .avatar{
	position: absolute;
    top: 4px;
    left: 5px;
	}
.avatar img{
	width:100% !important;
	}

.message.you {
 background: -webkit-linear-gradient(left, rgba(255,255,255,.5), rgba(255,255,255,.9));
 background: -o-linear-gradient(left, rgba(255,255,255,.5), rgba(255,255,255,.9));
 background: linear-gradient(to right, rgba(255,255,255,.5), rgba(255,255,255,.9));
 color: #0d0d0d !important;
 font-weight: 600;
}

.message.desc {
	background-color: #eeeeee !important;
  color: #333333 !important;
}

.message{
	position: relative;
	font-family:'Chosunilbo_myungjo' !important;
 background-color: transparent !important;
 color: #eaeaea!important;

	}
.message .spacer {
    background: transparent !important;
	}

.sheet-rolltemplate-coc-1{
	width: 100%;
    position: relative;
}
.__se_tbl_ext{
width: 100% !important;
}

.sheet-template_label{
	width: 20% !important;	
}
.formula, .rolled {
	display: inline;
    color: #0d0d0d !important;
    word-wrap: break-word;
    border: none !important;
}
.dicegrouping{
float: left;
}

.dicon{
	display:inline-block !important;
	}
.diceroll{
	display: inline-block;
	}

	.inlinerollresult{
		color:#616161 !important;
	}

	.sheet-rolltemplate-default{
		color:#333333 !important;
		width:500px;
	}

	.__se_tbl_ext{
		color:#333333 !important;
	}

	.whisper{
		font-family: 'Pretendard-Regular' !important;
        background-color: transparent !important;
        color: #d5d5d5 !important;
		background: -webkit-linear-gradient(left, rgba(104, 104, 104, 0.5), rgba(167, 167, 167, 0.9)) !important;
		background: -o-linear-gradient(left, rgba(104, 104, 104, 0.5), rgba(167, 167, 167, 0.9)) !important;
		background: linear-gradient(to right, rgba(104, 104, 104, 0.5), rgba(167, 167, 167, 0.9)) !important;
	}

/*ㅅㄷ님 끝*/

/*기울임*/
em{font-style:italic !important}

/*코코포리아*/
.inWrap {
	font-family:'Chosunilbo_myungjo';
}

.Uname{
	font-size:17px;
	font-family: 'S-CoreDream-3Light';
	font-weight: bold;
	font-style: normal;
}

.Utext{
	font-size:15px;
}

/*코코포리아 종료*/

/*인장 빛*/
.avatar{
	filter: drop-shadow(0px 0px 2px rgba(255, 255, 255, 0.9));
}

/*표 제목*/
caption {
    display: revert !important;
	color:#eeeeee !important;
}

caption a {
	color:#b31111 !important;
}

/*더블크로스 시트*/
textbox input[type="text"] { 
    width: 100%; 
    height: auto; 
    line-height : normal;
    padding: 0px; 
    font-family: inherit;
    border-bottom: 0px; 
    border-top: 0px;
    border-left: 0px;
    border-right: 0px;
    border-radius: 0;
    outline-style: none;
    -webkit-appearance: none;
    -moz-appearance: none; 
    appearance: none; }

table {
    width: 100%;
    border-top: 1px solid #444444;
    font-size: 1.00em;
}
th, td {
    border-bottom: 1px solid #444444;
    padding: 0px;
}
   
select {
    height: auto;
    line-height : normal;
    padding-left: 13px;
    border: 0px;
    border-radius: 0px;
}

select,
div,
button,
textarea,
span,
input,
img,
label{box-sizing: border-box;}
div{margin: 0px;padding: 0px;}


/* inputs */
input{
    background-color: transparent;
    text-align:center;
    display: inline-block;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
    font-family: '';
    font-size: 1.0em;
    color: rgb(85, 85, 85);
    border: none;
    border-radius: 0;
    box-shadow: none;
    resize:none;
}
input:focus, input:hover, textarea:focus, textarea:hover, select:hover, select:focus{
    background-color: #EFFBFB;
    outline: none;
}

input[type="number"]{text-align: center;}

select {
    width: auto;
    text-align: center;
    text-align-last:center;
    height: 1.3em;
    line-height: 1.0em;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    text-transform: capitalize;
    vertical-align: bottom;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
    font-size: 1.0em;
    font-family: sans-serif;
    border: none;
    border-radius: 0;
    box-shadow: none;
    resize: none;
    background: transparent;
}
textarea.sheet-context{
    background-color: transparent !important;
    text-align:left;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
    font-size: 1.0em;
    border: none;
    border-radius: 0;
    box-shadow: none;
    resize:none;
}
/* ===== PSEUDO TABS ===== */
div.sheet-tabmain,
div.sheet-tabadd,
div.sheet-tabadd2,
div.sheet-tabspell,
div.sheet-tabconf,
div.sheet-tabmain2,
div.sheet-tabadd3,
div.sheet-tabspell2,
div.sheet-tabconf2 {
    display: none !important;
    text-align: center !important;
    width: 100% !important;
    border-top: 1px solid black !important;
    padding-top: 4px !important;
}
input.sheet-tabmain:checked ~ div.sheet-tabmain{
    display: block !important;
}
input.sheet-tabmain2:checked ~ div.sheet-tabmain2{
    display: block !important;
}
input.sheet-tabadd:checked ~ div.sheet-tabadd{
    display: block !important;
}
input.sheet-tabadd2:checked ~ div.sheet-tabadd2{
    display: block !important;
}
input.sheet-tabadd3:checked ~ div.sheet-tabadd3{
    display: block !important;
}
input.sheet-tabspell:checked ~ div.sheet-tabspell{
    display: block !important;
}
input.sheet-tabspell2:checked ~ div.sheet-tabspell2{
    display: block !important;
}
input.sheet-tabconf:checked ~ div.sheet-tabconf{
    display: block !important;
}
input.sheet-tabconf2:checked ~ div.sheet-tabconf2{
    display: block !important;
}
input.sheet-tabmain,
input.sheet-tabadd,
input.sheet-tabadd2,
input.sheet-tabspell,
input.sheet-tabconf,
input.sheet-tabmain2,
input.sheet-tabadd3,
input.sheet-tabspell2,
input.sheet-tabconf2{
    margin: 0;
    margin-top: -4px;
    margin-bottom: -4px;
    padding: 0;
    display: inline-block;
    opacity: 0;
    width: 110px;
    height: 20px;
    z-index: 2;
}
input.sheet-tabmain + span,
input.sheet-tabadd + span,
input.sheet-tabadd2 + span,
input.sheet-tabspell + span,
input.sheet-tabconf + span,
input.sheet-tabmain2 + span,
input.sheet-tabadd3 + span,
input.sheet-tabspell2 + span,
input.sheet-tabconf2 + span{
    color: #666666;
    background-color: #BBBBBB;
    font-size: 0.85em;
    text-align:center;
    display: inline-block;
    width: 110px;
    height: 20px;
    margin: 0;
    margin-left: -110px;
    margin-right: -5px;
    padding:0;
    margin-bottom: -1px;
    text-transform: uppercase;
    border: 1px solid #666666;
    border-bottom-color: black;
    z-index: 1;
}
input.sheet-tabmain:checked + span,
input.sheet-tabadd:checked + span,
input.sheet-tabadd2:checked + span,
input.sheet-tabspell:checked + span,
input.sheet-tabconf:checked + span,
input.sheet-tabmain2:checked + span,
input.sheet-tabadd3:checked + span,
input.sheet-tabspell2:checked + span,
input.sheet-tabconf2:checked + span{
    font-weight: bold;
    color: black;
    background-color: white;
    border-left-color: black;
    border-top-color: black;
    border-right-color: black;
    border-bottom-color: white;
}

/* Dropdowns */
.sheet-hidden {display: none;}
.sheet-hider:not(:checked) + div,
.sheet-hider2:not(:checked) + div {display: none;}
.sheet-hider2:checked + div {display: inline-block;}
/* Dropdowns end */
/*-----sheet-normal radio boxes-----*/
    /* -----Hide actual radio----- */
input.sheet-normal[type="radio"] {
    opacity: 0;
    width: 12px;
    height: 12px;
    position: relative;
    top: 5px;
    left: 6px;
    margin: -10px;
    cursor: pointer;
    z-index: 1;
}

    /* -----Fake radio----- */
input.sheet-normal[type="radio"] + span::before {
    margin-right: 4px;
    line-height: 15px;
    text-align: left;
    display: inline-block;
    vertical-align: middle;
    border: 1px solid black;    
    background:#444444;
    content: "";
    width: 4px;
    height: 15px;
    font-size: 3em;
}  

    /* -----Remove dot from all radios _after_ selected one----- */
input.sheet-normal[type="radio"]:checked ~ input.sheet-normal[type="radio"] + span::before {    
    content: "";
    background: white;
}

    /*------------empty traits-----------*/
input.sheet-zip[type="radio"]:checked + span::before {opacity: 0;}
input.sheet-zip[type="radio"]:hover + span::before {opacity: 1;}
input.sheet-zip[type="radio"] + span::before {
    color:black;
    font-size: 1em;
    content: "✖";
    opacity: 0.25;
    background:white;
}

/* buttons */
[data-groupname=repeating_class-ability] > button.btn.repcontrol_add::after {
    content: "Add";
    background-color:#666666;
    margin-left:-30px;
}

[data-groupname=repeating_class-ability] > button.btn.repcontrol_edit::after {
    content: "Edit";
    background-color:#666666;
    margin-left:-36px;
}

.charsheet .repcontrol_add,
.charsheet .repcontrol_edit,
.charsheet .repcontrol_del {
    display: block;
    background: #666666;
    color: white;
    box-shadow:none;
    font-size:0.9em;
    height:2.2em;
}

/* divs */
div.sheet-col1third{
    display: inline-block;
    vertical-align: top;
    width: 200px;
    max-width: 24%;
    margin: 1px;
    text-align: center;
}

div.sheet-colloislt{
    display: inline-block;
    vertical-align: top;
    width: 525px;
    max-width: 63%;
    margin: 1px;
    text-align: center;
}

div.sheet-colloisrt{
    display: inline-block;
    vertical-align: top;
    width: 300px;
    max-width: 35%;
    margin: 1px;
}

/* rolls */
button[type="roll"].sheet-secroll {
    text-align: center;
    text-decoration: none;
    background:none;
    background-image:none;
    border: none;
    box-shadow: none;
    text-shadow: none;
    padding: inherit;
    margin: inherit;
    color: inherit;
    font-family: inherit;
    font-size: 1em !important;
    line-height: 1em !important;
    font-weight: bold;
    text-transform: inherit;
    text-align: inherit;
    vertical-align: inherit;
    border-radius: none;
}
button[type="compendium"].sheet-secroll:hover,
button[type="roll"].sheet-secroll:hover{
    color: #BE202E;
}
button[type="roll"].sheet-secroll:before{
    content: none !important;
}

/* roll templates */

.sheet-rolltemplate-dx3rdb .sheet-contop {
    width: 235px;
    background-image: url(https://i.imgur.com/PDBIEAy.png);
    background-size: cover; 
    z-index: 7;
}
.sheet-rolltemplate-dx3rdb .sheet-conmid {
    width: 235px;
    background-image: url(https://i.imgur.com/1yNV1E4.png);
    z-index: 6;
}
.sheet-rolltemplate-dx3rdb .sheet-conbottom {
    display: block;
    width: 235px;
    height: 33px;
    margin-top: -15px;
    background-image: url(https://i.imgur.com/kXs8pkE.png);
    background-size: cover;
    z-index: 7;
}
.sheet-rolltemplate-dx3rdb .sheet-rolldivid {
    width: 87%;
    display: block;
    background-image: url(https://i.imgur.com/9Txeo3I.jpg);
    background-repeat: repeat-x; 
    background-position: top center; 
    height: 1px;
    margin: 2px 30px 2px 10px;
}
.sheet-rolltemplate-dx3rdb .sheet-bigname{
    padding: 2px 0px 0px 0px;
    color: black;
    text-align: center;
    vertical-align: center;
    height: 32px;
    border: none;
    font-weight: bold;
    font-size: 1.2em;
}
.sheet-rolltemplate-dx3rdb .sheet-smname {
    font-weight: bold;
    font-size: 0.8em;
    height: 1.0em;
    padding: 18px 0px 3px 0px;
    color: black;
    text-align: center;
}
.sheet-rolltemplate-dx3rdb .sheet-midlt {
    display: inline-block;
    width: 90px;
    height: 1.0em;
    padding: 0px 0px 0px 15px;
    color: black;
    text-align: left;
}
.sheet-rolltemplate-dx3rdb .sheet-midrt {
    display: inline-block;
    width: 110px;
    height: 1.0em;
    padding: 0px 0px 0px 0px;
    color: black;
    text-align: left;
}
.sheet-rolltemplate-dx3rdb .sheet-midcent {
    display: inline-block;
    width: 200px;
    padding: 0px 30px 0px 15px;
    color: black;
    text-align: left;
}

.sheet-rolltemplate-dx3rdb .sheet-ltcat {
    font-size: 0.9em;
    font-weight: normal;
    z-index: 8;
}

.sheet-rolltemplate-dx3rd .inlinerollresult,
.sheet-rolltemplate-dx3rdb .inlinerollresult,
.sheet-rolltemplate-dx3crc .inlinerollresult{
    background-color: transparent;
    border: none;
    padding: 0px 0px;
    font-weight: bold;
    cursor: help;
    font-size: 1.0em;
    padding: 2px;
}
.sheet-rolltemplate-dx3rd .inlinerollresult,
.sheet-rolltemplate-dx3rdb .inlinerollresult,
.sheet-rolltemplate-dx3crc .inlinerollresult {color: #182C4A;}

.sheet-rolltemplate-dx3rd .sheet-resright .inlinerollresult,
.sheet-rolltemplate-dx3crc .sheet-resright .inlinerollresult{
    font-size: 1.6em;
    line-height: 1.45em;
}

.sheet-rolltemplate-dx3rd .sheet-container,
.sheet-rolltemplate-dx3crc .sheet-container{
    width: 200px;
    background-color: #ffffff;
    border: 1px solid;
    padding: 0px;
}


.sheet-rolltemplate-dx3rd .sheet-blacklabel.sheet-top
.sheet-rolltemplate-dx3crc .sheet-blacklabel.sheet-top{
    vertical-align: center;
}

.sheet-rolltemplate-dx3rd .sheet-blacklabel.sheet-top img.sheet-brdright {
    width: 26px;
    height: 36px;
}

.sheet-rolltemplate-dx3rd img.sheet-brdright {
    display: inline-block;
    position: absolute;
    vertical-align: top;
    top: 0px;
}
.sheet-rolltemplate-dx3rd img.sheet-brdright {right: 0px;}

.sheet-rolltemplate-dx3rd .sheet-blacklabel,
.sheet-rolltemplate-dx3crc .sheet-blacklabel{
    display: inline-block;
    vertical-align: top;
    border: none;
    position: relative;
    font-size: 1em;
}
.sheet-rolltemplate-dx3rd .sheet-blacklabel,
.sheet-rolltemplate-dx3crc .sheet-blacklabel{
    background-color: black;
    color: white;
    font-weight: bold;
}

.sheet-rolltemplate-dx3rd div,
.sheet-rolltemplate-dx3crc div {padding: 0px;}
 
.sheet-rolltemplate-dx3rd .sheet-vtop,
.sheet-rolltemplate-dx3crc .sheet-vtop {vertical-align: top;}

.sheet-rolltemplate-dx3rd .sheet-resright {
    display: inline;
    float: right;
    margin-right: 3px;
    clear: both;
	font-size: 1.3em;
	text-transform: uppercase;
	line-height: 1.0em;

} 

.sheet-rolltemplate-dx3rd span,
.sheet-rolltemplate-dx3rdb span,
.sheet-rolltemplate-dx3crc span,
.sheet-rolltemplate-gotemp2 span{
    color: black;
    font-size: 0.9em;
    font-variant: small-caps;
    line-height: 1.3em;
    padding-left: 5px;
    text-align: left;
}
 
.sheet-rolltemplate-dx3rd .sheet-subheader {
    color: #000;
    font-size: 1em;
}
 
.sheet-rolltemplate-dx3rd .sheet-arrow-right,
.sheet-rolltemplate-dx3crc .sheet-arrow-right{
    border-bottom: 2px solid transparent;
    border-left: 180px solid black;
    border-top: 2px solid transparent;
}
 
.sheet-rolltemplate-dx3rd .sheet-tcat,
.sheet-rolltemplate-dx3rdb .sheet-tcat,
.sheet-rolltemplate-dx3crc .sheet-tcat {
    font-size: 0.9em;
    font-weight: bold;
    z-index: 8;
}
 
.sheet-rolltemplate-dx3rd .inlinerollresult,
.sheet-rolltemplate-dx3rdb .inlinerollresult,
.sheet-rolltemplate-dx3crc .inlinerollresult {
    background-color: transparent;
    border: none;
}
 
.sheet-rolltemplate-dx3rd .inlinerollresult.fullcrit,
.sheet-rolltemplate-dx3rdb .inlinerollresult.fullcrit,
.sheet-rolltemplate-dx3crc .inlinerollresult.fullcrit,
.sheet-rolltemplate-gotemp2 .inlinerollresult.fullcrit {
    color: #3FB315;
    border: none;
}
 
.sheet-rolltemplate-dx3rd .inlinerollresult.fullfail,
.sheet-rolltemplate-dx3rdb .inlinerollresult.fullfail,
.sheet-rolltemplate-dx3crc .inlinerollresult.fullfail,
.sheet-rolltemplate-gotemp2 .inlinerollresult.fullfail {
    color: #B31515;
    border: none;
}
 
.sheet-rolltemplate-dx3rd .inlinerollresult.importandivoll,
.sheet-rolltemplate-dx3rdb .inlinerollresult.importandivoll,
.sheet-rolltemplate-dx3crc .inlinerollresult.importandivoll,
.sheet-rolltemplate-gotemp2 .inlinerollresult.importandivoll{
    color: #4A57ED;
    border: none;
}

.sheet-rolltemplate-gotemp .inlinerollresult,
.sheet-rolltemplate-gotemp2 .inlinerollresult{
    background-color: transparent;
    border: none;
    padding: 0px 0px;
    font-weight: bold;
    cursor: help;
    font-size: 1.0em;
    line-height: 1.0em;
}
.sheet-rolltemplate-gotemp .inlinerollresult,
.sheet-rolltemplate-gotemp2 .inlinerollresult{
    background-color: transparent;
    color: #182C4A;}

.sheet-rolltemplate-gotemp .sheet-resright .inlinerollresult,
.sheet-rolltemplate-gotemp2 .sheet-resright .inlinerollresult{
    font-size: 1.6em;
    line-height: 1.45em;
}

.sheet-rolltemplate-gotemp .sheet-container,
.sheet-rolltemplate-gotemp2 .sheet-container{
    background-color: #ffffff;
    width: 200px;
    border: 1px solid;
    padding: 0px;
}

.sheet-rolltemplate-gotemp .sheet-container h1,
.sheet-rolltemplate-gotemp2 .sheet-container h1{
    background-color: black;
    color: #ffffff;
    font-size: 1.2em;
    line-height: 20px;
}

.sheet-rolltemplate-gotemp .sheet-blacklabel.sheet-top,
.sheet-rolltemplate-gotemp2 .sheet-blacklabel.sheet-top{
    height: 36px;
    width: 85%;
    max-width: 85%;
    vertical-align: center;
    padding-right: 27px;
    padding-left: 5px;
}

.sheet-rolltemplate-gotemp .sheet-blacklabel,
.sheet-rolltemplate-gotemp2 .sheet-blacklabel{
    display: inline-block;
    vertical-align: top;
    border: none;
    position: relative;
    font-size: 1em;
    background-color: black;
    color: white;
    font-weight: bold;
}

.sheet-rolltemplate-gotemp .sheet-vtop,
.sheet-rolltemplate-gotemp2 .sheet-vtop {vertical-align: middle;}

.sheet-rolltemplate-gotemp .sheet-resright,
.sheet-rolltemplate-gotemp2 .sheet-resright{
    display: inline;
    float: right;
    margin-right: 3px;
    clear: both;
	font-size: 1.3em;
	text-transform: uppercase;
	line-height: 1.0em;
} 
.sheet-rolltemplate-gotemp .sheet-blacklabel.sheet-top img.sheet-brdright,
.sheet-rolltemplate-gotemp2 .sheet-blacklabel.sheet-top img.sheet-brdright{
    width: 26px;
    height: 36px;
}

.sheet-rolltemplate-gotemp img.sheet-brdright,
.sheet-rolltemplate-gotemp2 img.sheet-brdright{
    display: inline-block;
    position: absolute;
    vertical-align: top;
    top: 0px;
    right: 0px;
}
/*덥크 시트 종료*/

/*목록 커스텀*/
strong.subject{
    font-family: 'GmarketSansMedium';
}

.info-detail{
    font-family:'Chosunilbo_myungjo';
}

.cast-detail{
    font-family:'Pretendard';
}

.date-detail{
    font-family:'Pretendard';
}

.hash_tag{
    font-family:'Galmuri7';
}

/*emas 커스텀 시도*/
.emote{
    background-color:#333333 !important;
    color:#eeeeee !important;
}

.userscript-showtip{
    color:#eeeeee !important;
}

.inlinerollresult{
    background-color:#333333 !important;
    color:#eeeeee !important;
    border: 2px solid #333333 !important;
}


/*코코포*/
.tab01{background: #1f1e2280 !important;}

.tab02{background:#1f1e2280 !important;}

/*로그*/
.subj{
font-weight: 800;
    text-align: left;
    font-size: 40px;
    font-family: 'WarhavenB','Pretendard JP Variable',sans-serif;
    text-shadow: 0 0 3px #000;
    color:#fff !important;}

    .roll20-log a{color:#333}

.campaignViewer{border-radius: 16px;}

.episode-list .thumb img:hover
{transform:scale(1.2);  transition: transform .35s;}


/*.episode-list .thumb img:hover
{
    animation-duration: 10s;
    animation-fill-mode: forwards;
    animation-timing-function: linear;
    animation-name: flow;
}*/

@keyframes flow {
    from {
        transform: translateY(0); /* 시작 지점에서의 위치 */
    }
    to {
        transform: translateY(-50%); /* 애니메이션이 종료될 때까지 이동할 위치 */
    }
}

.campaign-list-slider{background: rgba(0, 0, 0, 0.564);
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.25);
    margin: 10px;
    border-radius: 9px;
    backdrop-filter:blur(10px);}

.category-title{display: flex;
    border-radius: 5px 5px 0px 0px;
    padding: 0px 8px;
    background: linear-gradient(rgb(8, 8, 8), rgb(24, 24, 24));
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.01);
    position: relative;
    z-index: 1;
    height: 30px;
    line-height: 26px;
    color:#007BFF;
    font-family: 'Galmuri11';
    font-size: 15px;}

.slider{padding:13px;}

.empty-list{color:#007BFF;}

.swiper-wrapper{display: flex;
    /* overflow: hidden; */
}
    

.swiper-container {
    overflow: hidden;
}


    .Utext{line-height:200%; }


code{font-family: 'Chosunilbo_myungjo';
    color: #f50000;}



    .subject {
        font-weight: 800;
        text-align: left;
        font-size: 25px;
        font-family: 'SEBANG_Gothic_Bold', 'Pretendard JP Variable', sans-serif;
        text-shadow: 0 0 3px #000;
        color: #fff !important;
    }


/*커스텀*/
.swiper-slide .frame:hover {border: 2px solid #fff; box-shadow: 0 10px 30px rgba(255, 255, 255, 0.637);}

.swiper-slide:hover .has-img {animation:slide 20s infinite linear;background-position: left center; }
@keyframes slide {
	50% { background-position: right center; }
}

.swiper-slide .frame:hover {transition:all ease 1.2s; width:250px; height:385px!important; /*z-index: 999;*/ margin-left:-7%;}

.cover .subject{font-family:'WarhavenB', 'Pretendard JP Variable', sans-serif; font-size:24px !important;}


/*BGM*/

.bgm-player_2 {
	display: flex;
	justify-content: left;
	gap: 5px;
    margin-top:5px;
}

.bgm-player_2 a {color:white;}

.bgm_btn{
	background-color: #333333;
    border-radius: 2em;
    display: inline-block;
    padding: 0px 12px !important;
    border: 1px solid #fff;
	}


#header {z-index: 5;}
.pg_wrap {
    display: block;
    position: relative;
    text-align: center;
    padding: 20px 0;
}

/* ✅ 수정됨: 타자 효과 */
.typing-text {
    font-family: monospace;
    white-space: nowrap;
    overflow: hidden;
    animation: typing 1.5s steps(20, end);
}

/* ✅ 수정됨: 사라지는 페이드 아웃 효과 */
.fade-out {
    animation: fadeout 1s ease forwards;
}

@keyframes typing {
    from { width: 0 }
    to { width: 12em }
}

@keyframes fadeout {
    from { opacity: 1 }
    to { opacity: 0 }
}

/*프사 키울래*/
.msg_container{
width:60px !important;
height: 60px !important;
}

.msg_container img{
width:60px !important;
height: 60px !important;
}