@charset "utf-8";


#mainArea,
.pc #mainArea,
#mainLeft,
.timeline_wrap {background: #e9ebee;}
.wrap-timeline {
	width: 100%;
	max-width: 550px;
    margin: auto;
    padding-bottom: 100px;
}
.mm .vcm.vcm {font-size: 14px;}
.mm #mainRight {background: #e9ebee;}
#tl-t-write {
	margin-bottom: 40px;
}
#timeline .modal {max-width: 90%;}

#timeline .btns input[type=submit] {margin:0;}
.tl-name {
	padding: 0 0 5px;
	color: #365899;
	font-size: 13px;
	font-weight: bold;
}
.viewTable.tl-content {
	position: relative;
	margin: 15px 0;
	padding: 10px;
	border: 1px solid #d0d0d0;
	border-radius: 2px;
	box-sizing: border-box;
	background: #FFF;
}
.tl-content input[type='checkbox'] {
	position: absolute;
	top: 0;
	left: -15px;
}
.tl-content .tl-menu.tl-menu {
	left: auto;
	top: 10px;
	right: 10px;
	width: 20px;
	height: 20px;
	margin: 0;
    color: #CCC;
    font-size: 10px;
    line-height: 20px !important;
    text-align: center;
    border: none;
    background: transparent;
    -webkit-appearance: none;
}
#timeline .btn {background: #FFF;}
#timeline .btns a {
    min-width: 80px;
    margin: 0;
	color: #FFF !important;
	background: #4267b2;
	border: 1px solid #4267b2;
	text-shadow: none;
	text-align: center;
	line-height: 2;
}
.tl-side {
    position: absolute;
    z-index: 10;
    top: 30px;
    right: 10px;
    min-width: 50px;
    padding: 5px;
    text-align: center;
    background: #FFF;
    border: 1px solid #CCC;
}
.tl-side a {
	display: block;
	color: #1d2129 !important;
	font-size: 14px;
	background: transparent;
}
a.tl-modify,
a.tl-delete,
.tl-side,
.write_dom {display: none;}
.adm .tl-modify,
.adm .tl-delete,
.mine .tl-modify,
.mine .tl-delete {display: block;}
.is-logged .write_dom,
.tl-menu:checked + .tl-side,
.mine .tl-menu,
.adm .tl-menu {display: block;}

.tl-foot {
    padding-top: 10px;
    border-top: 1px solid #e5e5e5;
}
.tl_vote2_wrap {
    padding: 10px 0;
}
.tl_vote2 {
    padding: 10px 0;
    font-size: 12px;
}
.tl_vote2:before {
    display: inline-block;
    color: #FFF;
    width: 16px;
    height: 16px;
    line-height: 16px;
    margin-right: 6px;
    text-align: center;
    font-size: 9px;
    background: #558dff;
    border-radius: 100%;
    vertical-align: middle;
}
.tl_vote2:after {content:'명';}
.tl_vote2:empty {display: none;}
.dda_list {
    margin: 10px auto;
    width: 240px;
    overflow-x: hidden;
    padding: 10px 0;
}
.dda_list.is-long {
    max-height: 267px;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    box-shadow: inset 0 0 15px rgba(0,0,0,.2);
    border-radius: 6px;
}
.dda_list li {line-height: 2;white-space: nowrap;}

.tl-content .voyarea,
.tl-content .iam-cmt {display: none !important;}
.cmtfold {
    display: block;
    width: 0;
    height: 0;
    opacity: 0;
    pointer-events: none;
}
.tl-content.is-empty .voyarea,
.cmtfold:checked + .tl-content .voyarea {
    display: table !important;
    padding: 10px;
}
.cmtfold:checked + .tl-content .iam-cmt {display: block !important;}
.cmtfold:checked + .tl-content .cmtWriteTable {margin-bottom: 10px;}

.is-portrait {
	position: relative;
	height: 300px;
	background: #F2F2F2;
}
img.is-portrait { height: auto; }
.is-portrait img {
	display: block;
	width: auto;
	height: 100%;
	margin: auto;
}
.admin_only a.btn {
    color: #FFF !important;
}
.is-longlong {display: none;}
.show-more {background: none !important;cursor: pointer;}
.limit-timeline {
    padding: 10px 20px;
    font-size: 12px;
    text-align: center;
    background: #F8F8F8;
    border: 1px solid #CCC;
}
.tl-section {
	background: #FFF;
	border-radius: 3px;
}
.tl-middle {
	position: relative;
	border-bottom: 1px solid #dddfe2;
}
.tl-middle:before {
	content: '';
	position: absolute;
	top: 0;
	left: 12px;
	width: calc(100% - 24px);
	border-top: 1px solid #dddfe2;
}
#timeline .voyarea2 {
    height: 40px;
    padding: 13px 12px 4px;
}
.tl-main {
	position: relative;
	z-index: 10;
}
.tl-bg {
	-webkit-transition: all .5s;
	transition: all .5s;
}
.tl-top {
	position: relative;
	z-index: 10;
	height: 36px;
	overflow: hidden;
}


