@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Karla:wght@300;400;700&family=Noto+Sans+KR:wght@400;500;700&display=swap');

/* css 공통 시작*/
html, body {width: 100%;height: 100%;margin: 0; min-width:1200px; }
body, body * {box-sizing: border-box; font-family: 'Karla', sans-serif; font-size:18px; }
.template { display:none; }
body.bodyLock { overflow:hidden; }

ul, li { list-style:none; margin:0; padding:0; }
h1, h2, h3, h4, h5 { margin:0; padding:0; margin-bottom: 0.8em;}

a:link,
a:visited,
a:active {  text-decoration: none;color: inherit;}

.flow>*,
.split2>*,
.split3>*,
.split4>*,
.split5>* { float:left; margin-left:2%; margin-bottom:2%; display: block;position: relative; }
.split2>*:nth-child(2n+1),
.split3>*:nth-child(3n+1),
.split4>*:nth-child(4n+1),
.split5>*:nth-child(5n+1) { margin-left:0; }
.split2>* { width:49%; }
.split3>* { width: calc( (100% - 4%)/3 ); }
.split4>* {width: calc( (100% - 6% - 10px)/4 );}
.split5>* { width: calc( (100% - 8%)/5 ); }
.flow:after,
.split2:after,
.split3:after,
.split4:after,
.split5:after { content:''; clear:both; display:block; }

.pic5x2,.pic5x4,.pic4x3,.pic3x4 { position:relative; overflow: hidden;}
.pic4x3 { width:100%; padding-top:75%; }
.pic3x4 { width:100%; padding-top:125%;  }
.pic5x4 {  width:100%; padding-top:83.333%;  }
.pic5x2 {  width:100%; padding-top:38.7%;  }
.pic5x2>*,.pic5x4>*,.pic4x3>*,.pic3x4>* {position:absolute;top:0;left:0;width:100%;height:100%;object-fit: cover;/*object-position: left;*/}

.left { text-align: left; }
.center { text-align: center; }
.right { text-align: right; }
.hide { display:none; }

input,
textarea { outline:none; }