/* hongchun from setup.php */

a[href^='admin_setup'] {
    position: absolute;
    right: 30px;
    top: 20px;
}
.mm a[href^='admin_setup'] {right: 10px; top: 54px;}
.is-blink {
    -webkit-animation: blink 1s;
    -webkit-animation-delay: 1s;
    animation: blink 1s;
    animation-delay: 1s;
}
@-webkit-keyframes blink {
    0%,100% {outline:3px dashed rgba(255,0,0,0);}
    50% {outline:3px dashed rgba(255,0,0,1);}
}
@keyframes blink {
    0%,100% {outline:3px dashed rgba(255,0,0,0);}
    50% {outline:3px dashed rgba(255,0,0,1);}
}
#heightChecker {
    display: none;
    position: absolute;
    left: 0;
    top: 100px;
    box-sizing: border-box;
    border: 1px solid red;
    white-space:pre-wrap;
    word-break:keep-all;
    word-wrap:break-word;
    writing-mode:horizontal-tb;
}
@font-face {
  font-family: 'Nanum Myeongjo';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/NanumMyeongjo-Regular.eot');
  src: url('/fonts/NanumMyeongjo-Regular.eot?#iefix') format('embedded-opentype'),
       url('/fonts/NanumMyeongjo-Regular.woff2') format('woff2'),
       url('/fonts/NanumMyeongjo-Regular.woff') format('woff'),
       url('/fonts/NanumMyeongjo-Regular.ttf') format('truetype');
}
@font-face {
    font-family: 'BM JUA';
    font-weight: normal;
    font-style: normal;
    src: url('/fonts/BM-JUA.eot');
    src: url('/fonts/BM-JUA.eot?#iefix') format('embedded-opentype'),
        url('/fonts/BM-JUA.woff') format('woff'),
        url('/fonts/BM-JUA.svg#BM-JUA') format('svg'),
        url('/fonts/BM-JUA.ttf') format('truetype');
}
@font-face {
    font-family: 'BM HANNA';
    font-weight: normal;
    font-style: normal;
    src: url('/fonts/BM-HANNA.eot');
    src: url('/fonts/BM-HANNA.eot?#iefix') format('embedded-opentype'),
            url('/fonts/BM-HANNA.woff') format('woff'),
            url('/fonts/BM-HANNA.svg#BM-HANNA') format('svg'),
            url('/fonts/BM-HANNA.ttf') format('truetype');
}
.font1,
.font1 textarea,
.font1 input {font-family: 'Nanum Myeongjo';color:#000;font-weight: bold;}
.font2,
.font2 textarea,
.font2 input {font-family: 'BM HANNA';color:#666;}
.font3,
.font3 textarea,
.font3 input {font-family: 'BM JUA';color:#666;}
#tl-textarea,
.tl-memo {text-align: center;}
.tl-memo.tl-memo {
    padding: 3em .4em;
}
#tl-textarea,
.tl-memo .articleArea {
    font-size: 2.5em;
    line-height: 1.4;
}
.mm #tl-textarea,
.mm .tl-memo .articleArea {font-size: 1.7em;}
#tl-textarea::-webkit-input-placeholder,
#tl-textarea::-moz-placeholder,
#tl-textarea:-ms-input-placeholder,
#tl-textarea:-moz-placeholder {
    font-size: 1em;
    text-align: left;
}
.tl-middle2 {
    border: none;
    padding: 10px 20px;
    font-size: 1.5em;
}
.mm .tl-middle2 {font-size: 1em;}
.tl-middle2 input {
    display: inline-block;
    /* vertical-align: middle; */
    margin-right: 3px;
}
.tl-middle2 label {
    display: inline-block;
    /* vertical-align: middle; */
    font-style: normal;
    margin-right: 15px;
}
.hong-sub.hong-sub {
    position: relative;
    width: 100%;
    height: auto;
    border: none;
    margin: 0;
    padding: 13px 12px;
    font-size: 2em;
    line-height: 1.4;
    text-align: center;
    border-top: 1px solid #dddfe2;
    box-shadow: none;
    border-radius: 0;
    box-sizing: border-box;
    -webkit-appearance: none;
}
.mm .hong-sub.hong-sub {font-size: 1em;}
.hong-sub2.hong-sub2 {
    font-size: 2em;
    padding-top: 1em;
}
.mm .hong-sub2.hong-sub2 {font-size: 1.2em;}
.hong-sub2:before {content: '- ';}
.hong-sub2:after {content: ' -';}
.hide {display: none !important;}
.is-bbs-hongchun .cmtfold {
    position: absolute;
    pointer-events: none;
}

/* 타임라인 타이틀 스타일링 */
.bbsTitleBox {
	max-width: 550px;
    margin: auto;
}