*::placeholder { color:#bbb; }

*[onclick], [go] { cursor:pointer; }

.rotate90 { transform: rotate(90deg);}

.btnClose {width: 1.5em;height: 1.5em;/* background-color:Red; */position: absolute;top: 1em;right: 1em;cursor: pointer;}
.btnClose:before, .btnClose:after {content:'';width: 100%;height: 0.15em;background-color: black;position: absolute;top: 0.7em;transform: rotate(45deg);border-radius: 0.5em;}
.btnClose:before {transform: rotate(-45deg);}
.btnClose:after { }
.btnClose:hover { transform:rotate(45000deg); transition: all cubic-bezier(0.58, 0.45, 0.6, 0.65) 40s 0s; }

.btnMax {position: absolute;top: -2em;right: 2.8em;cursor: pointer;}
.btnMax .note-icon-arrows-alt::before { font-size:1.3em;content: '\ea0c';}

.required:before { content:'*'; color:red; }
.requiredDesc { position:relative; }
.requiredDesc:after { content:' ( * ) Required'; font-size:13px; position:absolute; right:0; bottom:0.5em; color:red; }

.material-icons {vertical-align: middle;}

/* css 공통 종료*/

h2 {font-size: 1.7em;}
h3 {font-size: 1.35em;}
h4 {font-size: 1em;}

.layerFrame { position:relative; padding-bottom: 2em;padding-top: 2em;}
.layerFrame>* { width:1200px; margin:0 auto; }

.overTitle h4+span { font-size:0.8em; color:#979797; }
.overTitle { position:absolute; opacity:0;top: auto;bottom: -4em;width: 100%;height: 6em;background-color: rgba(34,34,34,0.9);color: white;padding: 0.8em;bottom: 0;opacity: 1;}
.overTitle .more { position:absolute; right:1em; bottom: 1.6em; cursor:pointer; }
.overTitle .more:after { content: ' >'; }
.overTitleTrigger { overflow: hidden; }
.overTitleTrigger.active .overTitle,
.overTitleTrigger:hover .overTitle { display:block; transition:0.5s all; opacity:1; top:auto; bottom:0; font-size: 0.9em;}

.titleView { height:5em; padding:1em; font-weight: 800;}
.titleView>* { display:block; line-height:1.2em; }

#HEADER_TOP { padding:0; overflow: visible; z-index:5;}
.headerTop {overflow: visible;text-align: right;height: 4.5em;padding-top: 1.2em;}
.headerTop:after { content:''; clear:both; display:block; }
.headerTop .flow { display:inline-block; }
.headerTop .flow>li { position:relative; margin: 0;padding: 0.5em 1em;cursor: pointer;}
.headerTop .flow>li + li:after { content:'|'; position:absolute; left:0; font-weight: 800;}
.selectLanguage { float:left; position: relative;display: block;overflow: visible;}
.selectLanguage button {   background-color: white; border: 1px solid gray; border-radius: 20px;padding: 0 1em 0 2em; cursor: pointer;}
.selectLanguage button span { padding: 0 1em; line-height: 2em; display: inline-block;}
.selectLanguage button>img:nth-child(1) { position: absolute; top: 0.4em;left: 1em;}
.selectLanguage ul { display:none; opacity: 0;height: 1px;}
.selectLanguage.active ul,
.selectLanguage:hover ul,
.selectLanguage:hover ul:hover { position: absolute; background: rgba(42,42,42,0.9); z-index: 10; top: 2.1em; width: 100%; left: 0; border-radius: 1em; color: #fff; padding: 1em 0em;   -webkit-transition: .3s all; transition: .3s all; display: block;text-align: left;opacity: 1;overflow: hidden;height: auto;transition: 0.5s all;color: #e0e0e0;box-shadow: 5px 5px 8px 4px rgba(120,120,120,0.4);}
.selectLanguage ul li {  }
.selectLanguage ul li.active,
.selectLanguage ul li:hover { background-color: #cfcfcf; color: black;}
.selectLanguage ul li a { /* background-color:red; */ width: 100%;display: block;padding: 0 2em;line-height: 2.2em;}
.headerMenu {  }

.imgeSlide {width: 100%;/* white-space:nowrap; *//* overflow: hidden; */display: block;position: relative;flex-direction: row;}
ul.imgeSlide { height: 480px; }
.imgeSlide ul>li,
ul.imgeSlide>li {  margin: 0;width: 100%;height: 100%;display: inline-block;float: none;background-repeat: no-repeat;background-clip: content-box;cursor: pointer;}
.imgeSlide ul>li.button,
ul.imgeSlide>li.button { position:absolute; top: 0; left:0; width:100%; height:100%; }
.imgeSlide ul>li.button>div,
ul.imgeSlide>li.button>div { max-width:1200px; margin: 0 auto; position: relative;margin-top: 12em;display: block;}
.imgeSlide ul>li>div.image,
ul.imgeSlide>li>div.image { max-width:1200px; max-width: none;height: 100%;margin: 0 auto; /* display: flex; */ /* -webkit-box-align: center; */ -ms-flex-align: center; /* align-items: center; *//* opacity: 1; */overflow: hidden;background-repeat: no-repeat; background-position: center; background-size: cover;}
.imgeSlide ul>li>div img,
ul.imgeSlide>li>div img {  max-width: 100%;vertical-align: middle;opacity: 1;image-rendering: -moz-crisp-edges; image-rendering: -o-crisp-edges; image-rendering: -webkit-optimize-contrast;  image-rendering: crisp-edges; -ms-interpolation-mode: nearest-neighbor;}
.imgeSlide .slideLeft,
.imgeSlide .slideRight { width: 60px;height: 60px;background: rgb(69,58,72);opacity: 0.9;cursor: pointer;border-radius: 100%;display: block;color: white;text-align: center;line-height: 60px;font-size: 2em;}
ul.imgeSlide>li .slideLeft,
ul.imgeSlide>li .slideRight { width: 60px;height: 60px;background: rgb(69,58,72);opacity: 0.9;cursor: pointer;border-radius: 100%;display: block;color: white;text-align: center;line-height: 60px;font-size: 2em;}
.imgeSlide .slideLeft { position: absolute;left: 1%;top: 42%; }
ul.imgeSlide>li .slideLeft { position: absolute;left: 1%;top: 0; }
.imgeSlide .slideRight { position: absolute;right: 1%;top: 42%; }
ul.imgeSlide>li .slideRight {  position: absolute;right: 1%;top: 0;}
.imgeSlide .background,
ul.imgeSlide>li>.background {  filter: blur(10px); width: 100%; height: 100%; z-index: -1; position: absolute; z-index:-1; opacity:0.8; }
.imgeSlide .background:after,
ul.imgeSlide>li>.background:after { content:''; position:absolute; top:0; left:0; width:100%;height:100%;background-color:white; opacity:0.7 }

.input-form {}
.input-form>* {height: 2.1em;border: 1px solid #000000;border-radius: 0.2em;line-height: 2em;padding-left: 0.6em;padding-right: 0.6em;text-align: left;display: inline-block;min-width: 10em;position: relative;cursor: pointer;}
.input-form>* + * { margin-left:1em; }
.input-form .tag-select { border: none;padding: 0;}
.input-form .tag-select:after { content:'∨'; color:#666; position:absolute; right:0.5em; }
.input-form .tag-select>ul { position:absolute;top: calc( 100% + 1px );left: 0;width: 100%;z-index: 5;background-color: rgba(255,255,255,0.8);/* display:none; */ height:1px;overflow: hidden;}
.input-form .tag-select>ul>* {padding: 0 1em;white-space: nowrap;}
.input-form .tag-select>ul>*:hover { background:black; color:white;font-weight:800; }
.input-form .tag-select:hover>ul { opacity:1; height:auto; border: 1px solid #000000; border-top:0; transition:5.5s all; }
.input-form .tag-select>input {   background: none;padding: 0 0.6em;width: 100%;background-color: white;}
.input-form input {height: 2.1em; border: 1px solid black; border-radius: 0.2em; line-height: 2em; padding-left: 0.6em; padding-right: 0.6em; text-align: left; display: inline-block; }
.input-form>input { border:0; border-bottom:1px solid black;  border-radius: 0;background: none;cursor: text;}
.input-form>.search {  }
.input-form>.search:after { content:''; position:absolute; top:0; left:0; width:100px; height:100px; background-color:red; }
.input-form>img { min-width: auto;border-width:0;border-bottom-width:1px;border-radius:0; vertical-align: bottom;padding: 0;max-width: 28px;max-height: 28px;}
.input-form>* + img { margin-left: 0em; }
.tag-select>* {  cursor: pointer;}
.tag-select.selected {}

h2 { position:relative; }
h2>.input-form {position:absolute; bottom:0; right:0;}

.pagination { text-align:center; display: flex; flex-wrap: nowrap;align-items: center;justify-content: center;border-top: 1px solid black;margin-top: 2em;padding-top: 2em;}
.pagination>* { font-size:1.2em; color: #aaa; min-width:2.2em; cursor: pointer;}
.pagination>*.active { color:black; }

#HEADER {background-color:#122239;color:white;padding: 0;z-index: 2;}
#HEADER ul { display:inline-block; padding-top: 1.2em;}
#HEADER ul a { font-size:22px; min-width: 5em; display: block;text-align: center;}
#HEADER ul li { margin-left:1em;line-height: 4em;margin-bottom: 0;min-width: 8em;}
#HEADER ul>li + li {/* padding-left:1em; *//* margin-left: 0; */}
#HEADER ul li:first-child { margin-left:0; }
.headerMenu>img { vertical-align: top;cursor: pointer;max-width: 160px;}

#HEADER ul li ul {border: 1px solid rgba(128,128,128,0.5);/* background-color: rgba(128,128,128,0.7); */position: absolute;padding-top: 0;margin-left: -1em;display:none;margin-top: -4em;padding-top: 4em;border-radius: 0.5em;box-shadow: 4px 5px 12px 5px rgb(128 128 128 / 40%);max-width: 10em;}
#HEADER ul li ul li {line-height: 3em;margin: 0;padding: 0 0.8em;background-color: rgba(128,128,128,0.7);white-space: nowrap;width: 16em;background-color: #a0a0a0;}
#HEADER ul li ul li:lang(id) {width: 34em;}
#HEADER ul li ul li:lang(de), #HEADER ul li ul li:lang(vn) {width: 24em;}
#HEADER ul li ul li:lang(es), #HEADER ul li ul li:lang(fr), #HEADER ul li ul li:lang(ru), #HEADER ul li ul li:lang(ja) {width: 20em;}
#HEADER ul li ul li + li { border-top:1px solid #808080;  }
#HEADER ul li:hover ul,
#HEADER ul li ul:hover { display:block; z-index:10;}
#HEADER ul li ul li:hover { background-color: white; color:black; }
#HEADER ul li ul li:first-child {/* border-top: 1px solid #808080; */border-radius: 0em 0.5em 0em 0em;}

#PROMOTION_MAIN {padding: 0;}
#PROMOTION_MAIN>div {position:absolute;/*  top:0; left:0; */width:100%;height:100%;max-width: 1200px;left: calc( (100% - 1200px)/2 );}
#PROMOTION_MAIN.slide2022 {/* max-width:1200px; */height: 320px;margin:0 auto;background-color: whitesmoke;/* background-color: red; */}
#PROMOTION_MAIN.slide2022 ul.imgeSlide {height: auto;max-width: 1200px;}
#PROMOTION_MAIN.slide2022 ul.imgeSlide .image {max-width:1200px;padding-top: 25%;position: relative;}
/* #PROMOTION_MAIN.slide2022 div.imgeSlide .image {padding-top: 25%;position: relative;} */
#PROMOTION_MAIN.slide2022 .swiper-slide { position:relative; }
#PROMOTION_MAIN.slide2022 .swiper-slide a {width: 100%;height: 100%;position: absolute;top: 0;left: 0;padding-top: 1em;}
#PROMOTION_MAIN.slide2022 img {width: 100%;height: 100%;object-fit: cover;}
#PROMOTION_MAIN.slide2022 .btnPrev, #PROMOTION_MAIN.slide2022 .btnNext {background: rgb(69,58,72);opacity: 0.5;cursor: pointer;border-radius: 100%;display: block;color: white;text-align: center;line-height: 60px;font-size: 2em;width: 2em;height: 2em;display: none;}
#PROMOTION_MAIN.slide2022 .btnPrev {top: 50%;left: -10%;}
#PROMOTION_MAIN.slide2022 .btnNext {top: 50%;right: -10%;}

#CONTENT_TOPIC { background-color:#f5f5f5; }
#CONTENT_TOPIC .partTop5 { box-shadow: none;}
#CONTENT_TOPIC .partTop5 .progList { box-shadow:none; position: absolute;right: 0;top: 0;font-size: 1em;font-weight: normal;color: #979797;display: block;background: none;}
#CONTENT_TOPIC .partTop5 .progList li {display: inline-block;}
#CONTENT_TOPIC .partTop5 .progList li + li {border: 0;margin: 0;}
#CONTENT_TOPIC .partTop5 .progList li + li:before { content:'|'; color:black;  margin-left: 0em;margin-right: 1em;}
#CONTENT_TOPIC .partTop5 h3 {}
#CONTENT_TOPIC .partTop5 h3 ul {}
#CONTENT_TOPIC .partTop5 h3 span { font-size:0.5em; font-weight: 200; margin-left: 1em;}
#CONTENT_TOPIC .partTop5 ul {padding: 0 1em;box-shadow: 5px 5px 8px 1px lightgrey;background-color: white;}
#CONTENT_TOPIC .partTop5 ul li {padding: 0.5em 0;}
#CONTENT_TOPIC .partTop5 ul li.active { color:black; }
#CONTENT_TOPIC .partTop5 ul li span { line-height: 2.86em; font-size: 1.35em; margin-right:1em; display:inline-block; }
#CONTENT_TOPIC .partTop5 ul li img { vertical-align:bottom; margin-right:1em; position: relative;top: -0.5em;}
#CONTENT_TOPIC .partTop5 ul li span.name { font-size:1.1em;  }
#CONTENT_TOPIC .partTop5 ul li span.count {position: absolute;right: 0;}
#CONTENT_TOPIC .partTop5 ul li span span { font-size:0.7em; margin: 0;}
#CONTENT_TOPIC .partTop5 ul li span span:before { content:''; background-repeat: no-repeat;width: 1.2em;height: 1.5em;/* background-color: red; */background-position-y: bottom;background-size: 100%;display: inline-block;margin-right: 0.3em;color: black;margin-left: 0.3em;position: relative;bottom: -0.1em;}
#CONTENT_TOPIC .partTop5 ul li span span.like:before { background-image:url(../images/like_icon.png); }
#CONTENT_TOPIC .partTop5 ul li span span.view:before { background-image:url(../images/view_icon.png); }
#CONTENT_TOPIC .partTop5 ul li span span.like {margin-right: 0.3em;}
#CONTENT_TOPIC .partTop5 ul li span span.view {}
#CONTENT_TOPIC .partTop5 ul li + li { border-top:1px solid #c8c8c8; }
#CONTENT_TOPIC .partList { box-shadow: none;}
#CONTENT_TOPIC .partList ul>li { overflow:hidden; box-shadow: 5px 5px 8px 1px lightgrey;margin-left: 0;}
#CONTENT_TOPIC ul>li { overflow:hidden;cursor: pointer;height: 460px;}
#CONTENT_TOPIC ul>li.active .overTitle,
#CONTENT_TOPIC ul>li:hover .overTitle { display:block; transition:0.5s all; opacity:1; top:auto; bottom:0; }
#CONTENT_TOPIC .partList .titleView { position:absolute; bottom:0; width:100%; background-color:white; height:auto; padding: 0.8em;}
#CONTENT_TOPIC .partList .titleView img {display: inline-block;vertical-align: bottom;margin-right: 1em;}
#CONTENT_TOPIC .partList .titleView span { display:inline-block; font-weight: normal;}
#CONTENT_TOPIC ul>li .pic4x3 {padding-top: 0;box-sizing: border-box;}
#CONTENT_TOPIC ul>li .pic4x3>img { position: static;top: auto;object-fit: none;width: 100%;height: auto;vertical-align: bottom;}
#CONTENT_TOPIC .contestTopic .overTitle {height: 5em;}

#COMMUNITY { background-color:#f5f5f5; }
#COMMUNITY ul>li { box-shadow: 5px 5px 8px 1px lightgrey; cursor: pointer;}
#COMMUNITY .titleView .name { color:#979797; font-size:0.8em; margin-top:0.5em }

#NOTICE {overflow: hidden;}
#NOTICE ul>li { box-shadow: 5px 5px 8px 1px lightgrey; overflow:hidden; cursor: pointer;}
#NOTICE ul>li.active .overTitle,
#NOTICE ul>li:hover .overTitle { display:block; transition:0.5s all; opacity:1; top:auto; bottom:0; font-size: 0.9em;}
#NOTICE ul>li .overTitle span { color: #979797; font-size: 0.9em;display: block;margin-bottom: 0.5em;}

#FOOTER { background-color:#122239; color:white; padding:1em; clear:both; font-family: 'Noto Sans KR', sans-serif; }
#FOOTER p { font-size:12px; line-height:3em; }
#FOOTER .footer_part { position:relative; width:100%; max-width: 1200px; padding-bottom: 1em; margin:0 auto; clear:both; }
#FOOTER .footer_part hr { margin-bottom:1.5em; clear:both; }
#FOOTER .banner { margin-top:1.7em; margin-bottom:1em; float:left; }
#FOOTER .sitemap .relatedSite {width: 14em;  text-align:left; padding-left:1em; border:none; border-radius:5px; float:right;font-family: 'Noto Sans KR', sans-serif;background-color: #F5F5F5;color: #122239;position: relative;text-align: left;padding-right: 1em;}
#FOOTER .sitemap .relatedSite:hover { border-radius: 0 0 5px 5px; }
#FOOTER .sitemap div { /* display:none; */ }
#FOOTER .sitemap .relatedSite img { float:right; margin-right: 0.5em; margin-top: 1.2em; margin-left: 1em;}
#FOOTER .sitemap:after { content:''; clear:both; display:block; }
#FOOTER .sitemap .relatedSite ul {position: absolute;background-color: whitesmoke;border: 1px solid #ccc;bottom: 3em;left: 0;width: 100%;/* padding-bottom: 1em; */border-radius: 5px 5px 0 0;/* border-bottom: 0; *//* display: none; */height: 1px;opacity: 0;/* transition: all cubic-bezier(0.17, 0.98, 0.97, 0.38) 2s 5s; */overflow: hidden;}
#FOOTER .sitemap .relatedSite span { line-height:3em; }
#FOOTER .sitemap .relatedSite ul li {line-height: 3em;padding: 0 1em;text-align: center;background-color: white;}
#FOOTER .sitemap .relatedSite ul li:hover { background-color:#122239; color:white; }
#FOOTER .sitemap .relatedSite ul:after { content:''; /* height:1px; */ background-color: #ccc; position:absolute; bottom: 0.6em;left: 5%;width: 90%;}
#FOOTER .sitemap .relatedSite:hover ul,
#FOOTER .sitemap .relatedSite ul:hover {  opacity:1; /*display:block;*/ height:6em; transition: all cubic-bezier(0.68, -0.55, 0.27, 1.55) 0.5s 0s;}

/* #FOOTER .sitemap:hover div,
#FOOTER .sitemap:hover div:hover { position: absolute; background: rgba(42,42,42,0.9); z-index: 10; top: 2.2em; width: 100%; left: 0; border-radius: 1em; color: #fff; padding: 1em 0em;   -webkit-transition: .3s all; transition: .3s all; display: block;text-align: left;opacity: 1;overflow: hidden;height: auto;transition: 0.5s all;color: #e0e0e0;box-shadow: 5px 5px 8px 4px rgba(120,120,120,0.4);}
#FOOTER .sitemap ul li { line-height:2em; padding: 0 2em;}
#FOOTER .sitemap ul li.active,
#FOOTER .sitemap ul li:hover { background-color: #cfcfcf; color: black;} */


#FOOTER .footer_part>div { position:relative; }
#FOOTER .logo:after { content:''; clear:both; display:block; }
#FOOTER .logo p { float:left; }
#FOOTER .sns { position:absolute; right:0; top:0; }
#FOOTER .sns img { margin-left:2em; margin-top:0.5em; }

.blockAll { position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(100,100,100,0.5); z-index:10;font-size: 30px;text-align: center;padding-top: 12em;color: #002a57;font-weight: 700;text-shadow: 1px 1px white, -1px -1px white, -1px 1px white, 1px -1px white;}

[pageId=main]  .noticeList .pic5x2>*, .pic5x4>*, .pic4x3>*, .pic3x4>* {object-fit: fill;}

/* contest page */
[pageId=contest] #time_bar { text-align:center; position:relative; width:100%; /* max-width:1920px; */ /* height:100px; */ margin:0 auto; background:url("../images/time_bar.png")no-repeat left 0 top 0px; background-size: 100% 100%;font-family: 'Karla', sans-serif; font-weight:600; }
[pageId=contest] .time_box ul { list-style:none; padding:0; margin-top:0; }
[pageId=contest] .time_box ul li { display:inline-block; margin-top:10px; font-size:45px; }
[pageId=contest] .time_box_li { width:44px; height:64px; background:url("../images/time_box.png")no-repeat left 0 top 0px; padding-top:5px; }
[pageId=contest] .time_box_col { width:6px; height:28px; background:url("../images/time_colon.png")no-repeat left 1px top 0px; }
[pageId=contest] .time_desc ul { list-style:none; padding:0; /* margin-top:-20px; */ }
[pageId=contest] .time_desc ul li { display:inline-block; font-size:12px; color:white; width:102px; }
[pageId=contest] #main_page2 { position:relative; width:100%; max-width:1920px; padding-bottom:3em; margin:0 auto; font-family: 'Karla', sans-serif; padding-top: 0;}
[pageId=contest] .kma_desc { margin-top:3em; width:1200px; border-top:1.5px solid #c8c8c8; border-bottom:1.5px solid #c8c8c8; padding:1.5em; }
[pageId=contest] .kma_desc p { font-weight:700; font-size:28px; }
[pageId=contest] .kma_desc ul { padding-left:20px; }
[pageId=contest] .kma_desc ul li { font-weight:600; font-size:16px; margin-bottom:12px; }
[pageId=contest] .kma_btn { position:relative; width:100%; max-width:1300px; padding-bottom:3em; margin:0 auto; text-align:center; margin-top:2em; }
[pageId=contest] .kma_btn button { background-color:#1765d6; color:white; width:300px; height:60px; border:0; font-size:18px; border-radius:4px; }
[pageId=contest] #main_page3 { background-color:#f5f5f5; padding-top: 0;}
[pageId=contest] .bottom_banner { position:relative; width:100%; max-width:1300px; margin:0 auto; font-family: 'Noto Sans KR', sans-serif; }
[pageId=contest] .bottom_banner_box { box-shadow:5px 5px 8px 1px lightgray; background-color:white; width:780px; height:120px; position:relative; overflow:hidden; margin:1em 0; }
[pageId=contest] .bottom_banner_box>img { float:left; margin-right:2em; }
[pageId=contest] .bottom_banner_desc { padding-top:11px; }
[pageId=contest] .bottom_banner_desc p { font-weight:700; font-size:20px; margin-bottom:3px; }
[pageId=contest] .bottom_banner_desc span { font-weight:500; font-size:13px; color:#979797; }
[pageId=contest] .bottom_banner_desc>a { float:right; margin-right:13px; font-weight:500; font-size:14px; }
[pageId=contest] #CONTEST_MAIN { background-color:#f1f1f1; }
[pageId=contest] #CONTEST_MAIN h2 span { font-size:0.5em; font-weight:400; margin-left:1em; }
[pageId=contest] #CONTEST_MAIN .overTitle {padding: 1.6em;}
[pageId=contest] #CONTEST_MAIN .overTitle h4 { font-size:2em ;margin-bottom: 0.4em;}
[pageId=contest] #CONTEST_MAIN .overTitle span { font-size:1.15em; margin-bottom: 0.5em;display: block;}
[pageId=contest] #SEARCH_FROM { background-color:#f1f1f1; padding-bottom: 0.1em;}
[pageId=contest] #PARTI_LIST {  padding-top: 1em;padding-bottom: 4em;}
[pageId=contest] #PARTI_LIST:before { content:''; height: 1px; width: 100%; position: absolute;left:0; top: 5em;background-color:black; }
[pageId=contest] #PARTI_LIST h2 {position: relative;}
[pageId=contest] #PARTI_LIST h2 .input-form {position: absolute;top: 0;right: 0;}
[pageId=contest] #PARTI_LIST .sub-input { position:relative; }
[pageId=contest] #PARTI_LIST .sub-input ul {   }
[pageId=contest] #PARTI_LIST .sub-input ul li { font-size:1.2em; margin-left:0 ;color: #B3B3B3;cursor: pointer;}
[pageId=contest] #PARTI_LIST .sub-input ul li + li { margin-left:2em; }
[pageId=contest] #PARTI_LIST .sub-input ul li + li:before { content:'|'; position:absolute; left:-1em; color: black; }
[pageId=contest] #PARTI_LIST .sub-input ul li.active { color:black; }
[pageId=contest] #PARTI_LIST .upload { position:absolute; right:0; top:0; width: 160px;width: 7.8em;line-height: 48px;line-height: 1.9em;border-radius: 3em;border: 0;color: white;background-color: #1765D6;padding-left: 1.2em;font-size: 1.4em;cursor: pointer;}
[pageId=contest] #PARTI_LIST .upload:after { content:''; background-image:url(/images/contest_upload_icon.png); background-repeat: no-repeat;background-position: center;position: absolute;top: 16%;left: 9%;width: 1.35em;height: 1.35em;}
[pageId=contest] #PARTI_LIST .order-desc { margin-top:1em; display:block; line-height:3em; font-size:1.2em; text-align:right; position: relative;padding-right: 1.5em;}
[pageId=contest] #PARTI_LIST .order-desc:after { content:'∨'; color:#666; font-size:1.5em; font-weight:100; position: absolute;right: 0;}
[pageId=contest] #PARTI_LIST  .pagination { text-align:center; display: flex; flex-wrap: nowrap;align-items: center;justify-content: center;border-top: 1px solid black;margin-top: 2em;padding-top: 2em;}
[pageId=contest] #PARTI_LIST  .pagination>* { font-size:1.2em; color: #aaa; min-width:2.2em; }
[pageId=contest] #PARTI_LIST  .pagination>*.active { color:black; }

/* contest detail page */
.kma_detail { padding: 0; }
.kma_detail .section {/* padding: 0.5em 1em; */}
.kma_detail .section * { font-size:1em; }
.kma_detail .section>h3 { margin: 0; }
.kma_detail .section>p {/* padding-left: 1.5em; *//* font-size: 1em; */}

[pageId=contestDetail] #time_bar { text-align:center; position:relative; width:100%; /* max-width:1920px; */ /* height:100px; */ margin:0 auto; background:url("../images/time_bar.png")no-repeat left 0 top 0px; background-size: 100% 100%;font-family: 'Karla', sans-serif; font-weight:600; }
[pageId=contestDetail] .time_box ul { list-style:none; padding:0; margin-top:0; }
[pageId=contestDetail] .time_box ul li { display:inline-block; margin-top:10px; font-size:45px; }
[pageId=contestDetail] .time_box_li { width:44px; height:64px; background:url("../images/time_box.png")no-repeat left 0 top 0px; padding-top:5px; }
[pageId=contestDetail] .time_box_col { width:6px; height:28px; background:url("../images/time_colon.png")no-repeat left 1px top 0px; }
[pageId=contestDetail] .time_desc ul { list-style:none; padding:0; /* margin-top:-20px; */ }
[pageId=contestDetail] .time_desc ul li { display:inline-block; font-size:12px; color:white; width:102px; }
[pageId=contestDetail] #main_page2 { position:relative; width:100%; max-width:1920px; padding-bottom:3em; margin:0 auto; font-family: 'Karla', sans-serif; padding-top: 0;}
[pageId=contestDetail] .kma_desc { margin-top:3em; width:1200px; border-top:1.5px solid #c8c8c8; border-bottom:1.5px solid #c8c8c8; padding:1.5em; }
[pageId=contestDetail] .kma_desc p { font-weight:700; font-size:28px; }
[pageId=contestDetail] .kma_desc ul { padding-left:20px; }
[pageId=contestDetail] .kma_desc ul li { font-weight:600; font-size:16px; margin-bottom:12px; }
[pageId=contestDetail] .kma_btn { position:relative; width:100%; max-width:1300px; padding-bottom:3em; margin:0 auto; text-align:center; margin-top:2em; }
[pageId=contestDetail] .kma_btn button { background-color:#1765d6; color:white; width:300px; height:60px; border:0; font-size:18px; border-radius:4px; }
[pageId=contestDetail] #main_page3 { background-color:#f5f5f5; /* padding-top: 0; */}
[pageId=contestDetail] .bottom_banner { position:relative; /* width:100%; */ /* max-width:1300px; */ /* margin:0 auto; */ font-family: 'Noto Sans KR', sans-serif; }
[pageId=contestDetail] .bottom_banner_box {box-shadow: 5px 5px 8px 1px lightgrey; background-color:white; width:780px; height:120px; position:relative; overflow:hidden;margin: 1em auto;}
[pageId=contestDetail] .bottom_banner_box>img { float:left; margin-right:2em; max-width: 306px;}
[pageId=contestDetail] .bottom_banner_desc { padding-top:11px; }
[pageId=contestDetail] .bottom_banner_desc p { font-weight:700; font-size:20px; margin-bottom:3px; }
[pageId=contestDetail] .bottom_banner_desc span { font-weight:500; font-size:13px; color:#979797; }
[pageId=contestDetail] .bottom_banner_desc>a { float:right; margin-right:13px; font-weight:500; font-size:14px; }
[pageId=contestDetail] #main_page4 h2{ border-bottom: 2px solid #ccc;padding-bottom: 5px;}

/* participation */
[pageId=participation] #main_page3 { background-color:#f5f5f5; padding-top: 4em;padding-bottom: 4em;}
[pageId=participation] .app_participate { position:relative;  width:996px;/* height:1182px; */ margin:0 auto; box-shadow:5px 5px 8px 1px lightgray; background-color:white;padding-bottom: 3em;}
[pageId=participation] .app_participate_img {/* background: url("../images/Webtoon_banner.png")no-repeat left 0 top 0px; *//* background-size: 100%; *//* height:380px; */}
[pageId=participation] .app_participate_img img { width:100%; }
[pageId=participation] .app_participate_form { margin-top:3em; font-family: 'Noto Sans KR', sans-serif; }
[pageId=participation] .app_participate_form p { font-weight:700; font-size:20px; }
[pageId=participation] .app_participate_form_span { font-weight:600; margin-top:19px; }
[pageId=participation] .app_participate_form_content { padding:0 5em; }
[pageId=participation] .app_participate_form_content span {  margin-right:20px; display: inline-block;width: 5em;}
[pageId=participation] .app_participate_btn { text-align:center; }
[pageId=participation] .app_participate_btn button { font-family: 'Karla', sans-serif; font-weight:600; font-size:18px; background-color:#f5f5f5; border:0; border-radius:5px; color:#979797; width:300px; height:50px; margin-top:4em; margin-right:120px; }
[pageId=participation] .app_participate_btn button.active {background-color: #0a0a0a;background-color: #1765D6;color: #FFFFFf;cursor: pointer;}
[pageId=participation] .app_content { border:1.5px solid black; border-radius:5px;  width: calc( 100% - 8em ); margin-bottom:20px; }
[pageId=participation] .app_title>.app_content { height:60px;  }
[pageId=participation] [colid="explain"] .app_content { height:16em; resize: none;}
[pageId=participation] .app_link>.app_content { height:60px; /* margin-left:22px; */ }
[pageId=participation] .app_link>.app_content#link { margin-bottom: 0.5em; }
[pageId=participation] .app_title { margin-top:2em; }
[pageId=participation] .app_link>span {  }
[pageId=participation] .app_consent button { width:15px; height:15px; background-color:white; border:1px solid #979797; border-radius:3px; float:left; margin:4px 10px 0 21px; }
[pageId=participation] .app_consent span { width:700px; font-size:14px; }
[pageId=participation] [colid="explain"] span { position:relative; top: -15em; }
[pageId=participation] input,
[pageId=participation] textarea { padding-left:1em; padding-right:1em; }
[pageId=participation] textarea { padding-top:0.5em; padding-bottom:0.5em; }
[pageId=participation] .app_consent {padding-left: 6.2em;}
[pageId=participation] #isAgree { position:absolute; }
[pageId=participation] [for="isAgree"] {text-indent: 1.3em;}

/* complate */
[pageId=complate] {}
[pageId=complate] #main_page3 { background-color:#f5f5f5; padding-top:5em; padding-bottom:6em;; }
[pageId=complate] .app_complete { position:relative;  width:996px; height:832px; margin:0 auto; box-shadow:5px 5px 8px 1px lightgray; background-color:white; }
[pageId=complate] .app_complete_img { background:url("../images/contest_banner.png")no-repeat left 0 top 0px; height:380px; background-size: 100%;}
[pageId=complate] .app_complete_desc { text-align:center; margin-top:7em; font-family: 'Noto Sans KR', sans-serif; }
[pageId=complate] .app_complete_desc span { font-weight:700; font-size:26px; }
[pageId=complate] .app_complete_desc button { font-family: 'Karla', sans-serif; font-weight:600; font-size:18px; background-color:#494949; border:0; border-radius:5px; color:white; width:300px; height:50px; margin-top:4em; }
[pageId=complate] .app_complete img {width: 100%;}

[pageId=notice] #SEARCH_FROM { background-color:#f5f5f5; padding-bottom:1px; }
[pageId=notice] #NOTICE_LIST:before { content:'';height: 1px;width: 100%;position: absolute;left:0;bottom: 0em;background-color:black;}
[pageId=notice] #NOTICE_LIST .sub-input { position:relative;display: none;}
[pageId=notice] #NOTICE_LIST .sub-input ul {   }
[pageId=notice] #NOTICE_LIST .sub-input ul li { font-size:1.2em; margin-left:0 ;color: #B3B3B3;cursor: pointer;}
[pageId=notice] #NOTICE_LIST .sub-input ul li + li { margin-left:2em; }
[pageId=notice] #NOTICE_LIST .sub-input ul li + li:before { content:'|'; position:absolute; left:-1em; color: black; }
[pageId=notice] #NOTICE_LIST .sub-input ul li.active { color:black;float: none;}
[pageId=notice] #NOTICE_LIST .upload { position:absolute; right:0; top:0; width: 160px;width: 7.8em;line-height: 48px;line-height: 1.9em;border-radius: 3em;border: 0;color: white;background-color: #1765D6;padding-left: 1.2em;font-size: 1.4em;cursor: pointer;}
[pageId=notice] #NOTICE_LIST .upload:after { content:''; background-image:url(/images/contest_upload_icon.png); background-repeat: no-repeat;background-position: center;position: absolute;top: 16%;left: 9%;width: 1.35em;height: 1.35em;}
[pageId=notice] #NOTICE_LIST .order-desc { margin-top:1em; display:block; line-height:3em; font-size:1.2em; text-align:right; position: relative;padding-right: 1.5em;display: none;}
[pageId=notice] #NOTICE_LIST .order-desc:after { content:'∨'; color:#666; font-size:1.5em; font-weight:100; position: absolute;right: 0;}
[pageId=notice] #NOTICE_LIST {overflow: hidden;padding-top: 0;}
[pageId=notice] #NOTICE_LIST ul.list>li {box-shadow: 5px 5px 8px 1px grey; overflow:hidden;cursor: pointer;margin-bottom: 4%;}
[pageId=notice] #NOTICE_LIST ul.list>li.active .overTitle,
[pageId=notice] #NOTICE_LIST ul.list>li:hover .overTitle { display:block; transition:0.5s all; opacity:1; top:auto; bottom:0; font-size: 0.9em;}
[pageId=notice] #NOTICE_LIST ul.list>li .overTitle span { color: #979797; font-size: 0.9em;display: block;margin-bottom: 0.5em;}
[pageId=notice] #NOTICE_LIST .list { margin-top:2em; }

[pageId=winners] #SEARCH_FROM { background-color:#f5f5f5; padding-bottom:1px; }
[pageId=winners] .list .sub-input { position:relative; }
[pageId=winners] .list .sub-input ul {   }
[pageId=winners] .list .sub-input ul li { font-size:1.2em; margin-left:0 ;color: #B3B3B3;cursor: pointer;}
[pageId=winners] .list .sub-input ul li + li { margin-left:2em; }
[pageId=winners] .list .sub-input ul li + li:before { content:'|'; position:absolute; left:-1em; color: black; }
[pageId=winners] .list .sub-input ul li.active { color:black; }
[pageId=winners] .list .upload { position:absolute; right:0; top:0; width: 160px;width: 7.8em;line-height: 48px;line-height: 1.9em;border-radius: 3em;border: 0;color: white;background-color: #1765D6;padding-left: 1.2em;font-size: 1.4em;cursor: pointer;}
[pageId=winners] .list .upload:after { content:''; background-image:url(/images/contest_upload_icon.png); background-repeat: no-repeat;background-position: center;position: absolute;top: 16%;left: 9%;width: 1.35em;height: 1.35em;}
[pageId=winners] .list .order-desc { margin-top:1em; display:block; line-height:3em; font-size:1.2em; text-align:right; position: relative;padding-right: 1.5em;}
[pageId=winners] .list .order-desc:after { content:'∨'; color:#666; font-size:1.5em; font-weight:100; position: absolute;right: 0;}
[pageId=winners] .list {overflow: hidden;}
[pageId=winners] ul.list>li { box-shadow: 5px 5px 8px 1px lightgrey; overflow:hidden; cursor: pointer;margin-bottom: 4%;}
[pageId=winners] .titleView>*.name { font-weight:normal;text-overflow: ellipsis;font-size: 16px;overflow: hidden;white-space: nowrap;}
[pageId=winners] .input-form .tag-select>ul { width: auto; min-width: 100%; }
[pageId=winners] .input-form .tag-select>ul>li { background-color: rgb(18 34 57 / 1); color: white; }
[pageId=winners] .input-form .tag-select>ul>li:hover {background-color: white; color: black;}
[pageId=winners] .post_list{min-height:2em;position:relative;}
[pageId=winners] .post_list button{position:absolute;right:0;width: 100px;height: 35px;background-color: #494949;color: white;border: 0;border-radius: 5px;margin-top: 1em;}

[pageId=prVideo] #SEARCH_FROM { background-color:#f5f5f5; padding-bottom:1px; }
[pageId=prVideo] .list { }
[pageId=prVideo] .list>li { display: block; box-shadow: 5px 5px 8px 1px lightgrey; margin-bottom:2em; flex-direction: row;flex-wrap: nowrap;position: relative;}
[pageId=prVideo] .list>li>* { float:left; width:52%;}
[pageId=prVideo] .list>li:after {content:'';clear:both; display:block;}
[pageId=prVideo] .list .pic5x2 { width:48%; padding-top: 18%;}
[pageId=prVideo] .list>li .sideView { padding:1em; }
[pageId=prVideo] .list>li .sideView .title { font-size:1.4em; font-weight:bold; display:block; margin-bottom:0.5em; }
[pageId=prVideo] .list>li .sideView .desc { font-size:0.9em;font-family: 'Noto Sans';}
[pageId=prVideo] .list>li .sideView .more {display: block;position: absolute;bottom: 1em;right: 1em;}
[pageId=prVideo] .list>li .sideView .more:after { content:'>'; margin-left:0.5em; font-weight:400; }

[pageId=community] #COMMUNITY_LIST {background-color:#f5f5f5;min-height: calc( 100% - 24em);}
[pageId=community] .list { display:inline-block; width:66%; }
[pageId=community] .list>li {/*width: 66%;*/position: relative;border-radius: 0.3em 0.3em 0 0;box-shadow: 5px 5px 8px 1px lightgrey; margin-bottom:2em;padding-top: 5em;}
[pageId=community] .list>li>img {  margin-top: -4em;-webkit-filter: contrast(70%) brightness(150%) grayscale(100%);filter: contrast(70%) brightness(150%) grayscale(100%); width: 100%;}
[pageId=community] .list>li>img:hover { -webkit-filter: none;filter: none; }
[pageId=community] .list>li .overTop {position: absolute;top: 0;left: 0;width: 100%;padding: 1em;background-color: rgba(34,34,34,0.9);}
[pageId=community] .list>li .overTop .name { color:white; line-height:1.2em;font-size: 1.2em; margin-left:1em; margin-right:1em;}
[pageId=community] .list>li .overTop img { vertical-align:middle;width: 60px;height: 60px;object-fit: cover;border-radius: 60px;object-position: top;}
[pageId=community] .list>li .overTop .ago { color:#9e9e9e;font-size: 1em;}
[pageId=community] .list>li .overTop .more {color:white;font-size:2em;position:absolute;right: 0.5em;letter-spacing: 0.2em;cursor: pointer;}
[pageId=community] .list>li .titleView { height:auto;background-color: white;}
[pageId=community] .list>li .titleView h4 { font-size:1.4em; margin-top:0.5em; margin-bottom:0.5em; }
[pageId=community] .list>li .titleView .tags { color:#979797; font-weight:400; }
[pageId=community] .list>li .count { color:#979797; position:relative; }
[pageId=community] .list>li .count>* { font-size:1.2em; font-weight:400; }
[pageId=community] .list>li .count>* + * { margin-left:1em; }
[pageId=community] .list>li .count .date { position:absolute; right:0; }
[pageId=community] .list>li .count span:before { content:''; background-repeat: no-repeat;width: 1em;height: 1.2em; background-position-y: bottom;background-size: 100%;display: inline-block;margin-right: 0.3em;color: black;margin-left: 0.3em;position: relative;bottom: -0.1em; }
[pageId=community] .list>li .count .like {}
[pageId=community] .list>li .count .like:before { background-image:url(../images/like_icon.png);}
[pageId=community] .list>li .count .like.active:before { background-image: url(../images/active_like_icon.png);}
[pageId=community] .list>li .count .reply {}
[pageId=community] .list>li .count .reply:before { background-image:url(../images/comment_icon.png); }
[pageId=community] .list>li .count .view {}
[pageId=community] .list>li .count .view:before { background-image:url(../images/view_icon.png); }
[pageId=community] .list>li .reply-list { border-top:1px solid #a9a9a9; margin-top:0.5em; }
[pageId=community] .list>li .reply-list li { padding-top: 1em; padding-bottom: 0.5em; padding-left:3em; position:relative;}
[pageId=community] .list>li .reply-list img {vertical-align: text-top;width: 40px;height: 40px;object-fit: cover;object-position: top;border-radius: 40px;margin-right: 1em;position: absolute; left:0.5em;/* background-color: red; */}
[pageId=community] .list>li .reply-list li span {font-weight: normal;font-size: 0.8em;color: #888;}
[pageId=community] .list>li .reply-list li .name {}
[pageId=community] .list>li .reply-list li .ymd { float: right; }
[pageId=community] .list>li .reply-list li .ymd:after { content:''; clear:both; display:block; }
[pageId=community] .list>li .reply-list li .reply { display: block; padding-top: 0.5em; font-size: 1em; color: #000; }
[pageId=community] .list>li .reply-list input {border: 0;outline: none;margin-left: 0.5em;font-size: 1.1em;background: none;width: 22em;background-color: white;}
[pageId=community] .list>li .reply-list button.delete {border-radius: 100%;border-width: 0;background-color: #1765d6;color: white;float: right;margin-left: 1em;background-image: url(../images/delete.svg);background-size: 66%;background-position: center;background-repeat: no-repeat;width: 1.7em;height: 1.7em;}
[pageId=community] .list>li .reply-list li + li.input { border-top: 1px solid #ccc; }
[pageId=community] .list>li .reply-list li.input { padding-left: 0; }
[pageId=community] .list>li .reply-list li.input img {width: 40px;height: 40px;object-fit: cover;border-radius: 40px;vertical-align: bottom;margin-right: 0;position: relative;left: auto;}
[pageId=community] .list>li .reply-list li.input button {position: absolute;right: 0.5em;background: none;border: 0;font-size: 1.1em;color: #aaa;}
[pageId=community] .pagination { width:66%; }
[pageId=community] #SEARCH_FROM { position: absolute; width: 24em;  display: inline-block;padding-left: 2em; }
[pageId=community] #SEARCH_FROM .input-form { box-shadow: 2px 2px 13px 4px lightgrey; padding-top: 0.5em;padding-bottom: 0.5em;margin-bottom: 2em;border-radius: 0.3em;}
[pageId=community] #SEARCH_FROM .input-form>input { font-size:1.2em; border:0; width: 16.7em;}
[pageId=community] #SEARCH_FROM .input-form img { border:0; top: -0.3em;}
[pageId=community] #MY_FLLOWING { margin-top:1em; position:relative; }
[pageId=community] #MY_FLLOWING:before { content:''; position:absolute; top:2em; background-color: #a9a9a9; height: 1px;width: 100%;}
[pageId=community] #MY_FLLOWING ul { margin-top:2em; border-bottom: 1px solid #c8c8c8;padding-bottom: 1em;}
[pageId=community] #MY_FLLOWING li span { font-size: 1.3em; padding-left:1em; }
[pageId=community] #MY_FLLOWING li + li { margin-top:1.5em; }
[pageId=community] #MY_FLLOWING li img {vertical-align: middle;width: 32px;height: 32px;border-radius: 32px;object-fit: cover;}
[pageId=community] #MY_FLLOWING li.more { position:relative; }
[pageId=community] #MY_FLLOWING li.more:before { content:''; /* position: absolute; */ /* left:0; */ /* top:0; */ width:1.5em; height:1.5em;  background:url(/images/contest_sort_icon.png); background-repeat: no-repeat;background-position: center;background-size: 50%;display: inline-block;border: 1px solid #808080;border-radius: 2em;position: relative;top: 0.5em;margin-right: 0.5em;}
[pageId=community] .function { position:fixed; right:2em; top: 50%; z-index: 5;}
[pageId=community] .function li { margin-bottom:0.4em;/* border: 2px solid white; *//* border-radius: 7em; */}
[pageId=community] .contents {padding: 0.5em;width: 100%;background-color: white;}
[pageId=community] .contents .height5 {position:relative;padding-bottom:56.25%;/* padding-top:30px; */height:0;overflow:hidden;}
[pageId=community] .contents .iframeView { width: 100%; position: relative; padding-top: 56.25%; }
[pageId=community] .contents .iframeView iframe {width: 100%;height: 100%;position: absolute;top: 0;}
[pageId=community] .contents:after {content:'';clear:both;display:block;}
[pageId=community] .contents img { max-width:100%; }
[pageId=community] .contents pre { min-width:100%; }
[pageId=community] .contents p { max-width:100%;overflow-wrap: break-word;}

[pageId=community] .list.activeTop>li {display: none;}
[pageId=community] .list>li.activeTop {display: block;position: fixed;z-index: 10;top: 10.80em;left: 0;box-shadow: none;width: 100%;background-color: #191919;height: calc( 100% - 10.8em );overflow: hidden;}
[pageId=community] .list>li.activeTop>img {}
[pageId=community] .list>li.activeTop>img:hover { }
[pageId=community] .list>li.activeTop .overTop {background-color: #191919;z-index: 1;width: calc( 100% - 20em );}
[pageId=community] .list>li.activeTop .overTop .name {
    text-align: left;
    text-indent: 1em;
}
[pageId=community] .list>li.activeTop .overTop img {
    position: static;
}
[pageId=community] .list>li.activeTop .overTop .ago {display: none;}
[pageId=community] .list>li.activeTop .overTop .more {position: absolute;top: 0.4em;right: -9.7em;z-index: 17;/* color: black; */display: block;width: 0.8em;height: 0.8em;/* border: 1px solid blue; */}
[pageId=community] .list>li.activeTop .overTop .more:before {content:'';position:absolute;top:0;left: calc(50% - 1px);width: 2px;height:100%;background-color: #222;transform: rotate(135deg);}
[pageId=community] .list>li.activeTop .overTop .more:after {content:'';position:absolute;top:0;left: calc(50% - 1px);width: 2px;height:100%;background-color: #222;transform: rotate(45deg);}
[pageId=community] .list>li.activeTop .contents {background:none;color: white;width: calc( 100% - 19em );height: 100%;overflow: hidden;overflow-y: auto;}
[pageId=community] .list>li.activeTop .titleView {position: fixed;top: 10.8em;right: 0;width: 20em;height: calc( 100% - 10.8em);overflow: hidden;padding: 0.5em;padding-right: 0;}
[pageId=community] .list>li.activeTop .titleView h4 { }
[pageId=community] .list>li.activeTop .titleView .tags { display: none; }
[pageId=community] .list>li.activeTop .count { }
[pageId=community] .list>li.activeTop .count>* { }
[pageId=community] .list>li.activeTop .count>* + * { }
[pageId=community] .list>li.activeTop .count .date { }
[pageId=community] .list>li.activeTop .count span:before {}
[pageId=community] .list>li.activeTop .count .like {}
[pageId=community] .list>li.activeTop .count .like:before { }
[pageId=community] .list>li.activeTop .count .like.active:before { }
[pageId=community] .list>li.activeTop .count .reply {}
[pageId=community] .list>li.activeTop .count .reply:before { }
[pageId=community] .list>li.activeTop .count .view {}
[pageId=community] .list>li.activeTop .count .view:before { }
[pageId=community] .list>li.activeTop .reply-list {height: calc( 100% - 5.5em );overflow: hidden;overflow-y: auto;display: block;}
[pageId=community] .list>li.activeTop .reply-list li {display: block;padding-right: 0.5em;padding-left: 3.5em;}
[pageId=community] .list>li.activeTop .reply-list img {}
[pageId=community] .list>li.activeTop .reply-list li span { }
[pageId=community] .list>li.activeTop .reply-list li .name { color: #191919; font-weight: bold; }
[pageId=community] .list>li.activeTop .reply-list li .ymd { }
[pageId=community] .list>li.activeTop .reply-list li .ymd:after { }
[pageId=community] .list>li.activeTop .reply-list li .reply {word-break: break-all;color: #333;}
[pageId=community] .list>li.activeTop .reply-list input {position: absolute;left: 2.5em;top: 1.5em;width: calc( 100% - 7em );font-size: 1em;}
[pageId=community] .list>li.activeTop .reply-list button.delete {}
[pageId=community] .list>li.activeTop .reply-list li + li.input {/* position: absolute; *//* bottom: 0; *//* width: 100%; *//* padding-left: 0.5em; */}
[pageId=community] .list>li.activeTop .reply-list li.input {position: absolute;bottom: 0;width: 100%;padding-left: 0.5em;}
[pageId=community] .list>li.activeTop .reply-list li.input img {}
[pageId=community] .list>li.activeTop .reply-list li.input button {font-size: 1em;top: 1.5em;right: 1em;}

[pageId=community] .list.detail-true>li.activeTop {position: relative;top: 0;min-height: 20em;}
[pageId=community] .list>li.activeTop .titleView {position:absolute;top: 0;height: 100%;}

/* myfeed */
[pageId=myfeed] .gray_layer { background-color:#f5f5f5; padding-bottom:0; }
[pageId=myfeed] .feed_top { padding:2em 0em; position:relative; height:14em; }
[pageId=myfeed] .feed_img { position:relative; }
[pageId=myfeed] .feed_img>img { width:9em; position:absolute; top:-0.9em; left:1em; }
[pageId=myfeed] .feed_info { position:absolute; left:15em; }
[pageId=myfeed] .feed_info1 { margin-bottom:2.3em; }
[pageId=myfeed] .feed_info1>span { font-size:2em; font-weight:600; margin-right:1em; vertical-align:-0.2em; }
[pageId=myfeed] .feed_info1>button { margin-right:0.2em; border-radius:3px; border:1px solid #979797; background-color:#f5f5f5; padding:0.2em 1em; }
[pageId=myfeed] .feed_info1>button:nth-child(4) { padding:0.2em 0.5em; }
[pageId=myfeed] .feed_info1>button>span { font-size:0.8em; vertical-align:0.15em; }
[pageId=myfeed] .feed_info2 span { font-size:1.2em; margin-right:0.5em; }
[pageId=myfeed] .feed_info2 span:nth-child(2n) { font-weight:600; margin-right:1em; }
[pageId=myfeed] .feed_info3 p { font-size:0.9em; margin-top:0.8em; }
[pageId=myfeed] .input-form>img { padding-bottom:0.3em; }
[pageId=myfeed] .split4 { padding:2em 0; }

[pageId=myfeed_post] .post_page { height:100%; }
[pageId=myfeed_post] .page_left { float:left; background-color:rgba(0,0,0,0.9); width:calc(100% - 22em); height:100%; }
[pageId=myfeed_post] .page_right { float:right; width:22em; height:100%; }
[pageId=myfeed_post] .post_prof { padding:1.5em 2em; }
[pageId=myfeed_post] .post_prof>img { margin-right:0.5em; }
[pageId=myfeed_post] .post_prof>span { color:white; vertical-align:0.7em; font-size:1.5em; }
[pageId=myfeed_post] .post_prof>button { float:right; border:0; background:transparent; color:white; margin-top:0.5em; }
[pageId=myfeed_post] .post_prof>button span { font-size:1.3em; }
[pageId=myfeed_post] .post_img { text-align:center; }
[pageId=myfeed_post] .post_img>img { width:95%; }
[pageId=myfeed_post] .post_close { text-align:right; margin:1em; }
[pageId=myfeed_post] .post_close button { border:0; background-color:transparent; }
[pageId=myfeed_post] .post_close button>img { width:1.1em; }
[pageId=myfeed_post] .post_content { position:relative; }
[pageId=myfeed_post] .post_comment { padding:0 1em; margin-bottom:1.7em; position:relative; }
[pageId=myfeed_post] .post_comment>img { float:left; margin-right:1em; }
[pageId=myfeed_post] .post_comment>p { margin:0; }
[pageId=myfeed_post] .post_comment>p:nth-child(2) { font-weight:600; }
[pageId=myfeed_post] .post_comment>div { float:right; margin-top:-2.4em; }
[pageId=myfeed_post] .post_comment>div span { font-size:0.8em; color:#979797; }
[pageId=myfeed_post] .post_content2 { clear:both; border-top:1px solid #c8c8c8; border-bottom:1px solid #c8c8c8; margin:0 1em 1.2em 1em; padding:0.8em 0; }
[pageId=myfeed_post] .post_content2 span { margin-left:0.2em; margin-right:0.7em; vertical-align:0.2em; }
[pageId=myfeed_post] .post_content2 span:nth-child(6) { color:#979797; }
[pageId=myfeed_post] .post_content2 img:nth-child(1) { vertical-align:-0.1em; }
[pageId=myfeed_post] .post_content2 img:nth-child(3) { vertical-align:-0.1em; }
[pageId=myfeed_post] .write_comment { position:fixed; bottom:0; border-top:1px solid #c8c8c8; width:100%; padding:1em; }
[pageId=myfeed_post] .write_comment>img { margin-right:1em; }
[pageId=myfeed_post] .write_comment input { border:0; vertical-align:1em; width:13em; }
[pageId=myfeed_post] .write_comment button { border:0; background-color:transparent; vertical-align:1em; color:#979797; }

/* video */
[pageId=video] .post_page { height:100%; }
[pageId=video] .page_left { float:left; background-color:rgba(0,0,0,0.9); width:calc(100% - 22em); height:100%; position:relative; }
[pageId=video] .page_right { float:right; width:22em; height:100%; }
[pageId=video] .post_prof { padding:1.5em 2em; position:absolute; width:100%; }
[pageId=video] .post_prof>img { margin-right:0.5em; }
[pageId=video] .post_prof>span { color:white; vertical-align:0.7em; font-size:1.5em; }
[pageId=video] .post_prof>button { float:right; border:0; background:transparent; color:white; margin-top:0.5em; }
[pageId=video] .post_prof>button span { font-size:1.3em; }
[pageId=video] .post_video { text-align:center; padding:1em; height:100%; }
[pageId=video] .post_video>video { max-width:100%; }
[pageId=video] .post_close { text-align:right; margin:1em; }
[pageId=video] .post_close button { border:0; background-color:transparent; }
[pageId=video] .post_close button>img { width:1.1em; }
[pageId=video] .post_content { position:relative; }
[pageId=video] .post_comment { padding:0 1em; margin-bottom:1.7em; position:relative; }
[pageId=video] .post_comment>img { float:left; margin-right:1em; }
[pageId=video] .post_comment>p { margin:0; }
[pageId=video] .post_comment>p:nth-child(2) { font-weight:600; }
[pageId=video] .post_comment>div { position:absolute; top:0; right:0; margin-right:1.1em; }
[pageId=video] .post_comment>div span { font-size:0.8em; color:#979797; }
[pageId=video] .post_content2 { clear:both; border-top:1px solid #c8c8c8; border-bottom:1px solid #c8c8c8; margin:0 1em 1.2em 1em; padding:0.8em 0; }
[pageId=video] .post_content2 span { margin-left:0.2em; margin-right:0.7em; vertical-align:0.2em; }
[pageId=video] .post_content2 span:nth-child(6) { color:#979797; }
[pageId=video] .post_content2 img:nth-child(1) { vertical-align:-0.1em; }
[pageId=video] .post_content2 img:nth-child(3) { vertical-align:-0.1em; }
[pageId=video] .write_comment { position:fixed; bottom:0; border-top:1px solid #c8c8c8; width:100%; padding:1em; background-color:white; }
[pageId=video] .write_comment>img { margin-right:1em; }
[pageId=video] .write_comment input { border:0; vertical-align:1em; width:13em; }
[pageId=video] .write_comment button { border:0; background-color:transparent; vertical-align:1em; color:#979797; }

/* video */
[pageId=communityDetail] .post_page { height:100%; }
[pageId=communityDetail] .page_left { float:left; background-color:rgba(0,0,0,0.9); width:calc(100% - 22em); height:100%; position:relative; }
[pageId=communityDetail] .page_right { float:right; width:22em; height:100%; }
[pageId=communityDetail] .post_prof { padding:1.5em 2em; position:absolute; width:100%; }
[pageId=communityDetail] .post_prof>img { margin-right:0.5em; }
[pageId=communityDetail] .post_prof>span { color:white; vertical-align:0.7em; font-size:1.5em; }
[pageId=communityDetail] .post_prof>button { float:right; border:0; background:transparent; color:white; margin-top:0.5em; }
[pageId=communityDetail] .post_prof>button span { font-size:1.3em; }
[pageId=communityDetail] .post_video { text-align:center; padding:1em; height:100%; }
[pageId=communityDetail] .post_video>video { max-width:100%; }
[pageId=communityDetail] .post_close { text-align:right; margin:1em; }
[pageId=communityDetail] .post_close button { border:0; background-color:transparent; }
[pageId=communityDetail] .post_close button>img { width:1.1em; }
[pageId=communityDetail] .post_content { position:relative; }
[pageId=communityDetail] .post_comment { padding:0 1em; margin-bottom:1.7em; position:relative; }
[pageId=communityDetail] .post_comment>img { float:left; margin-right:1em; }
[pageId=communityDetail] .post_comment>p { margin:0; }
[pageId=communityDetail] .post_comment>p:nth-child(2) { font-weight:600; }
[pageId=communityDetail] .post_comment>div { position:absolute; top:0; right:0; margin-right:1.1em; }
[pageId=communityDetail] .post_comment>div span { font-size:0.8em; color:#979797; }
[pageId=communityDetail] .post_content2 { clear:both; border-top:1px solid #c8c8c8; border-bottom:1px solid #c8c8c8; margin:0 1em 1.2em 1em; padding:0.8em 0; }
[pageId=communityDetail] .post_content2 span { margin-left:0.2em; margin-right:0.7em; vertical-align:0.2em; }
[pageId=communityDetail] .post_content2 span:nth-child(6) { color:#979797; }
[pageId=communityDetail] .post_content2 img:nth-child(1) { vertical-align:-0.1em; }
[pageId=communityDetail] .post_content2 img:nth-child(3) { vertical-align:-0.1em; }
[pageId=communityDetail] .write_comment { position:fixed; bottom:0; border-top:1px solid #c8c8c8; width:100%; padding:1em; background-color:white; }
[pageId=communityDetail] .write_comment>img { margin-right:1em; }
[pageId=communityDetail] .write_comment input { border:0; vertical-align:1em; width:13em; }
[pageId=communityDetail] .write_comment button { border:0; background-color:transparent; vertical-align:1em; color:#979797; }


/* login */
[pageId=login] .layerFrame { padding:0; }
[pageId=login] .page_content { width:100%; background-color:#f5f5f5; padding:6em 0; }
[pageId=login] .page_content>* { max-width:1200px; margin:0 auto; }
[pageId=login] .shadow_box { box-shadow:5px 5px 8px 1px lightgray; background-color:white; width:588px; height:30em; padding:1em; margin-top:3em; margin-bottom:3em; }
[pageId=login] .shadow_box>p { font-size:30px; font-weight:600; text-align:center; color:#122239; }
[pageId=login] .shadow_box>input {width: 90%;margin: 0 auto;display: block;line-height: 3em;margin-left: 5%;margin-bottom: 0.5em; padding-left:10px; border:1px soild #979797;/* border-radius:5px; */font-size: 1.1em;}
[pageId=login] .login_check { font-weight:600; }
[pageId=login] .login_check a { float:right; margin-right:26px; font-size:16px; color:#122239; }
[pageId=login] .login_check:after { content:''; display:block; clear:both; }
[pageId=login] .login_remember { float:left; margin-left:26px; position:relative; }
[pageId=login] .login_remember>img { vertical-align:-3px; }
[pageId=login] .login_remember>span { font-size:16px; }

[pageId=login] .navy_button { clear:both; margin: 0 auto;margin-top:3em;  padding-bottom: 3em; width: 90%; border-bottom:1px solid #979797; }
[pageId=login] .navy_button>button {width: 100%;line-height: 3em; border:0; border-radius:5px; background-color:#122239;background-color: #1765D6;color:white; font-weight:600;font-size: 1.3em;}
[pageId=login] .login_bottom { text-align:center; margin-top:1em; }
[pageId=login] .login_bottom span { font-size:17px; color:#979797; }
[pageId=login] .login_bottom a { font-size:17px; color:#122239; text-decoration:underline; }
[pageId=login] .errorMsg { color:red;font-weight: 600;font-size: 18px;margin: 0.5em 0;text-align: center;}
[pageid=login] .shadow_box .changePassword { display:none; }
[pageid=login] .changePasswordMode {height:35em;}
[pageid=login] .changePasswordMode .navy_button>button { display:none; }
[pageid=login] .changePasswordMode .changePassword,
[pageid=login] .changePasswordMode .navy_button>button.changePassword { display:block; }
[pageid=login] .changePasswordMode .navy_button>button.changePassword>span { font-weight:600; }

/* signup */
[pageId=signup] .layerFrame { padding:0; }
[pageId=signup] .page_content { width:100%; background-color:#f5f5f5; padding:6em 0; }
[pageId=signup] .page_content>* { max-width:1200px; margin:0 auto; }
[pageId=signup] .shadow_box { box-shadow:5px 5px 8px 1px lightgray; background-color:white; width:588px; height:42em; padding:1em; }
[pageId=signup] .shadow_box>p { font-size:30px; font-weight:600; text-align:center; color:#122239; }
[pageId=signup] .shadow_box>input { width: 80%; height: 3em; margin-left:27px; margin-bottom:10px; padding-left:10px; border:1px soild #979797; /* border-radius:5px; */ display: block;margin: 1em auto;}
[pageId=signup] .shadow_box>select { width: 80%; height: 3em; margin-left:27px; margin-bottom:10px; padding-left:10px; border:1px soild #979797; /* border-radius:5px; */ display: block;margin: 1em auto;}
[pageId=signup] .gender { text-align:center; width: 80%;margin: 0 auto;position: relative;}
[pageId=signup] .gender>button:nth-child(1) { /* background-color:#122239; */ /* color:white; */ margin-right:3px; margin: 0;}
[pageId=signup] .gender>button.active { background-color:#122239; color:white;}
[pageId=signup] .gender_button { width:246px; border:0; height: 3em; border-radius:5px; width: 50%;float: left;}
[pageId=signup] .gender:after { content:''; clear:both; display:block; }
[pageId=signup] .navy_button { clear:both; margin-top: 3em; /* margin-left:26px; */ padding-bottom: 2em; width: 100%; border-bottom:1px solid #979797; }
[pageId=signup] .navy_button>button {width: 80%;height: 3em; border:0; border-radius:5px; background-color:#122239;background-color: #1765D6;color:white; font-weight:600; font-size:20px;margin: 0 auto;display: block;}
[pageId=signup] .signup_bottom { text-align:center; margin-top:1em; }
[pageId=signup] .signup_bottom span { font-size:17px; color:#979797; }
[pageId=signup] .signup_bottom a { font-size:17px; color:#122239; text-decoration:underline; }

/* myprofile old */
[pageid=myprofile_old] #MY_PAGE:before { content:''; position:absolute; height:1px; background-color: #979797; width:100%; top:12em; }
[pageId=myprofile_old] .layerFrame { padding-bottom:0; }
[pageId=myprofile_old] .page_title { color:#122239; font-size:32px; font-weight:600; height:100px; padding-top:1em; }
[pageId=myprofile_old] .page_content { width:100%; background-color:#f5f5f5; }
[pageId=myprofile_old] .page_content>* { max-width:1200px; margin:0 auto; }
[pageId=myprofile_old] .page_nav { padding:1.5em 0; }
[pageId=myprofile_old] .page_nav a { font-size:20px; font-weight:600; }
[pageId=myprofile_old] .page_nav span:nth-child(1) { color:#122239; }
[pageId=myprofile_old] .page_nav span:nth-child(2) { color:#979797; }
[pageId=myprofile_old] .page_nav span:nth-child(2):before { content:'|'; margin:10px; color:black; font-size:14px; vertical-align:3px; }
[pageId=myprofile_old] .shadow_box { box-shadow:5px 5px 8px 1px lightgray; background-color:white; width:588px; padding:2em; margin-top:3em; margin-bottom:3em; }
[pageId=myprofile_old] .shadow_box>input { width:366px; }
[pageId=myprofile_old] .shadow_box>img { margin-bottom:10px; width: 4em;border-radius: 50%;height: 4em;object-fit: cover;}
[pageId=myprofile_old] .shadow_box input { height:45px; margin-bottom:10px; padding:10px; font-size:16px; }
[pageId=myprofile_old] .shadow_box input#nickName { margin-top:10px; }
[pageId=myprofile_old] .shadow_box button { height:45px; background-color:white; border:1px solid #979797; border-radius:5px; font-size:16px; padding:9px; }
[pageId=myprofile_old] .country_sel { width:366px; height:45px; margin-bottom:10px; }
[pageId=myprofile_old] .country_sel span { font-size:16px; float:left; }
[pageId=myprofile_old] .country_sel>img { float:right; margin-right:5px; margin-top:5px; }
[pageId=myprofile_old] .box_edit input { width:306px; margin-right:3px; }
[pageId=myprofile_old] .box_title p { color:#122239; font-size:26px; font-weight:600; margin-top:0; padding-bottom:15px; border-bottom:1px solid #979797; }
[pageId=myprofile_old] .box_content { width:150px; height:40px; float:left; clear:left; margin-top:10px; }
[pageId=myprofile_old] .box_content span { font-weight:600; color:#122239; }
[pageId=myprofile_old] .shadow_box:nth-child(2) .box_content:nth-child(2) { margin-top:30px; }
[pageId=myprofile_old] .photo_button { float:right; margin-top:20px; }
[pageId=myprofile_old] .photo_button button:nth-child(2) { background-color:#f5f5f5; }
[pageId=myprofile_old] .navy_button { text-align:center; padding-bottom:3em; }
[pageId=myprofile_old] .navy_button>button { width:320px; height:55px; border:0; border-radius:5px; background-color:#122239; color:white; font-size:20px; }
[pageId=myprofile_old] #country{height: 45px; margin-bottom: 10px; padding: 10px; font-size: 16px; width: 366px;}

/* myprofile */
[pageid=myprofile] #MY_PAGE:before {content:'';position:absolute;height:1px;/* background-color: #979797; */width:100%;top:12em;}
[pageId=myprofile] .layerFrame { padding-bottom:0; }
[pageId=myprofile] .page_title { color:#122239; font-size:32px; font-weight:600; height:100px; padding-top:1em; }
[pageId=myprofile] .page_content { width:100%; background-color:#f5f5f5;padding: 0.8em;}
[pageId=myprofile] .page_content>* { max-width:1200px; margin:0 auto; }
[pageId=myprofile] .page_nav { padding:1.5em 0; }
[pageId=myprofile] .page_nav a { font-size:20px; font-weight:600; }
[pageId=myprofile] .page_nav span { color:#979797; }
[pageId=myprofile] .page_nav span + span:before { content:'|'; margin:10px; color:black; font-size:14px; vertical-align:3px; }
[pageId=myprofile] .page_nav span.active { color:#122239; }
[pageId=myprofile] .shadow_box { box-shadow:5px 5px 8px 1px lightgray; background-color:white; width:588px; padding:2em; margin-top:3em; margin-bottom:3em; }
[pageId=myprofile] .shadow_box>input { width:366px; }
[pageId=myprofile] .shadow_box>img { margin-bottom:10px; width: 4em;border-radius: 50%;height: 4em;object-fit: cover;}
[pageId=myprofile] .shadow_box input { height:45px; margin-bottom:10px; padding:10px; font-size:16px; }
[pageId=myprofile] .shadow_box input#nickName { margin-top:10px; }
[pageId=myprofile] .shadow_box button { height:45px; background-color:white; border:1px solid #979797; border-radius:5px; font-size:16px; padding:9px; }
[pageId=myprofile] .country_sel { width:366px; height:45px; margin-bottom:10px; }
[pageId=myprofile] .country_sel span { font-size:16px; float:left; }
[pageId=myprofile] .country_sel>img { float:right; margin-right:5px; margin-top:5px; }
[pageId=myprofile] .box_edit input { width:306px; margin-right:3px; }
[pageId=myprofile] .box_title p { color:#122239; font-size:26px; font-weight:600; margin-top:0; padding-bottom:15px; border-bottom:1px solid #979797; }
[pageId=myprofile] .box_content { width:150px; height:40px; float:left; clear:left; margin-top:10px; }
[pageId=myprofile] .box_content span { font-weight:600; color:#122239; }
[pageId=myprofile] .shadow_box:nth-child(2) .box_content:nth-child(2) { margin-top:30px; }
[pageId=myprofile] .photo_button { float:right; margin-top:20px; }
[pageId=myprofile] .photo_button button:nth-child(2) { background-color:#f5f5f5; }
[pageId=myprofile] .navy_button { text-align:center; padding-bottom:3em; }
[pageId=myprofile] .navy_button>button { width:320px; height:55px; border:0; border-radius:5px; background-color:#122239; color:white; font-size:20px; }
[pageId=myprofile] #country{height: 45px; margin-bottom: 10px; padding: 10px; font-size: 16px; width: 366px;}

/* dailyquest */
[pageid=dailyquest] #DAILY_QUEST:before { content:''; position:absolute; height:1px; background-color: #979797; width:100%; top:12em; }
[pageId=dailyquest] .layerFrame { padding-bottom:5em; }
[pageId=dailyquest] .page_title { color:#122239; font-size:32px; font-weight:600; height:100px; padding-top:1em; }
[pageId=dailyquest] .page_content { width:100%; }
[pageId=dailyquest] .page_content>* { max-width:1200px; margin:0 auto; }
[pageId=dailyquest] .page_content:nth-child(2) { background-color:#f5f5f5; padding-bottom:0.2em; }
[pageId=dailyquest] .page_content:nth-child(3) { background-color:#d9d9d9;  clear:both; height:3.6em; }
[pageId=dailyquest] .page_content:nth-child(4) { background-color:#f5f5f5; }
[pageId=dailyquest] .page_nav { padding:1.5em 0; }
[pageId=dailyquest] .page_nav a { font-size:20px; font-weight:600; }
[pageId=dailyquest] .page_nav span:nth-child(1) { color:#979797; }
[pageId=dailyquest] .page_nav span:nth-child(2) { color:#122239; }
[pageId=dailyquest] .page_nav span:nth-child(2):before { content:'|'; margin:10px; color:black; font-size:14px; vertical-align:3px; }
[pageId=dailyquest] .quest_nav { padding:1em 0; float:left; }
[pageId=dailyquest] .quest_nav a { font-size:20px; font-weight:600; }
[pageId=dailyquest] .quest_nav span:nth-child(2) { color:#979797; }
[pageId=dailyquest] .quest_nav span:nth-child(3) { color:#979797; }
[pageId=dailyquest] .quest_nav span:nth-child(2):before { content:'|'; margin:10px; color:black; font-size:14px; vertical-align:3px; }
[pageId=dailyquest] .quest_nav span:nth-child(3):before { content:'|'; margin:10px; color:black; font-size:14px; vertical-align:3px; }
[pageId=dailyquest] .my_point { padding:1em 0; float:right; }
[pageId=dailyquest] .my_point span { font-size:20px; }
[pageId=dailyquest] .my_point span:nth-child(2) { font-weight:600; }
[pageId=dailyquest] .my_point span:nth-child(2):before { content:'|'; color:black; font-size:14px; vertical-align:2px; margin:0.8em; }
[pageId=dailyquest] .my_point>button { border:0; border-radius:23px; background-color:black; width:22px; height:22px; position:relative; vertical-align:0.3em; }
[pageId=dailyquest] .my_point>button span { color:white; font-size:16px; position:absolute; right:0.41em; bottom:0.15em; }
[pageId=dailyquest] .init_info { text-align:right; padding-top:2.5em; margin-bottom:0.5em; }
[pageId=dailyquest] .init_info span { font-size:15px; font-weight:600; }
[pageId=dailyquest] .shadow_box { clear:both; background-color:white; box-shadow:5px 5px 8px 1px lightgray; width:70em; height:6em; margin-bottom:1em; }
[pageId=dailyquest] .shadow_box>img { float:left; margin:0.7em; }
[pageId=dailyquest] .medal_info { float:left; }
[pageId=dailyquest] .medal_title { font-size:20px; font-weight:600; margin-top:0.6em; margin-bottom:0.2em; }
[pageId=dailyquest] .medal_content { margin-top:0.3em; margin-bottom:0.5em; }
[pageId=dailyquest] .medal_progress { width:45em; background-color:#979797; border-radius:10px; text-align:center; position:absolute; }
[pageId=dailyquest] .medal_progress_cur { height:1.2em; background-color:#1765d6; border-radius:10px; float:left; }
[pageId=dailyquest] .medal_progress_num { width:45em; position:absolute; }
[pageId=dailyquest] .medal_progress_num span { font-size:16px; }
[pageId=dailyquest] .medal_state { float:right; width:14.7em; height:6em; position:relative; }
[pageId=dailyquest] .medal_state span { position:absolute; top:2.1em; left:4.1em; font-size:20px; font-weight:600; width:5em; text-align:center; }

/* mycontest */
[pageId=mycontest] .layerFrame { padding-bottom:0; }
[pageId=mycontest] .page_title { color:#122239; font-size:32px; font-weight:600; height:100px; padding-top:1em; }
[pageId=mycontest] .page_content {width:100%;background-color:#f5f5f5;padding: 0.8em;padding-right: 0;}
[pageId=mycontest] .page_content>* { max-width:1200px; margin:0 auto; }
[pageId=mycontest] .page_nav { padding:1.5em 0; }
[pageId=mycontest] .page_nav a { font-size:20px; font-weight:600; }
[pageId=mycontest] .page_nav span { color:#979797; }
[pageId=mycontest] .page_nav span + span:before { content:'|'; margin:10px; color:black; font-size:14px; vertical-align:3px; }
[pageId=mycontest] .page_nav span.active { color:#122239; }
[pageId=mycontest] .shadow_box { box-shadow:5px 5px 8px 1px lightgray; background-color:white;/* width:588px; *//* padding:2em; *//* margin-top:3em; *//* margin-bottom:3em; */padding: 0;}
[pageId=mycontest] .shadow_box img { width:100%;height: auto;object-fit: contain;position: relative;display: block;}
[pageId=mycontest] #SEARCH_FROM { background-color:#f5f5f5; padding-bottom:1px; }
[pageId=mycontest] #MY_CONTEST_LIST:before { content:'';height: 1px;width: 100%;position: absolute;left:0;bottom: 0em;background-color:black;}
[pageId=mycontest] #MY_CONTEST_LIST .sub-input { position:relative;display: none;}
[pageId=mycontest] #MY_CONTEST_LIST .sub-input ul {   }
[pageId=mycontest] #MY_CONTEST_LIST .sub-input ul li { font-size:1.2em; margin-left:0 ;color: #B3B3B3;cursor: pointer;}
[pageId=mycontest] #MY_CONTEST_LIST .sub-input ul li + li { margin-left:2em; }
[pageId=mycontest] #MY_CONTEST_LIST .sub-input ul li + li:before { content:'|'; position:absolute; left:-1em; color: black; }
[pageId=mycontest] #MY_CONTEST_LIST .sub-input ul li.active { color:black;float: none;}
[pageId=mycontest] #MY_CONTEST_LIST .upload { position:absolute; right:0; top:0; width: 160px;width: 7.8em;line-height: 48px;line-height: 1.9em;border-radius: 3em;border: 0;color: white;background-color: #1765D6;padding-left: 1.2em;font-size: 1.4em;cursor: pointer;}
[pageId=mycontest] #MY_CONTEST_LIST .upload:after { content:''; background-image:url(/images/contest_upload_icon.png); background-repeat: no-repeat;background-position: center;position: absolute;top: 16%;left: 9%;width: 1.35em;height: 1.35em;}
[pageId=mycontest] #MY_CONTEST_LIST .order-desc { margin-top:1em; display:block; line-height:3em; font-size:1.2em; text-align:right; position: relative;padding-right: 1.5em;display: none;}
[pageId=mycontest] #MY_CONTEST_LIST .order-desc:after { content:'∨'; color:#666; font-size:1.5em; font-weight:100; position: absolute;right: 0;}
[pageId=mycontest] #MY_CONTEST_LIST {overflow: hidden;padding-top: 0;}
[pageId=mycontest] #MY_CONTEST_LIST ul.list>li {box-shadow: 5px 5px 8px 1px grey; overflow:hidden;cursor: pointer;margin-bottom: 4%;border-radius: 16px;}
[pageId=mycontest] #MY_CONTEST_LIST ul.list>li.active .overTitle,
[pageId=mycontest] #MY_CONTEST_LIST ul.list>li:hover .overTitle { display:block; transition:0.5s all; opacity:1; top:auto; bottom:0; font-size: 0.9em;}
[pageId=mycontest] #MY_CONTEST_LIST ul.list>li .overTitle span { color: #979797; font-size: 0.9em;display: block;margin-bottom: 0.5em;}
[pageId=mycontest] #MY_CONTEST_LIST .list { margin-top:2em; }

/* mycontestDetail */
[pageId=mycontestDetail] .layerFrame { padding-bottom:0; }
[pageId=mycontestDetail] .layerFrame .innerFrame {width: 800px;}
[pageId=mycontestDetail] .layerFrame .innerFrame:after { content:''; clear:both; display:block; }
[pageId=mycontestDetail] .page_title { color:#122239; font-size:32px; font-weight:600; height:100px; padding-top:1em; }
[pageId=mycontestDetail] .page_content { width:100%; background-color:#f5f5f5;padding: 0.8em;}
[pageId=mycontestDetail] .page_content>* { max-width:1200px; margin:0 auto; }
[pageId=mycontestDetail] .page_nav { padding:1.5em 0; }
[pageId=mycontestDetail] .page_nav a { font-size:20px; font-weight:600; }
[pageId=mycontestDetail] .page_nav span { color:#979797; }
[pageId=mycontestDetail] .page_nav span + span:before { content:'|'; margin:10px; color:black; font-size:14px; vertical-align:3px; }
[pageId=mycontestDetail] .page_nav span.active { color:#122239; }
[pageId=mycontestDetail] .shadow_box {box-shadow: 5px 5px 8px 4px lightgrey; background-color:white;width: 100%; margin:10px auto;/* padding:2em; *//* margin-top:3em; *//* margin-bottom:3em; */padding-bottom: 3em;}
[pageId=mycontestDetail] .shadow_box img { width:100%;margin-bottom: 2em;}
[pageId=mycontestDetail] .shadow_box>input {width: calc( 100% - 14em);}
[pageId=mycontestDetail] .shadow_box input { height:45px; margin-bottom:10px; padding:10px; font-size:16px; }
[pageId=mycontestDetail] .shadow_box input#nickName { margin-top:10px; }
[pageId=mycontestDetail] .shadow_box textarea {height: 160px;width: 425px;height: 9em;resize: none; margin-bottom:10px; padding:10px; font-size:16px;width: calc( 100% - 14em);}
[pageId=mycontestDetail] .box_content { width:150px; height:40px; float:left; clear:left; margin-top:10px;padding-left: 2em;}
[pageId=mycontestDetail] .box_content span { font-weight:600; color:#122239;padding-left: 1em;font-size: 16px;}
[pageId=mycontestDetail] .layerFrame { padding-bottom:0; }
[pageId=mycontestDetail] .buttons { float:right;margin-top: 10px;margin-bottom: 20px;padding-right: 8px;}
[pageId=mycontestDetail] .buttons button {border-radius: 5px;border: 1px solid #BDBDBD;width: 100px;height: 40px;background-color: #fefefe;font-weight: 500;}
[pageId=mycontestDetail] .buttons button:nth-child(2) {/* background-color: #f4f4f4; */border-color: red;color: red;}

/* myMessage */
[pageId=myMessage] .layerFrame { padding-bottom:0; }
[pageId=myMessage] .page_title { color:#122239; font-size:32px; font-weight:600; height:100px; padding-top:1em; }
[pageId=myMessage] .page_content { width:100%; background-color:#f5f5f5;padding: 0.8em;}
[pageId=myMessage] .page_content>* { max-width:1200px; margin:0 auto; }
[pageId=myMessage] .page_nav { padding:1.5em 0; }
[pageId=myMessage] .page_nav a { font-size:20px; font-weight:600; }
[pageId=myMessage] .page_nav span { color:#979797; }
[pageId=myMessage] .page_nav span + span:before { content:'|'; margin:10px; color:black; font-size:14px; vertical-align:3px; }
[pageId=myMessage] .page_nav span.active { color:#122239; }
[pageId=myMessage] .searchView {position: relative;width: 100%;margin-bottom: 1em;}
[pageId=myMessage] .page_table {padding-top: 2em;}
[pageId=myMessage] .item { display: inline-block; }
[pageId=myMessage] .item span { margin-left: 10px; margin-right: 10px; font-size: 1.2em; }
[pageId=myMessage] .btns { position: absolute; right: 0; bottom: 0.3em; }
[pageId=myMessage] table.grid {width: 100%;border-collapse: collapse;border-bottom-width: 0;border-right-width: 0;border-top: 1px solid #122239;margin-bottom:3em;}
[pageId=myMessage] table.grid th,
[pageId=myMessage] table.grid td { line-height: 2em; }
[pageId=myMessage] table.grid th,
[pageId=myMessage] table.grid thead td { background-color: lightblue; }
[pageId=myMessage] table.grid tbody td { position: relative; }
[pageId=myMessage] table.grid tbody tr:nth-child(4n-1) { background-color:white; }
[pageId=myMessage] table.grid tbody tr:nth-child(4n-3) { background-color:#eee; }
[pageId=myMessage] tr.msgDetail { display:none; }
[pageId=myMessage] tr.msgDetail.active { display:table-row; }
[pageId=myMessage] tr.msgDetail.active div {min-height:4em;z-index:100;height: auto;width: 90%;padding: 10px 10px 10px 10px;background: #FFFFFF;border-radius: 5px;border: #7F7F7F solid 1px;position: absolute;top: 10px;font-size: 16px;text-align: left;}
[pageId=myMessage] tr.msgDetail.active div:after {content: '';position: absolute;border-style: solid;border-width: 0 16px 20px 17.5px;border-color: #FFFFFF transparent;display: block;width: 0;z-index: 1;top: -18.5px;left: 6em;}
[pageId=myMessage] tr.msgDetail.active div:before {content: '';position: absolute;border-style: solid;border-width: 0 16px 20px 17.5px;border-color: #7F7F7F transparent;display: block;width: 0;z-index: 0;top: -20px;left: 6em;}
[pageid="myMessage"] {}
[pageid="myMessage"] #btnSearch {background-color: #122239;color: white;border-radius: 3px;box-shadow: 2px 2px 4px rgb(128 128 128 / 72%);border: 1px solid white;line-height: 2em;min-width: 6em;}

/* myReply */
[pageid=myReply] #MY_REPLY:before {content:'';position:absolute;height:1px;/* background-color: #979797; */width:100%;top:12em;}
[pageId=myReply] .layerFrame { padding-bottom:0; }
[pageId=myReply] .page_title { color:#122239; font-size:32px; font-weight:600; height:100px; padding-top:1em; }
[pageId=myReply] .page_content {width:100%;background-color:#f5f5f5;padding: 0.5em;}
[pageId=myReply] .page_content>* { max-width:1200px; margin:0 auto; }
[pageId=myReply] .page_nav { padding:1.5em 0; }
[pageId=myReply] .page_nav a { font-size:20px; font-weight:600; }
[pageId=myReply] .page_nav span { color:#979797; }
[pageId=myReply] .page_nav .page_nav span + span:before { content:'|'; margin:10px; color:black; font-size:14px; vertical-align:3px; }
[pageId=myReply] .page_nav span.active { color:#122239; }
[pageId=myReply] .page_nav span + span:before { content:'|'; margin:10px; color:black; font-size:14px; vertical-align:3px; }
[pageId=myReply] .searchView {position: relative;width: 100%;margin-bottom: 1em;}
[pageId=myReply] .page_table {padding-top: 2em;}
[pageId=myReply] .item { display: inline-block; }
[pageId=myReply] .item span { margin-left: 10px; margin-right: 10px; font-size: 1.2em; }
[pageId=myReply] .btns { position: absolute; right: 0; bottom: 0.3em; }
[pageId=myReply] table.grid {width: 100%;border-collapse: collapse;border-bottom-width: 0;border-right-width: 0;border-top: 1px solid #122239;margin-bottom:3em;}
[pageId=myReply] table.grid th,
[pageId=myReply] table.grid td { line-height: 2em; }
[pageId=myReply] table.grid th,
[pageId=myReply] table.grid thead td { background-color: lightblue; }
[pageId=myReply] table.grid tbody td { position: relative; }
[pageId=myReply] table.grid tbody tr:nth-child(4n-1) { background-color:white; }
[pageId=myReply] table.grid tbody tr:nth-child(4n-3) { background-color:#eee; }
[pageId=myReply] tr.msgDetail { display:none; }
[pageId=myReply] tr.msgDetail.active { display:table-row; }
[pageId=myReply] tr.msgDetail.active div {min-height:4em;z-index:100;height: auto;width: 90%;padding: 10px 10px 10px 10px;background: #FFFFFF;border-radius: 5px;border: #7F7F7F solid 1px;position: absolute;top: 10px;font-size: 16px;text-align: left;}
[pageId=myReply] tr.msgDetail.active div:after {content: '';position: absolute;border-style: solid;border-width: 0 16px 20px 17.5px;border-color: #FFFFFF transparent;display: block;width: 0;z-index: 1;top: -18.5px;left: 6em;}
[pageId=myReply] tr.msgDetail.active div:before {content: '';position: absolute;border-style: solid;border-width: 0 16px 20px 17.5px;border-color: #7F7F7F transparent;display: block;width: 0;z-index: 0;top: -20px;left: 6em;}
[pageid="myReply"] {}
[pageid="myReply"] #btnSearch {background-color: #122239;color: white;border-radius: 3px;box-shadow: 2px 2px 4px rgb(128 128 128 / 72%);border: 1px solid white;line-height: 2em;min-width: 6em;}
[pageId=myReply] tr.msgMain td button.delete {border-radius: 100%;border-width: 0;background-color: #1765d6;color: white;margin: 1px auto;background-image: url(../images/delete.svg);background-size: 55%;background-position: center;background-repeat: no-repeat;width: 1.5em;height: 1.5em;}

/* myFollow */
[pageid=myFollow] #MY_FOLLOW:before {content:'';position:absolute;height:1px;/* background-color: #979797; */width:100%;top:12em;}
[pageId=myFollow] .layerFrame { padding-bottom:0; }
[pageId=myFollow] .page_title { color:#122239; font-size:32px; font-weight:600; height:100px; padding-top:1em; }
[pageId=myFollow] .page_content { width:100%; background-color:#f5f5f5;padding: 0.8em;}
[pageId=myFollow] .page_content>* { max-width:1200px; margin:0 auto; }
[pageId=myFollow] .page_nav { padding:1.5em 0; }
[pageId=myFollow] .page_nav a { font-size:20px; font-weight:600; }
[pageId=myFollow] .page_nav span { color:#979797; }
[pageId=myFollow] .page_nav span + span:before { content:'|'; margin:10px; color:black; font-size:14px; vertical-align:3px; }
[pageId=myFollow] .page_nav span.active { color:#122239; }
[pageId=myFollow] .searchView {position: relative;width: 100%;margin-bottom: 1em;}
[pageId=myFollow] .page_table {padding-top: 2em;}
[pageId=myFollow] .item { display: inline-block; }
[pageId=myFollow] .item span { margin-left: 10px; margin-right: 10px; font-size: 1.2em; }
[pageId=myFollow] .btns { position: absolute; right: 0; bottom: 0.3em; }
[pageId=myFollow] table.grid {width: 100%;border-collapse: collapse;border-bottom-width: 0;border-right-width: 0;border-top: 1px solid #122239;margin-bottom:3em;}
[pageId=myFollow] table.grid th,
[pageId=myFollow] table.grid td { line-height: 2em; }
[pageId=myFollow] table.grid th,
[pageId=myFollow] table.grid thead td { background-color: lightblue; }
[pageId=myFollow] table.grid tbody td { position: relative; }
[pageId=myFollow] table.grid tbody td>img.userImage {height:2em;width: 2em;vertical-align:middle;border-radius: 2em;object-fit: cover;margin: 0.5em;}
[pageId=myFollow] table.grid tbody tr:nth-child(4n-1) { background-color:white; }
[pageId=myFollow] table.grid tbody tr:nth-child(4n-3) { background-color:#eee; }
[pageId=myFollow] tr.msgDetail { display:none; }
[pageId=myFollow] tr.msgDetail.active { display:table-row; }
[pageId=myFollow] tr.msgDetail.active div {min-height:4em;z-index:100;height: auto;width: 90%;padding: 10px 10px 10px 10px;background: #FFFFFF;border-radius: 5px;border: #7F7F7F solid 1px;position: absolute;top: 10px;font-size: 16px;text-align: left;}
[pageId=myFollow] tr.msgDetail.active div:after {content: '';position: absolute;border-style: solid;border-width: 0 16px 20px 17.5px;border-color: #FFFFFF transparent;display: block;width: 0;z-index: 1;top: -18.5px;left: 6em;}
[pageId=myFollow] tr.msgDetail.active div:before {content: '';position: absolute;border-style: solid;border-width: 0 16px 20px 17.5px;border-color: #7F7F7F transparent;display: block;width: 0;z-index: 0;top: -20px;left: 6em;}
[pageid="myFollow"] {}
[pageid="myFollow"] #btnSearch {background-color: #122239;color: white;border-radius: 3px;box-shadow: 2px 2px 4px rgb(128 128 128 / 72%);border: 1px solid white;line-height: 2em;min-width: 6em;}
/* [pageId=myFollow] tr.msgMain td button.delete {border-radius: 100%;border-width: 0;background-color: #1765d6;color: white;margin: 1px auto;background-image: url(../images/delete.svg);background-size: 55%;background-position: center;background-repeat: no-repeat;width: 1.5em;height: 1.5em;} */
/* [pageId=myFollow] tr.msgMain td button.link {border-radius: 100%;border-width: 0;background-color: #1765d6;color: white;margin: 1px auto;background-image: url(../images/gray_view_icon.png);background-size: 55%;background-position: center;background-repeat: no-repeat;width: 1.5em;height: 1.5em;} */





/* board detail */
[pageId=notice_post] .page_title { color:#122239; font-size:32px; font-weight:600; height:70px; padding-top:1em; }
[pageId=notice_post] .post_info p:nth-child(1) { font-size:26px; font-weight:600; margin-bottom:8px; }
[pageId=notice_post] .post_info { border-bottom:2px solid #c8c8c8; }
[pageId=notice_post] .post_content>div { padding:2em 0; }
[pageId=notice_post] .post_content { border-bottom:2px solid #c8c8c8; padding:2em 0; }
[pageId=notice_post] .post_list button { width:100px; height:35px; background-color:#494949; color:white; border:0; border-radius:5px; margin-top:1em; }

[pageId=winners_post] .page_title { color:#122239; font-size:32px; font-weight:600; height:70px; padding-top:1em; }
[pageId=winners_post] .post_info p:nth-child(1) { font-size:26px; font-weight:600; margin-bottom:8px; }
[pageId=winners_post] .post_info { border-bottom:2px solid #c8c8c8; }
[pageId=winners_post] .post_content { border-bottom:2px solid #c8c8c8; padding:2em 0; }
[pageId=winners_post] .post_list button { width:100px; height:35px; background-color:#494949; color:white; border:0; border-radius:5px; margin-top:1em; }

[pageId=pr_post] .page_title { color:#122239; font-size:32px; font-weight:600; height:70px; padding-top:1em; }
[pageId=pr_post] .post_info p:nth-child(1) { font-size:26px; font-weight:600; margin-bottom:8px; }
[pageId=pr_post] .post_info { border-bottom:2px solid #c8c8c8; }
[pageId=pr_post] .post_content>div { padding:2em 0; }
[pageId=pr_post] .post_content { border-bottom:2px solid #c8c8c8; padding:2em 0; }
[pageId=pr_post] .post_list button { width:100px; height:35px; background-color:#494949; color:white; border:0; border-radius:5px; margin-top:1em; }

[pageId=winnersDetail] .page_title { color:#122239; font-size:32px; font-weight:600; height:70px; padding-top:1em; }
[pageId=winnersDetail] .post_info p:nth-child(1) { font-size:26px; font-weight:600; margin-bottom:8px; position:relative; }
[pageId=winnersDetail] .post_info p:nth-child(1) a { font-size:26px; }
[pageId=winnersDetail] .post_info p:nth-child(1) a.link { font-size:20px;}
[pageId=winnersDetail] .post_info p:nth-child(1) a.link:before {content:'🤍';}
[pageId=winnersDetail] .like-on .post_info p:nth-child(1) a.link:before { content:'❤️'; }
[pageId=winnersDetail] .post_info p:nth-child(1) .regDate { position:absolute; right:0;bottom: 0;font-weight: normal;font-size: 15px;}
[pageId=winnersDetail] .post_info { border-bottom:2px solid #c8c8c8; }
[pageId=winnersDetail] .post_content { border-bottom:2px solid #c8c8c8; padding:2em 0; }
[pageId=winnersDetail] .post_list { position:relative; }
[pageId=winnersDetail] .post_list button { width:100px; height:35px; background-color:#494949; color:white; border:0; border-radius:5px; margin-top:1em; }
[pageId=winnersDetail] button.btnLike {float: right;background-color: #e0e0e0;border: 1px solid #aaa;width: auto;color: black;height: 35px;border-radius: 5px;}
[pageId=winnersDetail] button.btnLike:before { content:'🤍';  margin-right:0.3em}
[pageId=winnersDetail] .like-on button.btnLike:before { content:'❤️'; margin-right:0.3em }
[pageId=winnersDetail] .linkUrl {/* margin-top:1em; *//* display:block; */}
[pageId=winnersDetail] .linkUrl:hover { color:blue; background-color:#f4f4f4; padding-top:0.3em; padding-bottom:0.3em; }

[pageId=winnersDetail] .post_list:after { content:''; clear:both; display:block; }

[pageId=samplesDetail] .page_title { color:#122239; font-size:32px; font-weight:600; height:70px; padding-top:1em; }
[pageId=samplesDetail] .post_info { border-bottom:2px solid #c8c8c8; }
[pageId=samplesDetail] .post_info p:nth-child(1) { font-size:26px; font-weight:600; margin-bottom:8px; position:relative; }
[pageId=samplesDetail] .post_content { border-bottom:2px solid #c8c8c8; padding:2em 0; }
[pageId=samplesDetail] .post_list { position:relative; }
[pageId=samplesDetail] .post_list button { width:100px; height:35px; background-color:#494949; color:white; border:0; border-radius:5px; margin-top:1em; }
[pageId=samplesDetail] button.btnLike {float: right;background-color: #e0e0e0;border: 1px solid #aaa;width: auto;color: black;height: 35px;border-radius: 5px;}
[pageId=samplesDetail] button.btnLike:before { content:'🤍';  margin-right:0.3em}
[pageId=samplesDetail] .like-on button.btnLike:before { content:'❤️'; margin-right:0.3em }
[pageId=samplesDetail] .linkUrl {/* margin-top:1em; *//* display:block; */}
[pageId=samplesDetail] .linkUrl:hover { color:blue; background-color:#f4f4f4; padding-top:0.3em; padding-bottom:0.3em; }

[pageId=samplesDetail] .post_list:after { content:''; clear:both; display:block; }

[pageId=noticeDetail] .page_title { color:#122239; font-size:32px; font-weight:600; height:70px; padding-top:1em; }
[pageId=noticeDetail] .post_info p:nth-child(1) { font-size:26px; font-weight:600; margin-bottom:8px; }
[pageId=noticeDetail] .post_info { border-bottom:2px solid #c8c8c8; }
[pageId=noticeDetail] .post_content>div { padding:2em 0; }
[pageId=noticeDetail] .post_content { border-bottom:2px solid #c8c8c8; padding:2em 0; }
[pageId=noticeDetail] .post_list button { width:100px;height: 40px; background-color:#494949; color:white; border:0; border-radius:5px; margin-top:1em;}

[pageId=prVideoDetail] .page_title { color:#122239; font-size:32px; font-weight:600; height:70px; padding-top:1em; }
[pageId=prVideoDetail] .post_info p:nth-child(1) { font-size:26px; font-weight:600; margin-bottom:8px; }
[pageId=prVideoDetail] .post_info { border-bottom:2px solid #c8c8c8; }
[pageId=prVideoDetail] .post_content>div { padding:2em 0; }
[pageId=prVideoDetail] .post_content { border-bottom:2px solid #c8c8c8; padding:2em 0; }
[pageId=prVideoDetail] .post_list button { width:100px;height: 40px; background-color:#494949; color:white; border:0; border-radius:5px; margin-top:1em;}
img.height-max {  /* width: fit-content; *//* height: 100%; */}

.writeFormPopup {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,0.5);z-index: 100; display:none;/* max-height: calc( 100% - 15em ); *//* overflow: auto; */}
.writeFormPopup .view {position: relative;width: 70%;max-width: 1000px;min-width: 360px;background-color: white;margin: 0 auto;margin-top: 4em;border-radius: 1em;box-shadow: 5px 5px 8px 1px rgba(128,128,128,0.5);border: 0.2em solid black;max-height: calc( 100% - 7em );overflow: auto;}
.writeFormPopup .view .header {position: relative;padding: 1em 2em;font-size: 1.5em;font-weight: 900;}
.writeFormPopup .view .header:after { content:'';width: 0.25em; background-color:#1765d6;height: 1em;position: absolute;top: 1.1em;left: 1.5em;}
.writeFormPopup .view .header + .body { margin-top:-2em ;height: calc( 100% - 15em );max-height: calc( 100% - 15em );/* overflow: auto; */}
.writeFormPopup .view .body { position:relative; padding: 2em; }
.writeFormPopup .view .body p { margin: 0.3em 0; }
.writeFormPopup .view input[type=text] {width: 100%;border: 1px solid #ccc;line-height: 2em;padding-left: 0.5em;margin-bottom: 0.5em;}
.writeFormPopup .view input[type=checkbox] { }
.writeFormPopup .view textarea {width: 100%;height: 22em;resize: none;border: 1px solid #ccc;}
.writeFormPopup .view .body>.buttons button,
.writeFormPopup .view .body>button {width: 100%;background-color: #1765d6;border: 0;line-height: 2em;max-width: 200px;margin: 0 auto;display: block;border-radius: 4px;color: white;font-size: 1.3em;font-weight: bold;margin-top: 1em;}
.writeFormPopup .view .body>.buttons { width: 100%; text-align: center; }
.writeFormPopup .view .body>.buttons button {display: inline-block;width: 300px;height: 50px;font-size: 18px;}
.writeFormPopup .view .body>.buttons button + button { margin-left:1em; }
.writeFormPopup .view .body>.buttons button.btnDelete { background-color:#b70101;display: none;}
.writeFormPopup .view label {font-size:17px;}
.writeFormPopup .view .group {}
.writeFormPopup .view .note-editor .note-editing-area .note-editable { min-height:300px; }
.writeFormPopup .btnClose { top: -2em; right: 0.8em; }
.writeFormPopup.maxScreen .view { width:100%;max-width: none;height: 100%;max-height: none;margin: 0;}

.writeFormPopup2 {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,0.5);z-index: 100; display:none;/* max-height: calc( 100% - 15em ); *//* overflow: auto; */}
.writeFormPopup2 .view {position: relative;width: 70%;max-width: 1000px;min-width: 360px;background-color: white;margin: 0 auto;margin-top: 4em;border-radius: 1em;box-shadow: 5px 5px 8px 1px rgba(128,128,128,0.5);border: 0.2em solid black;max-height: calc( 100% - 7em );overflow: auto;}
.writeFormPopup2 .view .header {position: relative;padding: 1em 2em;font-size: 1.5em;font-weight: 900;}
.writeFormPopup2 .view .header:after { content:'';width: 0.25em; background-color:#1765d6;height: 1em;position: absolute;top: 1.1em;left: 1.5em;}
.writeFormPopup2 .view .header + .body { margin-top:-2em ;height: calc( 100% - 15em );max-height: calc( 100% - 15em );/* overflow: auto; */}
.writeFormPopup2 .view .body { position:relative; padding: 2em; }
.writeFormPopup2 .view .body p { margin: 0.3em 0; }
.writeFormPopup2 .view .receiver { margin-bottom:0.5em; display:block; }
.writeFormPopup2 .view .receiver:before {content:'To : '; color:#1765d6; font-weight:bold; }
.writeFormPopup2 .view input[type=text] {width: 100%;border: 1px solid #ccc;line-height: 2em;padding-left: 0.5em;margin-bottom: 0.5em;}
.writeFormPopup2 .view input[type=checkbox] { }
.writeFormPopup2 .view textarea {width: 100%;height: 22em;resize: none;border: 1px solid #ccc;}
.writeFormPopup2 .view .body>.buttons button,
.writeFormPopup2 .view .body>button {width: 100%;background-color: #1765d6;border: 0;line-height: 2em;max-width: 200px;margin: 0 auto;display: block;border-radius: 4px;color: white;font-size: 1.3em;font-weight: bold;margin-top: 1em;}
.writeFormPopup2 .view .body>.buttons { width: 100%; text-align: center; }
.writeFormPopup2 .view .body>.buttons button {display: inline-block;width: 300px;height: 50px;font-size: 18px;}
.writeFormPopup2 .view .body>.buttons button + button { margin-left:1em; }
.writeFormPopup2 .view .body>.buttons button.btnDelete { background-color:#b70101;display: none;}
.writeFormPopup2 .view label {font-size:17px;}
.writeFormPopup2 .view .group {}
.writeFormPopup2 .view .note-editor .note-editing-area .note-editable { min-height:300px; }
.writeFormPopup2 .btnClose { top: -2em; right: 0.8em; }
.writeFormPopup2.maxScreen .view { width:100%;max-width: none;height: 100%;max-height: none;margin: 0;}

.fileList { margin-bottom:0.5em;position: relative;display: block;width: 100%;min-height: 2em;display: none;}
.fileList li {padding: 0.2em 0.4em;font-size: 0.8em;float:left;max-width: 10em; overflow:hidden;white-space: nowrap;text-overflow: ellipsis;display: inline-block;}
.fileList li + li {  }
.fileList li:first-child { margin-left: 0; }
.fileList li:last-child { position:absolute; right:0;bottom: 0;background-color: #1765d6;color: white;border-radius: 5px;font-size: 1em;padding: 0.25em 1em;max-width: none;display: block;}
.fileList:after { content:''; clear:both; display:block;  }

*>span.count[max] { position:relative;top: 0;font-size: 0.9em;color: #aaa;display: none;}
*>span.count[max].active { display:block; }
*>span.count[max]:before {content:'[';}
*>span.count[max]:after {content:']';}
*>span.count[max].over { color:red; }


.person_page {position: relative;/* background-color: #f5f5f5; */}
.person_page>div {}
.person_page>div.info {background-color: whitesmoke;}
.person_page>div.info>div { max-width:1200px; margin:0 auto; position:relative; }
.person_page>div.info>div>img {display:inline-block;vertical-align: text-bottom;/* margin:2em; *//* margin-left:0; */width: 7em;height: 7em;border-radius: 7em;object-fit: cover;}
.person_page>div.info>div>img + ul {display:inline-block;padding-top: 3em;padding-bottom: 2em;padding-left: 4em;width: calc( 100% - 10em );}
.person_page>div.info>div>img + ul li { display:inline-block; }
.person_page>div.info>div>ul li.nickname {font-weight:bold;font-size:1.5em;margin-right: 2em;}
.person_page>div.info>div>ul li.searchArea {position:absolute;right:1em;}
.person_page>div.info>div>ul li.searchArea input {border:0;border-bottom:1px solid #444;background:none;width: 20em;}
.person_page>div.info>div>ul li.count {display:block;padding-top: 1.5em;}
.person_page>div.info>div>ul li.count span { font-size:1.2em; font-weight:bold; }
.person_page>div.info>div>ul li.count span + span {margin-left: 2em;}
.person_page>div.info>div>ul li.count span:before { font-weight:normal; padding-right:0.4em; }
.person_page>div.info>div>ul li.count span.postCount:before { content:'Post'; }
.person_page>div.info>div>ul li.count span.followersCount:before { content:'Followers'; }
.person_page>div.info>div>ul li.count span.followingCount:before { content:'Followings'; }
.person_page>div.info>div>ul li.count span.messageCount:before { content:'Messages'; }

.person_page>div.info>div>ul li.comments {display:block;padding-top: 1em;font-size: 0.9em;width: 100%;}
.person_page>div.info>div>ul li.comments input {width: calc( 100% - -7em );display: block;border: none;background-color: whitesmoke;border-bottom: 1px solid #bbb;}
.person_page button {background-color:#efefef;border: 1px solid #767676;border-radius:3px;padding: 0.5em 1em;}
.person_page button + button {margin-left: 0.5em;}
.person_page #btnFollow.follow {background-color: #0e6cd7d6;border: 1px solid #0e6cd7d6;color: #fff;margin-left: 1em;}
.person_page>div.postList {max-width: 1200px;margin: 0 auto;background-color:white;padding-top: 4em;padding-bottom: 4em;}
.person_page>div.postList .text {border:1px solid #ddd;width: 100%;height: 100%;overflow: hidden;margin: 0;padding: 0.5em;}
.person_page>div.postList .pic4x3>img {object-fit: cover;}
.person_page>div.postList .pic4x3 { cursor:pointer; }

.person_page .msgList {position: absolute;top: 0;right: 0;width: 30%;height: auto; border-left:1px solid #ccc}
.person_page .msgList .header {font-size: 1.5em;font-weight: bold;margin: 10px;}
.person_page .msgList.active {display: block;}
.person_page .msgList .btnClose {width: 1.5em;height: 1.5em;position: absolute;top: 0.7em;right: 0.5em;cursor: pointer;}
.person_page .msgList ul { width:95%;margin: 0 auto; }
.person_page .msgList ul li{width:100%;}
.person_page .msgList ul li:nth-child(odd){height:3em;border-bottom:1px solid #aaa;line-height: 3em;}
.person_page .msgList ul li:nth-child(odd):hover{background-color: #a3f1f770;cursor:pointer;}
.person_page .msgList ul li:nth-child(even){height:6em;display:none;}
.person_page .msgList ul li.active{display:list-item;}

#FOOTER_BANNER {width:100%;position:relative;background-color: whitesmoke;padding: 1em;}
#FOOTER_BANNER>div { width:1200px; margin:0 auto; position:relative; }
#FOOTER_BANNER ul {width: 100%;max-width: 1200px;margin: 0 auto;position:relative;}
#FOOTER_BANNER li {width:33%;float:left;position:relative;}
#FOOTER_BANNER li + li { margin-left:0.5%; }
#FOOTER_BANNER li img {width: 100%;max-height: 50%;}
#FOOTER_BANNER ul:after { content:''; clear:both; display:block; }

@media (max-width: 768px) {
    html, body { min-width: auto; /* overflow-x: hidden; */width: 100%;max-width: 100%;overflow-x: hidden;position: relative;}
    .layerFrame + .layerFrame { border-top:1px solid #ccc; width: 100%;}
    .layerFrame>* { max-width:100%; min-width:auto; width: 100%;}
    h1, h3, h4, h5 { margin-left: 0.5em; font-size: 1.1em;}
    h2 { text-align:center; text-decoration: underline;font-size: 1.3em;}

    #HEADER_TOP {position: fixed; right:0;}

    .selectLanguage { position:absolute; top: 0.8em;right: 0.5em; left:auto; float: none;}
    .selectLanguage button {background: none;border: 0;padding: 0;}
    .selectLanguage button span { padding: 0;display: none;}
    .selectLanguage button img:first-child { /* height:1.2em; */ }
    .selectLanguage button>img:nth-child(1) {left: 0.5em;filter: invert(1);position: static;left: auto;}
    .selectLanguage button>img:nth-child(3) { display:none; }
    .selectLanguage ul.active, .selectLanguage:hover ul, .selectLanguage:hover ul:hover { width:auto; right: -0.5em;left: auto;top: 2em;border-radius: 0.3em;}
    .selectLanguage ul li {  width: auto;padding: 0 1em;}
    .headerTop { height: 1em; padding-top: 0.5em;}
    .headerTop .topMenu { position:relative; right:2em; width: auto; }
    .headerTop .topMenu>li { color:white; }

    .headerMenu>img { width:auto; height: 6em; margin-top: -1em;margin-bottom: -1em;display: none;}
    #HEADER { height:3em;position: fixed;}
    #HEADER .headerMenu ul {position: absolute;right: 0;top: 1.5em;padding-top: 2.2em;position: relative;top: 0.8em;left: 0;right: auto;min-width: 2em;width: auto;max-width: none;}
    #HEADER .headerMenu ul:after { content:'';background-image: url(../images/Icon_Menu.png); position:absolute; top:0;right: 1em; width:26px; height:22px;right: auto;left: 0.5em;top: 0em;}
    #HEADER .headerMenu ul ul:after { display:none; }
    #HEADER .headerMenu ul li {float: none;background-color: rgba(42,42,42,0.8);margin: 0;padding: 0 1em;line-height: 2.5em;display: none;width: auto;padding: 0;background-color: rgba(0,0,0,0.8);}
    #HEADER .headerMenu ul li + li { border-top:1px solid rgb(128,128,128,0.8); }
    #HEADER .headerMenu ul li li { background:none;width: 100%;border-top-color: #404040;}
    #HEADER .headerMenu ul li ul { background:none;box-shadow: none;border: 0;top: auto;padding: 0;margin: 0;}
    #HEADER ul li ul li:first-child {border-top: 1px solid #808080;border-radius: 0;}
    #HEADER .headerMenu ul.active li,
    #HEADER .headerMenu ul:hover li,
    #HEADER .headerMenu ul:active li { display:block; }
    #HEADER ul a {font-size: 1em;text-align: left;padding-left: 1em;}
    #HEADER ul ul a { padding:0em 1em 0em 2em; }

    [pageid=main] #HEADER_TOP + #HEADER + * {padding-top: 3em;height: auto;}
    #PROMOTION_MAIN>div {left:0;height: auto;position: relative;}
    #PROMOTION_MAIN.slide2022 img { height:auto; }
    #PROMOTION_MAIN.slide2022 ul.imgeSlide {}
    #PROMOTION_MAIN.slide2022 .swiper-slide { }
    #PROMOTION_MAIN.slide2022 ul.imgeSlide .image { padding:0; }
    #PROMOTION_MAIN.slide2022 .swiper-slide a { position:relative; }
    
    ul.imgeSlide { height: 6em; }
    .imgeSlide ul>li.button>div, ul.imgeSlide>li.button>div { width:100%; margin-top: 4em;}
    .imgeSlide .slideLeft, .imgeSlide .slideRight,
    ul.imgeSlide>li .slideLeft, ul.imgeSlide>li .slideRight { width:1em; height:1em;line-height: 1em;}

    #CONTENT_TOPIC ul>li { width:100%;box-sizing: border-box;height: auto;}
    #CONTENT_TOPIC ul>li + li { border-top:1px solid #ccc; padding-top:1em; margin-top:1em; margin-left: 0;}
    #CONTENT_TOPIC .partTop5 h3 { padding-top:0.5em; padding-left:0.5em; margin-bottom:1.5em ;position: relative;margin: 0;}
    #CONTENT_TOPIC .partTop5 { width:100%; margin-top: 2em;}
    #CONTENT_TOPIC .partTop5 .progList { display:block;  text-align:right;  padding-right: 0.5em;position: static;}
    #CONTENT_TOPIC .partTop5 .progList li { display:inline-block; width: auto;}
    #CONTENT_TOPIC .partTop5 ul { padding-left:0; padding-right:0; }
    #CONTENT_TOPIC .partTop5 ul li { padding-left:1em; }
    #CONTENT_TOPIC .partTop5 ul li span.count { bottom:-0.5em; right: 0; margin-right: 0.5em;}
    #CONTENT_TOPIC .partList { width:100%; margin-top: 3em;margin-left: 0;}
    #CONTENT_TOPIC ul>li .overTitle { display:block; transition:0.5s all; opacity:1; top:auto; bottom:0; }
    #CONTENT_TOPIC ul>li .pic4x3>img { width: 100%; height: auto; object-fit: contain;}

    #COMMUNITY ul>li { width:100%; margin-left: 0;}

    #NOTICE ul>li { width:100%; margin:0; margin-bottom:2em; }
    #NOTICE ul>li .overTitle {display:block;transition:0.5s all;opacity:1;top:auto;bottom:0;position: relative;height: auto;}

    .pic3x4 {padding: 0;}
    .pic5x2>*, .pic5x4>*, .pic4x3>*, .pic3x4>* {position: relative;display: block;}
    
    #FOOTER { padding:1em 0.5em 0.5em 0.5em;background-color: whitesmoke;padding: 0.5em;}
    #FOOTER .footer_part { padding-bottom:0; }
    #FOOTER .footer_part>div {}
    #FOOTER .footer_part>div img:first-child {height: 1.5em;display: none;}
    #FOOTER .footer_part>div .sns img {width: 1.2em;height: auto;}
    #FOOTER .footer_part>div .sns a + a { margin-left:0.5em; }
    #FOOTER .footer_part>div:first-child {display: none;}
    #FOOTER .logo p {line-height: 1em;font-size: 0.7em;/* white-space: nowrap; */color: #888;margin: 0;/* font-size: 1em; */width: 100%;max-width: 100%;text-align: center;}
    #FOOTER .sns { top: 0em;  right: 0em;}
    #FOOTER .sns img { margin-left:0.5em; margin-left: 0;}
    #FOOTER .sns a + a { margin-left:0.3em; }
    #FOOTER .sitemap button { width:auto; height: auto;line-height: 2em;}
    #FOOTER .banner { margin:0; float: none;white-space: nowrap;}
    #FOOTER .footer_part hr { display:none; }

    .input-form { margin-top:2em; }
    .input-form>* { max-width: 40%; }
    .input-form>input { max-width: 30%; min-width: auto;}
    .input-form>* + * { margin-left:0.5em; }

    [pageId=contestDetail] #time_bar { background-size:100% 100%; }
    [pageId=contestDetail] .time_box_li {width: 1.6em;background-size: 100% 100%;height: 1.7em;}
    [pageId=contestDetail] .time_box ul li { font-size: 1.2em; margin-top: 1em;}
    [pageId=contestDetail] .time_box_col {height: 1em;background-size: 100% 100%;}
    [pageId=contestDetail] .time_box ul li.time_box_col {  background-position-y: 0em;width: 4px;height: 0.6em;}
    [pageId=contestDetail] .time_desc ul li {  width: 7em;}
    [pageId=contestDetail] .time_desc { padding-bottom: 0.5em; }
    [pageId=contestDetail] .layerFrame>div>img { width:100%; }
    [pageId=contestDetail] .kma_desc { margin-top:1em;padding: 1em 0.5em;max-width: 100%;}
    [pageId=contestDetail] .kma_desc p { font-size:1.1em; margin: 0;margin-bottom: 0.8em;}
    [pageId=contestDetail] .kma_desc ul { width:100%; }
    [pageId=contestDetail] .kma_desc ul li { font-size:0.8em;  margin-bottom: 0.6em;width: 100%;}
    [pageId=contestDetail] .bottom_banner_box { width:100%;height: auto;margin: 0;}
    [pageId=contestDetail] .bottom_banner_box + .bottom_banner_box {margin-top: 0.5em;}
    [pageId=contestDetail] .bottom_banner_box>img { float:none; margin: 0;max-width: 100%;display: block;}
    [pageId=contestDetail] .bottom_banner_box>div { display:none; }
    [pageId=contestDetail] #main_page3 { margin:0;padding: 2em 0.5em;margin-top: 1px;}
    [pageId=contestDetail] .kma_detail .section>h3 { font-size:0.9em;}
    [pageId=contestDetail] .kma_detail .section p {/* font-size:0.8em; *//* margin: 0.5em 0; */}

    .kma_detail {padding: 1em;}
    .kma_detail .section {/* padding: 0.5em 1em; */}
    .kma_detail .section * { font-size:1em; }
    .kma_detail .section>h3 { margin: 0; }
    .kma_detail .section>p {padding-left: 1.5em;/* font-size: 1em; */}
    .kma_detail .section {/* padding:0; *//* padding-right: 0.5em; */}

    [pageId=contest] #time_bar { }
    [pageId=contest] .time_box ul { }
    [pageId=contest] .time_box ul li { width: 26px;height: 48px;font-size: 2em;background-size: 100% 100%;padding-top: 2px;}
    [pageId=contest] .time_box_li { }
    [pageId=contest] .time_box_col { }
    [pageId=contest] .time_desc ul { }
    [pageId=contest] .time_desc ul li { }
    [pageId=contest] .time_box li.time_box_col { background-size:auto; background-position: 9px 21px;}
    [pageId=contest] #PARTI_LIST ul>li { width:100%; margin-left:0; }
    [pageId=contest] #PARTI_LIST ul>li + li { margin-top:1em; padding-top:1em; border-top:1px solid #ccc; }
    [pageId=contest] #PARTI_LIST .pagination>* { min-width: 2em; width: auto;padding: 0;margin: 0;border: 0;}
    [pageId=contest] #PARTI_LIST .sub-input ul {  }
    [pageId=contest] #PARTI_LIST .sub-input ul li { width:auto; font-size: 1em;}
    [pageId=contest] #PARTI_LIST .sub-input ul li + li { border:0; margin: 0;padding: 0;margin-left: 1em;}
    [pageId=contest] #PARTI_LIST .sub-input ul li + li:before {left: -0.7em;}
    [pageId=contest] #PARTI_LIST .upload { /* position:relative; */ /* margin: 0 auto; *//* display: block; */width: 1.5em;height: 1.5em;color: #1765d6;overflow: hidden;right: 0.5em;}
    [pageId=contest] #PARTI_LIST .upload:after {top: 0;left: 0;width: 100%;height: 100%;background-position: center;}
    [pageId=contest] #PARTI_LIST .order-desc { margin-top:-0.5em; }

    [pageid="prVideo"] h2>.input-form { display:none; }
    [pageId=prVideo] .list { width:90%; margin:0 auto }
    [pageId=prVideo] .list .pic5x2 { width:100%; padding-top: 0;}
    [pageId=prVideo] .list .pic5x2>* { position:relative; }
    [pageId=prVideo] .list .sideView { width:100%; }
    [pageId=prVideo] .input-form>input { max-width: 60%; }
    [pageId=prVideo] .list>li .sideView .title { font-size:1em;display: -webkit-box;-webkit-box-orient: vertical;word-wrap: break-word;text-overflow: ellipsis;overflow: hidden;-webkit-line-clamp: 2;}
    [pageId=prVideo] .list>li .sideView .more { font-size:0.7em;bottom: 0.3em;}
    [pageId=prVideo] .list>li .sideView .desc {display: -webkit-box;-webkit-box-orient: vertical;word-wrap: break-word;text-overflow: ellipsis;overflow: hidden;-webkit-line-clamp: 3;}

    [pageId=prVideoDetail] .page_title { font-size:1em;height: auto;padding: 0;font-size: 1.3em;}
    [pageid=prVideoDetail] .layerFrame { padding: 1em 0.5em; }
    [pageId=prVideoDetail] .post_info p:nth-child(1) { font-size:1em }
    [pageId=prVideoDetail] .post_content * { font-size:0.85em }
    [pageId=prVideoDetail] .post_content img { max-width:100%; }
    [pageId=prVideoDetail] .post_content iframe { max-width:100%; }
    [pageId=prVideoDetail] .post_list { text-align:center; }
    [pageId=prVideoDetail] .post_list button { margin:1em auto; }


    [pageid="notice"] h2>.input-form { display:none; }
    [pageId=notice] #NOTICE_LIST:before { display:none; }
    [pageId=notice] #NOTICE_LIST ul.list>li {display: block;width: 90%;margin: 0 auto;float: none;}
    [pageId=notice] #NOTICE_LIST ul.list>li + li {/* margin-left:0; */margin-top: 1em;}
    [pageId=notice] #NOTICE_LIST ul.list>li .overTitle { display:block; transition:0.5s all; opacity:1; top:auto; bottom:0; }

    [pageId=noticeDetail] .page_title { font-size:1em;height: auto;padding: 0;font-size: 1.3em;}
    [pageid="noticeDetail"] .layerFrame { padding: 1em 0.5em; }
    [pageId=noticeDetail] .post_info p:nth-child(1) { font-size:1em }
    [pageId=noticeDetail] .post_content * { font-size:0.85em }
    [pageId=noticeDetail] .post_content img { max-width:100%; }
    [pageId=noticeDetail] .post_list { text-align:center; }
    [pageId=noticeDetail] .post_list button { margin:1em auto; }

    [pageId=community] #HEADER_TOP + #HEADER + #COMMUNITY_LIST {padding-top: 3em;min-height: calc( 100% - 2.4em);}
    [pageId=community] .list { width:100%; }
    [pageId=community] .list>li { width:100%; }
    [pageId=community] .list>li>img { -webkit-filter: none;filter: none; }
    [pageId=community] .list>li .overTop img { max-width:2.5em;width: 2.5em;height: 2.5em;object-fit: cover;position: absolute;}
    [pageId=community] .list>li .overTop .more img {top: 10px;right: -63px;}
    [pageId=community] .list>li .overTop .name {display: inline-block;font-size: 1.3em;max-width: 100%;text-indent: 2.5em;padding-top: 0.7em;margin: 0;padding-right: 0.5em;}
    [pageId=community] .list>li .overTop .ago {font-size:1em;display: block;padding-left: 4em;/* margin-top: -0.7em; */position: absolute;top: 0.5em;right: 2em;}
    [pageId=community] .list>li .overTop .more {transform: rotate(90deg);right: -0.1em;font-size: 1.5em;letter-spacing: 0.1em;top: 1em;position: absolute;top: 0.5em;}
    [pageId=community] #SEARCH_FROM { display:none; }
    [pageId=community] .function { right:0.5em; top:auto;bottom: 6em;}
    [pageId=community] .function img { width:2.2em;border: 2px solid white;border-radius: 2.2em;}
    [pageId=community] .list>li .reply-list img { width:2em;left: 0;}
    [pageId=community] .list>li .reply-list input {width: calc( 100% - 3em);font-size: 1.1em;}
    [pageId=community] .list>li .reply-list button.delete { width: 30px; height: 30px; margin-left: 10px; }
    [pageId=community] .pagination { width:100%; }
    [pageId=community] .list>li .titleView h4 { font-size:1em; }
    [pageId=community] .list>li .titleView .tags {}
    [pageId=community] .list>li .reply-list li {position: relative;padding-left: 2.5em;}
    [pageId=community] .list>li .reply-list li:after { content:''; clear:both; display:block; }
    [pageId=community] .list>li .reply-list {}
    [pageId=community] .list>li .reply-list li span { font-size: 0.8em; }
    [pageId=community] .list>li .reply-list li .name {}
    [pageId=community] .list>li .reply-list li .ymd { /* font-size: 0.7em; */ }
    [pageId=community] .list>li .reply-list li .ymd:after {}
    [pageId=community] .list>li .reply-list li .reply {}
    [pageId=community] .list>li .reply-list li + li.input {}
    [pageId=community] .list>li .reply-list li.input { }
    [pageId=community] .list>li .reply-list li.input img { vertical-align: middle; }
    [pageId=community] .list>li .reply-list li.input button { right:-0.5em; font-size:1.2em;top: 0em;position: static;float: right;margin-top: 0.5em;background: #1765d6;color: white;padding: 0.25em 1em;}

    [pageId=winners] ul.list>li { width:100%; }
    [pageId=winners] ul.list>li + li { margin-left:0; }

    [pageId=signup] #HEADER_TOP + #HEADER + * { padding-top:3em;min-height: calc( 100% - 2.2em);background-color: whitesmoke;}
    [pageId=signup] .page_content {padding-top:0;padding: 1em;}
    [pageId=signup] .shadow_box {width: 100%;height: auto;padding: 1em 0em;}
    [pageId=signup] .shadow_box>input { font-size:0.8em; }
    [pageId=signup] .shadow_box>select { font-size:0.8em; }
    [pageId=signup] .shadow_box .gender button { font-size:0.8em; }
    [pageId=signup] .shadow_box button { font-size:1em }

    [pageid=login] #HEADER_TOP + #HEADER + * { padding-top:3em;min-height: calc( 100% - 2.2em);background-color: whitesmoke;}
    [pageId=login] .page_content {padding-top: 3em;padding-bottom: 3em;height: 100%;}
    [pageId=login] .shadow_box { width: 90%; margin-top: 0;margin-bottom: 0;height: auto;}

    [pageid="myprofile"] #HEADER_TOP + #HEADER + * {padding: 3em 0;min-height: calc( 100% - 2.2em);background-color: white;padding-bottom: 0;}
    [pageId=myprofile] .page_title { font-size:1.5em ;height: auto;line-height: 2em;padding-left: 0.5em;margin: 0;padding-top: 0;}
    [pageId=myprofile] .page_content>* { width:100%;padding: 0;max-width: 100%;}
    [pageId=myprofile] .shadow_box { margin:2em 0; padding:0.8em; }
    [pageId=myprofile] .page_nav a { font-size:0.8em; }
    [pageid=myprofile] #MY_PAGE:before {width: calc( 100% - 2em );top: 9.2em;left: 1em;}
    [pageId=myprofile] .shadow_box input { width:100%; }
    [pageId=myprofile] #country { width:100%; }
    [pageId=myprofile] input + input + .box_content { display:none; }
    [pageId=myprofile] .box_title p { font-size:1.2em; }
    [pageId=myprofile] .photo_button { float:none;text-align: center;display: block;}
    [pageId=myprofile] .shadow_box button {width: calc( (100% - 2em)/2 );font-size: 0.8em;}

    [pageid=mycontest] #HEADER_TOP + #HEADER + * {padding: 3em 0;min-height: calc( 100% - 2.2em);background-color: white;padding-bottom: 0;}
    [pageId=mycontest] .page_title { font-size:1.5em ;height: auto;line-height: 2em;padding-left: 0.5em;margin: 0;padding-top: 0;}
    [pageId=mycontest] .page_content>* {width:100%;padding: 0;max-width: 100%;padding-right: 0.5em;}
    [pageId=mycontest] .shadow_box {margin:2em 0;padding:0.8em;margin: 0;box-shadow: none;}
    [pageId=mycontest] .page_nav a { font-size:0.8em; }
    [pageid=mycontest] #MY_PAGE:before {width: calc( 100% - 2em );top: 9.2em;left: 1em;}
    [pageId=mycontest] .shadow_box input { width:100%; }
    [pageId=mycontest] #country { width:100%; }
    [pageId=mycontest] input + input + .box_content { display:none; }
    [pageId=mycontest] .box_title p { font-size:1.2em; }
    [pageId=mycontest] .photo_button { float:none;text-align: center;display: block;}
    [pageId=mycontest] .shadow_box button {width: calc( (100% - 2em)/2 );font-size: 0.8em;}
    [pageId=mycontest] #MY_CONTEST_LIST ul.list>li {width: calc(100% - 0.5em);border-radius: 6px;display: block;float: none;margin-left: 0;}
    [pageId=mycontest] .overTitle { position:static; }

    [pageid=mycontestDetail] #HEADER_TOP + #HEADER + * {padding: 3em 0;min-height: calc( 100% - 2.2em);background-color: white;padding-bottom: 0;}
    [pageId=mycontestDetail] .page_title { font-size:1.5em ;height: auto;line-height: 2em;padding-left: 0.5em;margin: 0;padding-top: 0;}
    [pageId=mycontestDetail] .page_content>* {width:100%;padding: 0;max-width: 100%;/* padding-right: 0.5em; */}
    [pageId=mycontestDetail] .page_nav a { font-size:0.8em; }
    [pageid=mycontestDetail] #MY_PAGE:before {width: calc( 100% - 2em );top: 9.2em;left: 1em;}
    [pageid=mycontestDetail] .page_table {margin-top: 1em;border-top:1px solid #ccc;padding-top: 1em;}
    [pageId=mycontestDetail] .layerFrame .innerFrame {}
    [pageId=mycontestDetail] .box_content { padding-left: 0; width: 4em; display: inline-block; float: none; vertical-align: top; }
    [pageId=mycontestDetail] .shadow_box {}
    [pageId=mycontestDetail] .shadow_box:after { content:''; clear:both; display:block; }
    [pageId=mycontestDetail] .shadow_box img {}
    [pageId=mycontestDetail] .shadow_box input { display: inline-block; width: calc( 100% - 6em); padding: 0.4em 0.2em; }
    [pageId=mycontestDetail] .shadow_box textarea { display: inline-block; width: calc( 100% - 6em); padding: 0.4em 0.2em; }
    [pageId=mycontestDetail] .box_content span { padding-left: 0.5em; }
    [pageId=mycontestDetail] .buttons {  }

    [pageid=myReply] #HEADER_TOP + #HEADER + * {padding: 3em 0;min-height: calc( 100% - 2.2em);background-color: white;padding-bottom: 0;}
    [pageId=myReply] .page_title { font-size:1.5em ;height: auto;line-height: 2em;padding-left: 0.5em;margin: 0;padding-top: 0;}
    [pageId=myReply] .page_content>* {width:100%;padding: 0;max-width: 100%;/* padding-right: 0.5em; */}
    [pageId=myReply] .page_nav a { font-size:0.8em; }
    [pageid=myReply] #MY_PAGE:before {width: calc( 100% - 2em );top: 9.2em;left: 1em;}
    [pageid=myReply] .page_table {margin-top: 1em;border-top:1px solid #ccc;padding-top: 1em;}
    [pageId=myReply] .item span {font-size: 16px;margin-left: 0;margin-right: 0;width: 6.2em;display: inline-block;/* background-color: red; */}
    [pageId=myReply] .item {display:block;margin-bottom: 0.5em;white-space: nowrap;}
    [pageId=myReply] .item input {width: calc( 100% - 5.7em  );}
    [pageId=myReply] .item.dateRange {}
    [pageId=myReply] .item.dateRange input {font-size: 16px;width: calc( (100% - 7.8em) / 2 );}
    [pageId=myReply] .btns {position:static;text-align: right;}
    [pageId=myReply] table.grid {display: block; border:0; }
    [pageId=myReply] table.grid thead { display:none; border:0; }
    [pageId=myReply] table.grid th { display:bloack; }
    [pageId=myReply] table.grid tbody,
    [pageId=myReply] table.grid tr,
    [pageId=myReply] table.grid td {display:block;width:100%;line-height: 1.2em;}
    [pageId=myReply] table.grid tr {border:1px solid #ccc;margin-bottom:1em;background-color: white !important;padding: 0.5em;position: relative;}
    [pageId=myReply] table.grid td {}
    [pageId=myReply] table.grid td:first-child { color:red; }
    [pageId=myReply] table.grid tbody td:nth-child(5n+1) { display: none; }
    [pageId=myReply] table.grid tbody td:nth-child(5n+2) { border-bottom: 1px solid #122239; margin-bottom: 0.4em; }
    [pageId=myReply] table.grid tbody td:nth-child(5n+3) { min-height: 3em; margin-bottom: 0.5em; }
    [pageId=myReply] table.grid tbody td:nth-child(5n+4) { position: absolute; left: 0.5em; width: auto; }
    [pageId=myReply] table.grid tbody td:nth-child(5n+0) { text-align: right; }

    [pageid=myFollow] #HEADER_TOP + #HEADER + * {padding: 3em 0;min-height: calc( 100% - 2.2em);background-color: white;padding-bottom: 0;}
    [pageId=myFollow] .page_title { font-size:1.5em ;height: auto;line-height: 2em;padding-left: 0.5em;margin: 0;padding-top: 0;}
    [pageId=myFollow] .page_content>* {width:100%;padding: 0;max-width: 100%;/* padding-right: 0.5em; */}
    [pageId=myFollow] .page_nav a { font-size:0.8em; }
    [pageid=myFollow] #MY_PAGE:before {width: calc( 100% - 2em );top: 9.2em;left: 1em;}
    [pageid=myFollow] .page_table {margin-top: 1em;border-top:1px solid #ccc;padding-top: 1em;}
    [pageId=myFollow] .item span {font-size: 16px;margin-left: 0;margin-right: 0;width: 6.2em;display: inline-block;/* background-color: red; */}
    [pageId=myFollow] .item {display:block;margin-bottom: 0.5em;white-space: nowrap;}
    [pageId=myFollow] .item input {width: calc( 100% - 5.7em  );}
    [pageId=myFollow] .item select {width: calc( 100% - 5.7em  );}
    [pageId=myFollow] .item.dateRange {}
    [pageId=myFollow] .item.dateRange input {font-size: 16px;width: calc( (100% - 7.8em) / 2 );}
    [pageId=myFollow] .btns {position:static;text-align: right;}
    [pageId=myFollow] table.grid {display: block; border:0; }
    [pageId=myFollow] table.grid thead { display:none; border:0; }
    [pageId=myFollow] table.grid th { display:bloack; }
    [pageId=myFollow] table.grid tbody,
    [pageId=myFollow] table.grid tr,
    [pageId=myFollow] table.grid td {display:block;width:100%;line-height: 1.2em;}
    [pageId=myFollow] table.grid tr {border:1px solid #ccc;margin-bottom:1em;background-color: white !important;padding: 0.5em;position: relative;}
    [pageId=myFollow] table.grid td {}
    [pageId=myFollow] table.grid td:first-child { color:red; }
    [pageId=myFollow] table.grid tbody td:nth-child(6n+1) { display: none; }
    [pageId=myFollow] table.grid tbody td:nth-child(6n+2) {text-align: right;color: #122239;font-weight: bold;position: absolute;right: 0.5em;}
    [pageId=myFollow] table.grid tbody td:nth-child(6n+3) {text-align: right;position: absolute;top: 2em;right: 0.5em;}
    [pageId=myFollow] table.grid tbody td:nth-child(6n+4) {right: 0em;top: 0.5em;width: auto;text-align: right;height: 4.8em;padding-top: 2.5em;}
    [pageId=myFollow] table.grid tbody td:nth-child(6n+4) img {/* display:block; */width:4em;height:4em;position: absolute;left: 0em;top: -0.5em;}
    [pageId=myFollow] table.grid tbody td:nth-child(6n+5) {position: absolute;right: 0.5em;width: auto;}
    [pageId=myFollow] table.grid tbody td:nth-child(6n+0) {text-align: center;width: 5.7em;position: relative;left: -0.5em;}

    [pageid=myMessage] #HEADER_TOP + #HEADER + * {padding: 3em 0;min-height: calc( 100% - 2.2em);background-color: white;padding-bottom: 0;}
    [pageId=myMessage] .page_title { font-size:1.5em ;height: auto;line-height: 2em;padding-left: 0.5em;margin: 0;padding-top: 0;}
    [pageId=myMessage] .page_content>* {width:100%;padding: 0;max-width: 100%;/* padding-right: 0.5em; */}
    [pageId=myMessage] .page_nav a { font-size:0.8em; }
    [pageid=myMessage] #MY_PAGE:before {width: calc( 100% - 2em );top: 9.2em;left: 1em;}
    [pageid=myMessage] .page_table {margin-top: 1em;border-top:1px solid #ccc;padding-top: 1em;}
    [pageId=myMessage] .item span {font-size: 16px;margin-left: 0;margin-right: 0;width: 6.2em;display: inline-block;/* background-color: red; */}
    [pageId=myMessage] .item {display:block;margin-bottom: 0.5em;white-space: nowrap;}
    [pageId=myMessage] .item input {width: calc( 100% - 5.7em  );}
    [pageId=myMessage] .item select {width: calc( 100% - 5.7em  );}
    [pageId=myMessage] .item.dateRange {}
    [pageId=myMessage] .item.dateRange input {font-size: 16px;width: calc( (100% - 7.8em) / 2 );}
    [pageId=myMessage] .btns {position:static;text-align: right;}
    [pageId=myMessage] table.grid {display: block; border:0; }
    [pageId=myMessage] table.grid thead { display:none; border:0; }
    [pageId=myMessage] table.grid th { display:bloack; }
    [pageId=myMessage] table.grid tbody,
    [pageId=myMessage] table.grid tr,
    [pageId=myMessage] table.grid td {display:block;width:100%;line-height: 1.2em;}
    [pageId=myMessage] table.grid tr {border:1px solid #ccc;margin-bottom:1em;background-color: white !important;padding: 0.5em;position: relative;}
    [pageId=myMessage] table.grid td {}
    [pageId=myMessage] table.grid td:first-child { color:red; }
    [pageId=myMessage] table.grid tbody .msgMain td:nth-child(7n+1) { display: none; }
    [pageId=myMessage] table.grid tbody .msgMain td:nth-child(7n+2) {text-align: left;color: #122239;font-weight: bold;position: absolute;right: 0.5em;left: 0.5em;font-size: 14px;}
    [pageId=myMessage] table.grid tbody .msgMain td:nth-child(7n+3) {text-align: left;/* position: absolute; *//* top: 2em; *//* right: 0.5em; *//* left: 0.5em; */padding-top: 1.5em;}
    [pageId=myMessage] table.grid tbody .msgMain td:nth-child(7n+3):before { content:'From : '; }
    [pageId=myMessage] table.grid tbody .msgMain td:nth-child(7n+4) {/* right: 0em; *//* top: 0.5em; *//* width: auto; *//* text-align: left; *//* height: 4.8em; *//* padding-top: 2.5em; */left: 1.4em;}
    [pageId=myMessage] table.grid tbody .msgMain td:nth-child(7n+4):before { content:'To : '; }
    [pageId=myMessage] table.grid tbody .msgMain td:nth-child(7n+4) img {/* display:block; */width:4em;height:4em;position: absolute;left: 0em;top: -0.5em;}
    [pageId=myMessage] table.grid tbody .msgMain td:nth-child(7n+5) {/* position: absolute; *//* right: 0.5em; */width: auto;/* border-top: 1px solid #ccc; */padding-left: 0.4em;}
    [pageId=myMessage] table.grid tbody .msgMain td:nth-child(7n+5):before { content:'Title : '; }
    [pageId=myMessage] table.grid tbody .msgMain td:nth-child(7n+6) {text-align: center;width: 5.7em;position: relative;left: -0.5em;position: absolute;top: 0.5em;right: 0.0em;left: auto;}
    [pageId=myMessage] table.grid tbody .msgMain td:nth-child(7n+0) {text-align: center;width: 5.7em;position: relative;left: -0.5em;position: absolute;top: 1.8em;right: -1.5em;left: auto;}
    [pageId=myMessage] table.grid tbody .msgMain { margin-bottom:0; border-bottom:0}
    [pageId=myMessage] table.grid tbody .msgDetail {margin-bottom:0;border-top-style:dashed;display: block;}
    [pageId=myMessage] table.grid tbody .msgDetail td:nth-child(6n+1) { display:none; }
    [pageId=myMessage] table.grid tbody .msgDetail td:nth-child(6n+2) { min-height: 3em;}
    [pageId=myMessage] tr.msgDetail.active div:after { display:none; }
    [pageId=myMessage] tr.msgDetail.active div:before { display:none; }
    [pageId=myMessage] tr.msgDetail.active div {position: static;width: 100%;border: none;padding: inherit;z-index: auto;min-height: auto;top: auto;font-size: inherit;}
    
    [pageId=participation] #main_page3 { padding-top:3em;width: 100%;padding-bottom: 0;}
    [pageId=participation] .app_participate { width:100%;height: auto;}
    [pageId=participation] .app_participate_img { width:100%;}
    [pageId=participation] .app_participate_form_content { padding:0 0.5em; }
    [pageId=participation] .app_participate_form { margin-top:1em }
    [pageId=participation] .app_participate_form_content span { display:none; }
    [pageId=participation] .app_participate_form_content .app_consent span { display:inline; }
    [pageId=participation] .app_title>.app_content { width:100%;height: auto;line-height: 2em;padding: 0.5em;margin-bottom: 0.5em;}
    [pageId=participation] .app_participate_form input[type=text],
    [pageId=participation] .app_participate_form textarea { width:100%; border-color:#bbb; font-size:0.9em; }
    [pageId=participation] .app_participate_form p { margin-bottom:0; }
    [pageId=participation] .app_title { margin-top: 1em; }
    [pageId=participation] [colid="explain"] .app_content { padding:0.5em; margin-bottom:0.5em }
    [pageId=participation] .app_link>.app_content { margin-top:0; height:auto; line-height:2em; padding:0.5em; }
    [pageId=participation] .app_participate_btn { padding:0 1em; }
    [pageId=participation] .app_participate_btn button { margin-top:1em; width:100%; }
    [pageId=myprofile] .box_content { height:auto; }

    [pageid="complate"] #HEADER_TOP + #HEADER + * {  padding-top:3em;padding-bottom: 0;min-height: calc( 100% - 2.4em);}

    [pageId=complate] .app_complete { max-width:100%;height: 100%;padding-bottom: 6em;margin-bottom: 0;}

    #FOOTER_BANNER { }
    #FOOTER_BANNER>div { }
    #FOOTER_BANNER ul { }
    #FOOTER_BANNER li {width: 100%;float: none;}
    #FOOTER_BANNER li + li {margin: 0;margin-top: 0.8em;}
    #FOOTER_BANNER li img {max-height: none;}
    #FOOTER_BANNER ul:after { }

    #HEADER_TOP + #HEADER + * {padding-top: 4em;}

    .writeFormPopup .view { width:100%;height: 100%;min-width:100%; max-width:100%;margin: 0;border: 0;border-radius: 0;max-height: none;}
    .writeFormPopup .view .header {padding: 0.5em 1em;}
    .writeFormPopup .view .header:after {top: 0.6em; left:0.5em;}
    .writeFormPopup .view .header + .body {padding: 1em;margin-top: -1em;max-height: none;height: 100%;}
    .writeFormPopup .view textarea {height: calc(100% - 2em);}
    .writeFormPopup .view label { font-size:0.7em; line-height:1em;display: inline-block;text-indent: 2em;margin-top: -1.2em;}
    .writeFormPopup .btnClose { right:0.5em }
    .writeFormPopup .btnMax { display:none; }
    .writeFormPopup .view .body>.buttons {padding-bottom: 1em;}
    .writeFormPopup .view .body>.buttons button {width: 40%;}
    .writeFormPopup .view .body>.buttons button + button { }
    .writeFormPopup .view .body>.buttons button.btnDelete {  }

    .writeFormPopup2 .view { width:100%;height: 100%;min-width:100%; max-width:100%;margin: 0;border: 0;border-radius: 0;max-height: none;}
    .writeFormPopup2 .view .header {padding: 0.5em 1em;}
    .writeFormPopup2 .view .header:after {top: 0.6em; left:0.5em;}
    .writeFormPopup2 .view .header + .body {padding: 1em;margin-top: -1em;max-height: none;height: 100%;}
    .writeFormPopup2 .view textarea {height: calc(100% - 12em);}
    .writeFormPopup2 .view label { font-size:0.7em; line-height:1em;display: inline-block;text-indent: 2em;margin-top: -1.2em;}
    .writeFormPopup2 .btnClose { right:0.5em }
    .writeFormPopup2 .btnMax { display:none; }
    .writeFormPopup2 .view .body>.buttons {padding-bottom: 1em;}
    .writeFormPopup2 .view .body>.buttons button {width: 40%;}
    .writeFormPopup2 .view .body>.buttons button + button { }
    .writeFormPopup2 .view .body>.buttons button.btnDelete {  }

    .fileList li { font-size:0.7em; }
    .fileList li:last-child { padding:0.1em 0.5em; font-size:0.9em;background: none;padding-left: 1em;width: 2em;height: 2em;overflow: hidden;text-align: right;}
    .fileList li:last-child:after { content:'📷';position: absolute;left: 0;font-size: 1.5em;}

    body[pageId] .note-editor * { font-size:unset; }
    body[pageId] .note-btn { font-size: 12px; padding: 5px 8px; }
    .note-btn i { font-size: 0.9em; }

    #HEADER_TOP + #HEADER + .person_page {padding-top: 2.9em;}
    .person_page>div.info>div {position:relative;padding-left: 1em;}
    .person_page>div.info>div>img {display:block;position:absolute;width: 5em;height: 5em;top:  1em;left: 1em;}
    .person_page>div.info>div>img + ul {padding-left:0;padding-top: 2em;padding-bottom: 1em;width: 100%;}
    .person_page>div.info>div>img + ul li { display:block; }
    .person_page>div.info>div>ul li.nickname {padding-left: 4.5em;margin-right: 0;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
    .person_page button { margin-top:1em; font-size:14px; }
    .person_page #btnFollow.follow,
    .person_page button#btnFollow {margin-left: 9em;}
    .person_page>div.info>div>ul li.searchArea {bottom: -2.5em;right: 0.5em;width: calc( 100% - 7em );text-align: right;}
    .person_page>div.info>div>ul li.searchArea input { width: calc( 100% - 2em ); font-size: 14px; }
    .person_page>div.info>div>ul li.searchArea input + img {}
    .person_page>div.info>div>ul li.count {margin-top: 0.5em;font-size:16px;text-align:right;padding-right:0.5em;width: 21em;}
    .person_page>div.postList {}
    .person_page>div.postList ul {}
    .person_page>div.postList li {float:none;width:100%;display: block;margin: 0;}
    .person_page>div.postList li + li { margin-top:1em; }
    .person_page>div.postList .pic4x3 { padding-top: 0; }
    .person_page>div.postList .text { max-height:8em; overflow:hidden;  }

    [pageId=community] .list>li.activeTop .reply-list input {width: calc( 100% - 8.5em );}
    [pageId=community] #COMMUNITY_LIST {padding-top: 4em;}
    [pageId=community].detailView #COMMUNITY_LIST {padding-top: 0;height: 100%;padding-bottom: 16em;}
    [pageId=community].detailView #COMMUNITY_LIST>div { height:100%; }
    [pageId=community] .list.detail-true {height:100%;}
    [pageId=community] .list.detail-true>li.activeTop {height:100%;}
    [pageId=community] .list>li.activeTop .overTop {width: 100%;border-bottom: 1px solid #444;}
    [pageId=community] .list>li.activeTop .titleView {position:fixed;bottom:0;left:0;width:100%;height: 16em;top:auto;}
    [pageId=community] .list>li.activeTop .contents {width: 100%;}
    [pageId=community] .list>li.activeTop .overTop .more {  }
    [pageId=community] .list>li.activeTop .overTop .more:before { background-color: white; }
    [pageId=community] .list>li.activeTop .overTop .more:after { background-color: white; }
    [pageId=community] .list>li.activeTop .reply-list li.input button {margin-right: 0.5em;}
}

/* #MENU_WINNERS_GALLERY { display:none !important; } */

.note-editor .note-editing-area{background-color:white;}

.blocking { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); cursor: wait; }