@import url("common.css");

html {font-size:10px;}
body{min-width:1200px; font-size:14px; color:#2e3248;}
.topbanner_area .topbanner_item,
.topbanner_area .topbanner_item a{font-size:0; line-height:100%;}
/* body, input, textarea, select, button, table{font-family:'Noto Sans KR','NanumGothic', '나눔고딕','Nanum Gothic', '맑은 고딕', 'Malgun Gothic',Dotum} */
.p_cursor{cursor:pointer;}
.vm{vertical-align: middle;}
.in_block{display:inline-block;}

.bg_normal{}
.bg_normal:hover{background-color:#fd6569 !important; color:#fff !important;}

.smooth{transition:all 0.2s;}
.btn.small{padding:5px 10px; background-color:#f7f7f7; line-height:150%; border:0;}

.topbanner_area{display:none;}

#header{position:relative; width:100%; min-width:1200px; height:65px; box-sizing:border-box; background-color:#fff; transition: 0.5s all; border-bottom: 1px solid #e9e9e9; z-index:100;}
#header.sticky{position:fixed; top:0; left:0;}
/* .hd_height{height:65px;} */
#containerWrap{position:relative; padding:65px 0 50px; z-index:10; min-width:1200px;}
#containerWrap:after { display:block; clear:both; content:"";}
#aside:after { display:block; clear:both; content:"";}
#article {position:relative; margin-top:30px;}
#footer {position:relative; padding-top:50px; width:100%; min-width:1200px; text-align:left; color:#fff; letter-spacing:-0.46px; background:#262636;}

#header div#logoWrap{display:block; position: absolute; left:62px; top:0; width:100px; height:64px; background:url("/hive/template/LOUD_IMG/top/logo.png") 50% 50% no-repeat; text-indent:-9999px; z-index: 10;}
#header div#logoWrap a{display: block;  width:100%; height:100%; text-indent:-9999px;}

#header .util{position:absolute; top:12px; right:80px;}
#header .inner{padding:0 80px;}
.util{}
.util li{position:relative;}
.util li > a{position:relative; display:block; padding:0 10px; height:40px; line-height:40px; letter-spacing:-0.63px; color:#6e6d7a; z-index:1;}
.util > ul > li > a{padding:0 14px; letter-spacing:-0.58px; font-size:15px;}
.util li.login > a:hover,
.util li.join > a:hover{opacity:0.7;}
.util li.login:after{display:block; content:""; position:absolute; top:17px; right:0; width:1px; height:10px; background:#bcc5cb}
/* .util li.btn_launch{margin-right:10px;} */
.util li.btn_launch a{margin-top:3px; position:relative; width:136px; height:34px; line-height:32px; font-size:13px; text-align:center; color:#fff; background:#505bf0; font-weight:600; letter-spacing:-0.56px; border-radius:18px; border:1px solid #505bf0; box-sizing:border-box; transition:all 0.5;}
.util li.btn_launch a:hover{background:#6A74F6; border-color:#6A74F6;}
/* .util li.btn_launch a:before{position:absolute; top:0; left:0; display:block; content:""; width:100%; height:100%; background:#505bf0; border-radius:5px; box-shadow:0 3px 6px 0 rgba(0, 0, 0, 0.1); transform:scale(1); box-sizing:border-box; z-index:-1;}
.util li.btn_launch a:hover:before{animation-name:changeScale; animation-duration:1s; animation-direction:linear;} */
.util li.btn_launch > a.btn_go_launch{color:#505bf0; background:#fff; border:1px solid #505bf0;}
.util li.btn_launch > a.btn_go_launch:hover{background:#f7f9ff;}

.util li div.opener{position:relative; height:40px; padding-right:25px; color:#6e6d7a; line-height:normal; cursor:pointer;}
.util li div.opener:hover{opacity:0.7;}
.util li.notice{position:relative; margin-left:15px;}
.util li.notice div.opener{padding: 20px 0 0 23px; width:44px; font-size:0; background:url("/hive/template/LOUD_IMG/top/ico-alram@2x.png") 50% 50% no-repeat; background-size:24px; box-sizing:border-box;}
.util li.notice div.opener span{display:block; width:16px; height:16px; line-height:15px; letter-spacing:-0.21px; font-size:10px; text-align:center; color:#fff; background:#e02020; border-radius:50%;padding: 0}
.util li.notice div.opener .notiNotExist{display: none}
.util li.member{margin-right:15px; margin-left:8px; padding-left:5px; position:relative;}
.util li.member .profile{position:relative; margin-top:3px; display:inline-block; width:34px; height:34px; line-height:34px; font-size:13px; font-weight:500; color:#444; text-align:center; text-transform:uppercase; border-radius:50%; overflow:hidden; background:#f5f5f5; vertical-align: middle}
.util li.member .profile img{width:100%; height:100%;}
/* .util li.member div.opener .profile:after{position:absolute; top:0; left:0; display:block;; content:""; width:38px; height:38px; border-radius:50%; border:1px solid #f3f3f4; box-sizing:border-box;} */
.util li.member:hover div.opener .profile:after,
.util li.member.active div.opener .profile:after{border:3px solid #505bf0;}
.util li.member span.user_id{display:inline-block; padding-left:5px; height:38px; line-height:35px; font-size:12px; font-weight:500; vertical-align:top;}
.util li.member:hover span.user_id{color:#505bf0 !important;}
.util li.member div.opener:after{display:block; content:""; position:absolute; top:14px; right:10px; width:12px; height:12px; background:url("/hive/template/LOUD_IMG/top/icn-down-arrow-light@2x.png") 50% 50% no-repeat; background-size:12px; transition:all 0.3s;}
.util li.member.active div.opener:after{transform:rotate(-180deg);}
.util .utilPopup{position:absolute; top:50px; right:0;}
.util .utilPopup:before{display:block; content:""; position:absolute; top:-7px; right:22px; width:15px; height:9px; background:url("/hive/template/LOUD_IMG/top/ico-gnb-arrow.png") 50% 0 no-repeat;}
.util .utilPopup .utilPopup_wrap{width:390px; border-radius:5px; border:1px solid #e9e9e9; background:#fff; box-shadow:0 4px 14px 0 rgba(7, 42, 68, 0.2); box-sizing:border-box; overflow:hidden;}
.util .utilPopup{display:none;}
.util li.active .utilPopup{display:block;}
/* .util li.member .profilePopup.active{display:block;} */
.util .profilePopup .memberTopbox{border-bottom:1px solid #e9e9e9}
.util .profilePopup .profileBox{position:relative; padding:22px 100px 20px 88px;}
.util .profilePopup .profileBox .profile{position:absolute; top:18px; left:15px; width:60px; height:60px; line-height:55px; font-size:18px; font-weight:500; text-align:center; border-radius:50%; border:1px solid #e9e9e9; overflow:hidden; box-sizing:border-box; box-shadow:0 2px 4px 0 rgba(0, 0, 0, 0.05);}
.util .profilePopup .profileBox p{font-size:18px; color:#2d2f39}
.util .profilePopup .profileBox p a{position:relative; display:inline-block; line-height:160%;width: 90%; font-size: 14px}
.util .profilePopup .profileBox p a:hover{color:#505bf0;}
.util .profilePopup .profileBox p.online a{padding-left:10px;}
.util .profilePopup .profileBox p.online a:before{display:block; content:""; position:absolute; top:12px; left:0; width:5px; height:5px; background:#6dd400; border-radius:50%;}
.util .profilePopup .profileBox span{padding-top:2px; display:inline-block; font-size:11px; color:#737c80}
.util .profilePopup .profileBox .btn_setUp{position:absolute; top:10px; right:20px; display:block; width:24px; height:24px; font-size:0; background:url("/hive/template/LOUD_IMG/top/ico-setting.png") 50% 50% no-repeat;}
.util .profilePopup .profileBox .btn_setUp:hover{background:url("/hive/template/LOUD_IMG/top/ico-setting-on.png") 50% 50% no-repeat;}
.util .profilePopup .profileBox .btn_logout{position:absolute; bottom:10px; right:20px; display:block; width:70px;  height:28px; line-height:26px; text-align:center; font-size:12px; border:1px solid #bcc5cb; border-radius:5px; box-sizing:border-box;}
.util .profilePopup .profileBox .btn_logout:hover{border-color:#505bf0;}
.util .profilePopup .memberTab{padding:0 4% 12px;}
.util .profilePopup .memberTab li{width:25%; text-align:center;}
.util .profilePopup .memberTab li a{padding:0; height:auto;line-height:normal; font-size:12px; letter-spacing:-0.54px;}
.util .profilePopup .memberTab li .ico{display:inline-block; width:40px; height:38px;}
.util .profilePopup .memberTab li.mypage .ico{background:url("/hive/template/LOUD_IMG/top/ico-mypage.png") 50% 50% no-repeat;}
.util .profilePopup .memberTab li.mypage:hover .ico{background:url("/hive/template/LOUD_IMG/top/ico-mypage-on.png") 50% 50% no-repeat;}
.util .profilePopup .memberTab li.coupon .ico{background:url("/hive/template/LOUD_IMG/top/ico-coupon.png") 50% 50% no-repeat;}
.util .profilePopup .memberTab li.coupon:hover .ico{background:url("/hive/template/LOUD_IMG/top/ico-coupon-on.png") 50% 50% no-repeat;}
.util .profilePopup .memberTab li.message .ico{background:url("/hive/template/LOUD_IMG/top/ico-message.png") 50% 50% no-repeat;}
.util .profilePopup .memberTab li.message:hover .ico{background:url("/hive/template/LOUD_IMG/top/ico-message-on.png") 50% 50% no-repeat;}
.util .profilePopup .memberTab li.likefollow .ico{background:url("/hive/template/LOUD_IMG/top/ico-likefollow.png") 50% 50% no-repeat;}
.util .profilePopup .memberTab li.likefollow:hover .ico{background:url("/hive/template/LOUD_IMG/top/ico-likefollow-on.png") 50% 50% no-repeat;}
.util .profilePopup .memberTab li.designerguide .ico{background:url("/hive/template/LOUD_IMG/top/ico-guide.png") 50% 50% no-repeat;}
.util .profilePopup .memberTab li.designerguide:hover .ico{background:url("/hive/template/LOUD_IMG/top/ico-guide-on.png") 50% 50% no-repeat;}
.util .profilePopup .tab_list li{width:50%; height:50px; line-height:48px; text-align:center; font-size:14px; color:#737c80; font-weight:500; border-bottom:1px solid #e9e9e9; box-sizing:border-box; cursor:pointer;}
.util .profilePopup .tab_list li:hover{color:#2d2f39;}
.util .profilePopup .tab_list li.active{border-bottom:2px solid #2d2f39; color:#2d2f39; font-weight:600;}
.util .profilePopup .shortcut_list li:not(:last-child){border-bottom:1px solid #e9e9e9;}
.util .profilePopup .shortcut_list > li > a{padding:0 20px; height:60px; line-height:60px; font-size:13px;}
.util .profilePopup .shortcut_list > li > a strong{font-size:16px; font-weight:500;}
.util .profilePopup .shortcut_list li ul.contestList.bg_exist{padding:5px 20px;}
.util .profilePopup ul.contestList a{position:relative; padding:13px 0 13px 60px; height:auto; line-height:160%;}
.util .profilePopup ul.contestList .list .thumb{position:absolute; top:15px; left:0; width:48px; height:48px; border-radius:50%; background:#e9e9e9; overflow:hidden;}
.util .profilePopup ul.contestList .list .thumb:after{display: block; content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.01) 57%, rgba(0, 0, 0, 0.05));}
.util .profilePopup ul.contestList .list .thumb img{width:100%; height:100%;}
.util .profilePopup #my_project ul.contestList .list .thumb{top:11px;}
.util .profilePopup .designer_preview .tab_content{display:none;}
.util .profilePopup .designer_preview .tab_content.active{display:block;}
.util .profilePopup .designer_preview ul.contestList a{padding:13px 20px 15px 80px;}
.util .profilePopup .designer_preview ul.contestList li{border-bottom:1px solid #e9e9e9;}
.util .profilePopup .designer_preview ul.contestList .list .thumb{left:20px;}
.util .profilePopup .designer_preview ul.contestList .list .thumb:after{display: block; content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.01) 57%, rgba(0, 0, 0, 0.05));}
.util .profilePopup .designer_preview .my_cont_cate{padding:14px 10px 2px; font-size:0;}
.util .profilePopup .designer_preview .my_cont_cate span{display:inline-block; padding:0 14px; height:26px; line-height:24px; font-size:12px; color:#737c80; letter-spacing:-0.5px;border-radius:15px; border:1px solid #bcc5cb; box-sizing:border-box; vertical-align:top; cursor:pointer;}
.util .profilePopup .designer_preview .my_cont_cate span:not(:last-child){margin-right:5px;}
.util .profilePopup .designer_preview .my_cont_cate span:hover{border-color:#505bf0;}
.util .profilePopup .designer_preview .my_cont_cate span.active{border-color:#505bf0; color:#505bf0; font-weight:500;}
.util .profilePopup .designer_preview .my_cont_cate span.active:before{display:inline-block; content:""; width:15px; height:24px; background:url("/hive/template/LOUD_IMG/main/ico-check-follow.png") 0 50% no-repeat; vertical-align:top;}
.util .profilePopup .designer_preview .noContest{padding:70px 0; text-align:center; font-size:15px; font-weight:500; color:#737c80;}
.util .profilePopup .designer_preview .noContest span{line-height:150%;}
.util .profilePopup .designer_preview .noContest .btnWrap a.btn{width:150px;}
.util .profilePopup ul.contestList .tit{font-size:14px;}
.util .profilePopup ul.contestList .tit.txt_title{margin-top:2px}
.util .profilePopup ul.contestList li:hover .tit.txt_dark{color:#505bf0 !important;}
.util .profilePopup ul.contestList .tit span.state:after{content:" | "; color:#ddd; padding:0 2px; font-size:10px; line-height:20px; vertical-align:top; }
.util .profilePopup ul.contestList .contest_info{margin-top:5px; padding:0 20px; display:inline-block; height:22px; line-height:20px; font-size:0px; background:#fff; border-radius:22px;}
.util .profilePopup ul.contestList .contest_info.contest_info2{padding: 0; margin-top: 2px}
.util .profilePopup ul.contestList .contest_info span{display:inline-block; font-size:13px;}
.util .profilePopup ul.contestList .contest_info span.prize:after{display:inline-block; content:""; margin:0 5px; width:1px; height:10px; background:#ddd; vertical-align:middle; }
.util .profilePopup .designer_preview .partner{margin-top:3px; font-size:12px;}
.util .profilePopup .designer_preview .partner span{font-size:13px;}
.util .profilePopup .shortcut_list > li .shapeBtn{position:absolute; top:0; right:20px; line-height:60px; font-size:13px;}
.util .profilePopup .shortcut_list > li a:hover .shapeBtn{color:#505bf0;}

.util .notiPopup{right:-10px; height:390px; font-size:13px; letter-spacing:-0.12px;}
/* .util li.notice .notiPopup.active{display:block;} */
.util .notiPopup p.popTit{padding:10px 20px;}
.util .notiPopup .contestList{border-top:1px solid #e9e9e9;}
.util .notiPopup .contestList .list{border-bottom:1px solid #e9e9e9;}
.util .notiPopup .contestList .list a{padding:0 20px; height:auto; line-height:160%; }
.util .notiPopup .contestList .list ul{display:table; width:100%; table-layout:fixed;}
.util .notiPopup .contestList .list ul li{display:table-cell; height:65px; text-align:center; vertical-align:middle;}
.util .notiPopup .contestList .list ul li:first-child{width:75px;}
.util .notiPopup .contestList .list ul li:last-child{padding-left: 15px; text-align:left;}
.util .notiPopup .contestList .list ul li .cont{display:inline-block; width:100%;}
.util .notiPopup .contestList .list .cate{display:inline-block; width:100%; height:22px; border-radius:8px; background:#eef3fd;}
.util .notiPopup .contestList .list ul li .thumb{display:inline-block; width:37px; height:37px; border-radius:50%; background:black; overflow:hidden;}
.util .notiPopup .contestList .list ul li .thumb img{}
.util .notiPopup .contestList .list ul li .cont .txt{font-size:12px;}
.util .notiPopup .utilPopup_wrap .noNoti{text-align: center; padding: 75px 0; border-top: 1px solid #e9e9e9;}
.util .notiPopup .utilPopup_wrap .noNoti img{margin-bottom: 13px; width:24px;}
.util .notiPopup .utilPopup_wrap .noNoti p{font-size: 16px;line-height: 1.25;letter-spacing: -0.57px;color: #2d2f39;margin-bottom: 8px;}
.util .notiPopup .utilPopup_wrap .noNoti span{font-size: 12px;line-height: 1.58; letter-spacing: -0.43px; text-align: center; color: #737c80;}
.util .utilPopup .btnWrap{width:100%; padding:15px 30px 18px; font-size:14px; background:#fff; box-sizing:border-box;}
.util .utilPopup .btnWrap a.btn{height:40px; line-height:38px; font-weight:500;float: none;}
.util .utilPopup .btnWrap a.btn:hover{background:#f7f9ff;}
.util .hdService div.opener{font-size:0; width:56px; background:url("/hive/template/LOUD_IMG/top/ci-stunning-services@2x.png") 50% 50% no-repeat; background-size:76px 24px;}
.util .hdService .servicePopup .utilPopup_wrap{width:312px; padding:10px 24px 6px;}
.util .hdService .servicePopup .utilPopup_wrap > span{display:inline-block; padding-bottom:4px; font-size:11px; color:#444;}
.util .hdService .servicePopup ul li{border-top:1px solid #f1f1f1;}
.util .hdService .servicePopup ul li a{position:relative; padding:15px 0 16px 120px; font-size:13px; line-height:150%;}
.util .hdService .servicePopup ul li a:hover{opacity:0.7;}
.util .hdService .servicePopup ul li a span.ico{position:absolute; left:25px; top:50%; transform:translateY(-50%); display:inline-block; width:70px; height:32px; }
.util .hdService .servicePopup ul li.loud a span.ico{background:url("/hive/template/LOUD_IMG/top/ci-loud@2x.png") 50% 50% no-repeat; background-size:52px 16px;}
.util .hdService .servicePopup ul li.nf a span.ico{background:url("/hive/template/LOUD_IMG/top/ci-notefolio@2x.png") 50% 50% no-repeat; background-size:70px 13px;}
.util .hdService .servicePopup ul li.ceter a span.ico{background:url("/hive/template/LOUD_IMG/top/bi-stunning-center@2x.png") 50% 50% no-repeat; background-size:32px;}
.util .hdService .servicePopup ul li.lounge a span.ico{background:url("/hive/template/LOUD_IMG/top/bi-stunning-lounge@2x.png") 50% 50% no-repeat; background-size:32px;}
.util .hdService .servicePopup ul li.print a span.ico{background:url("/hive/template/LOUD_IMG/top/bi-stunning-print@2x.png") 50% 50% no-repeat; background-size:32px;}
.util .hdService .servicePopup ul li.chapters a span.ico{background:url("/hive/template/LOUD_IMG/top/bi-notefolio-chapters@2x.png") 50% 50% no-repeat; background-size:32px;}
.util .hdService .servicePopup ul li a b{letter-spacing:-0.25px; line-height:18px; color:#444;}
.util .hdService .servicePopup ul li.comingSoon a b:after{display:inline-block; content:"준비중"; margin-left:4px; padding:0 6px; height:18px; line-height:15px; font-size:11px; font-weight:500; letter-spacing:-0.4px; text-align:center; color:#aaa; border-radius:9px; border:1px solid #e1e1e1; box-sizing:border-box; vertical-align:top;}
.util .hdService .servicePopup ul li.comingSoon a:hover{opacity:1.0;}
.util .hdService .servicePopup ul li a p.txt{padding-top:3px; letter-spacing:-0.4px; color:#999;}

#gnb{position:absolute; top:0; left:180px; vertical-align:top;}
#gnb > ul{display:inline-block;}
#gnb > ul > li > a{position:relative; padding:0 20px; display:block; height:64px; line-height:64px; font-size:17px; font-weight:600; color:#2e3248; letter-spacing:-0.8px;}
#gnb > ul > li.active > a,
#gnb > ul > li > a:hover{color:#505bf0;}
/* #gnb > ul > li.depth-1.active a:after{display:block; content:""; position:absolute; bottom:-2px; left:50%; margin-left:-7.5px; width:15px; height:9px; background:url("/hive/template/LOUD_IMG/top/ico-gnb-arrow.png") 50% 0 no-repeat; transition:all 0.3s;} */
#gnb > ul > li.bullet > a:after{display:inline-block; content:""; position:absolute; top:50%; right:7px; margin-top:-2.5px; width:5px; height:5px; background:#505bf0; border-radius:50%;}
/* #gnb > ul > li > a:after{content:""; position: absolute; left:5%; bottom:36%; width:0; height:10px; background:#fff; transition: all .6s;}
#gnb > ul > li > a:hover:after{width:75%; background: rgba(152,149,162,.15);} */

#gnb > ul > li.t_notefolio > a:after{margin-left:3px; display:inline-block; content:""; width:12px; height:12px; background:url("/hive/template/LOUD_IMG/top/ico_gnb_nf.png") 0 0 no-repeat; background-size:contain;}
#gnb > ul > li.t_notefolio > a:hover:after{background:url("/hive/template/LOUD_IMG/top/ico_gnb_nf_hover.png") 0 0 no-repeat; background-size:contain;}

#gnb .moreMenu{position:relative; display:inline-block; margin:14px 0 0 10px; padding-bottom:11px; vertical-align:top;}
#gnb .moreMenu::before{position: absolute; top:15px; left:-10px; display:block; content:""; width:1px; height:10px; background:#ddd;}
#gnb .moreMenu .btn{position:relative; padding:0 20px 0 10px; width:auto; height:40px; line-height:38px; font-size:15px; text-align:center; color:#6e6d7a; letter-spacing:-0.63px; background:none; box-shadow:none; -webkit-box-shadow:none; border-color:#fff;}
#gnb .moreMenu.active .btn{color:#505bf0; font-weight:600;}
#gnb .moreMenu .btn:after{display:block; content:""; position:absolute; top:12px; right:5px; width:12px; height:12px; background:url("/hive/template/LOUD_IMG/top/icn-down-arrow-light@2x.png") 50% 50% no-repeat; background-size:12px; transition:all 0.3s;}
#gnb .moreMenu.active .btn:after{transform:rotate(-180deg);}
#gnb .moreMenu .moreMenuWrap{display:none; position:absolute; top:50px; left:-35px; width:420px; box-shadow:0 4px 15px 0 rgba(7, 42, 68, 0.1); border:1px solid #e9e9e9; background:#fff;}
#gnb .moreMenu.active .moreMenuWrap{display:block;}
#gnb .moreMenu .moreMenuWrap > div{width:50%; padding:25px 30px 25px 40px; box-sizing:border-box;}
#gnb .moreMenu .moreMenuWrap > div:first-child{border-right:1px solid #e9e9e9;}
#gnb .moreMenu .moreMenuWrap span{margin-bottom:10px; display:block; line-height:18px; font-size:14px; letter-spacing:-0.58px; color:#6e6d7a;}
#gnb .moreMenu .moreMenuWrap .quick span:after{margin-left:10px; display:inline-block; content:"QUICK"; width:50px; height:18px; line-height:18px; font-size:12px; color:#505bf0; font-weight:500; text-align:center; border-radius:1rem; background:#eef3fd;}
#gnb .moreMenu .moreMenuWrap ul li a{position:relative; display:block; height:36px; line-height:36px; font-size:16px; font-weight:500; letter-spacing:-0.67px; color:#2e3248;}
#gnb .moreMenu .moreMenuWrap ul li a.bullet:after{display:inline-block; content:""; position:relative; top:-1px; margin-left:4px; width:5px; height:5px; background:#505bf0; border-radius:50%; vertical-align:middle;}
#gnb .moreMenu .moreMenuWrap ul li a:hover{color:#505bf0;}

#footer .inner{padding:0 80px;}
#footer .ft_top{position:relative; height:240px; padding:0 240px 0 250px;}
#footer .ft_top .ft_box{position:absolute; top:0;}
#footer .ft_top .ft_loud{left:0;}
#footer .ft_top .ft_loud .ft_logo{padding-top:40px; width:150px; font-size:13px; background:url("/hive/template/LOUD_IMG/common/ft_logo_en.png") 0 0 no-repeat; background-size:60.25%;}
#footer .ft_top .ft_loud .ft_logo a{color:#fff;}
#footer .ft_top .ft_loud .ft_logo a:hover{color:#a1a8ff;}
#footer .ft_top .ft_loud .btn_notefolio{display:inline-block; margin-top:108px; width:175px; height:42px; line-height:40px; text-align:center ;color:#fff; font-size:12px; border:1px solid rgba(255,255,255,0.46); border-radius:3px; transition:all 0.3s;}
#footer .ft_top .ft_loud .btn_notefolio:before{position:relative; top:-1px; display:inline-block; content:""; margin-right:7px; width:14px; height:14px; background:url("/hive/template/LOUD_IMG/common/img_nplogo.png") 50% 50% no-repeat; vertical-align: middle;}
#footer .ft_top .ft_loud .btn_notefolio:hover{background-color:rgba(255, 255, 255, 0.2); border:1px solid rgba(255, 255, 255, 0.5);}
#footer .ft_top .ft_cs{right:0;}
#footer .ft_top .ft_cs > p{font-size:13px; margin-bottom:10px; font-weight:bold;}
#footer .ft_top .ft_cs div{font-size:0;}
#footer .ft_top .ft_cs div dl:not(:last-child){padding-right:5px;}
#footer .ft_top .ft_cs div.csContact dl:not(:last-child):after{display:inline-block; content:""; width:1px; height:10px; background:#888; vertical-align:middle;}
#footer .ft_top .ft_cs div.csContact dl:not(:last-child) dd{padding-right:5px;}
#footer .ft_top .ft_cs dl{padding-top:4px; display:inline-block; font-size:12px; opacity:0.46; vertical-align:top;}
#footer .ft_top .ft_cs dl dt,
#footer .ft_top .ft_cs dl dd{display:inline-block; letter-spacing:-0.46px; vertical-align:top;}
#footer .ft_top .ft_cs dl dt.hidden{display:none;}
#footer .ft_top .ft_cs #btnChannelCs{padding:0 15px 0 0; height:40px; line-height:40px; font-size:12px; font-weight:600; color:#fff; background:none !important; box-shadow:none !important; border:none; outline:none; cursor:pointer;}
#footer .ft_top .ft_cs #btnChannelCs:before{display:inline-block; content:""; width:10px; height:40px; margin-right:5px; background:url("/hive/template/LOUD_IMG/common/ico-chat.png") 50% 50% no-repeat; vertical-align:top;}
#footer .ft_top .ft_util{font-size:0}
#footer .ft_top .ft_util .ft_shortcut{display:inline-block; width:20%; font-size:13px; vertical-align:top;}
#footer .ft_top .ft_util .ft_shortcut > span{display:block; margin-bottom:10px;font-weight:bold;}
#footer .ft_top .ft_util .ft_shortcut ul li a{display:inline-block; height:32px; line-height:32px; opacity:0.46; color:#fff; transition:all 0.3s;}
#footer .ft_top .ft_util .ft_shortcut ul li a:hover{opacity:1;}
#footer ul.loud_sns{margin-top:35px; font-size:0;}
#footer ul.loud_sns li{display:inline-block;}
#footer ul.loud_sns li:not(:last-child){margin-right:15px;}
#footer ul.loud_sns li a{display:block; width:30px; height:40px; font-size:0;}
#footer ul.loud_sns li.blog a{background:url("/hive/template/LOUD_IMG/common/ico-sns-blog.png") 50% 50% no-repeat;}
#footer ul.loud_sns li.blog:hover a{background:url("/hive/template/LOUD_IMG/common/ico-sns-blog-hover.png") 50% 50% no-repeat;}
#footer ul.loud_sns li.facebook a{background:url("/hive/template/LOUD_IMG/common/ico-sns-facebook.png") 50% 50% no-repeat;}
#footer ul.loud_sns li.facebook:hover a{background:url("/hive/template/LOUD_IMG/common/ico-sns-facebook-hover.png") 50% 50% no-repeat;}
#footer ul.loud_sns li.instagram a{background:url("/hive/template/LOUD_IMG/common/ico-sns-instagram.png") 50% 50% no-repeat;}
#footer ul.loud_sns li.instagram:hover a{background:url("/hive/template/LOUD_IMG/common/ico-sns-instagram-hover.png") 50% 50% no-repeat;}
#footer ul.loud_sns li.pinterest a{background:url("/hive/template/LOUD_IMG/common/ico-sns-pinterest.png") 50% 50% no-repeat;}
#footer ul.loud_sns li.pinterest:hover a{background:url("/hive/template/LOUD_IMG/common/ico-sns-pinterest-hover.png") 50% 50% no-repeat;}
#footer ul.loud_sns li.youtube a{background:url("/hive/template/LOUD_IMG/common/ico-sns-youtube.png") 50% 50% no-repeat;}
#footer ul.loud_sns li.youtube:hover a{background:url("/hive/template/LOUD_IMG/common/ico-sns-youtube-hover.png") 50% 50% no-repeat;}
#footer .ft_bottom{position:relative; padding-right:400px; border-top:1px solid #333; font-size:12px; padding:2rem 25rem 2.5rem 0;}
#footer .ft_bottom dl,
#footer .ft_bottom dl dt,
#footer .ft_bottom dl dd{display:inline-block;}
#footer .ft_bottom dl{padding-right:10px; opacity:0.46;}
#footer .ft_bottom dl dt{font-weight:500;}
#footer .ft_bottom dl dt:after{display:inline-block; content:""; margin:0 5px; width:1.2px; height:10px; background:#888;}
#footer .ft_bottom .ft_guide{margin-top:2px; opacity:0.46;}
#footer .ft_bottom .ft_guide:before{margin-right:10px; display:inline-block; content:""; width:51px; height:18px; background:url("/hive/template/LOUD_IMG/common/ft_logo_ko.png") 0 50% no-repeat; vertical-align:middle;}
#footer .ft_bottom .ft_etc{position:absolute; top:20px; right:0;}
#footer .ft_bottom .ft_etc .apps{font-size:0;}
#footer .ft_bottom .ft_etc .apps a{display:inline-block; width:110px; height:42px; line-height:40px; text-align:center; font-size:12px; color:#fff; border:1px solid rgba(255,255,255,0.46); border-radius:3px; box-sizing:border-box;}
#footer .ft_bottom .ft_etc .apps a:not(:last-child){margin-right:8px;}
#footer .ft_bottom .ft_etc p.copyright{text-align:right; opacity:0.46;}


@keyframes handShaker {
  0%{transform:rotate(0deg)}
  50%{transform:rotate(45deg)}
  100%{transform:rotate(0deg)}
}





.jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content {
	overflow: hidden !important;
}

@media screen and (max-height:768px) {
   .util li.member .profilePopup .utilPopup_wrap{max-height:75vh; overflow-y:auto; -ms-overflow-style:none; scrollbar-width: none;}
   .util li.member .profilePopup .utilPopup_wrap::-webkit-scrollbar{display:none;}
}

@media screen and (max-width:1280px) {
   #gnb > ul > li > a {padding:0 15px;}
   #header .util{font-size: 13px;}

}

.jconfirm .row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}

.jconfirm .justify-content-lg-center {
    -ms-flex-pack: center !important;
    justify-content: center !important;
}
.jconfirm-row{
  display:flex;
}
.col-md-4 {
  -ms-flex: 0 0 33.333333%;
  flex: 0 0 33.333333%;
  max-width: 33.333333%;
}

.select{    background-color: #000;}


.nav_li a:hover, .dropdownli:hover .dropbtn, .nav_li a:hover, .dropdownli.active .dropbtn {
    background-color: #000;
}

li.dropdownli {
    display: inline-block;
}
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #fff;
	box-shadow:0 1px 3px #ddd;
	z-index:11;
	border:1px solid #e5e5e5;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
        width: 140px;

}

.dropdown-content a:hover {background-color:#d5d5d7;width: 140px;}
.object-list a{font-size: 13px;}
.dropdownli:hover .dropdown-content {
    display: block;
}

.paginate_simple.paginate_simple_new{
  font-size:0;
}
.paginate_simple.paginate_simple_new > div,
.paginate_simple.paginate_simple_new > a{
  margin-right:3px;
  padding:0;
  width:32px;
  height:32px;
  line-height:32px;
  text-align:center;
  border-radius:3px;
  background-color:#eef3fd;
  font-size: 12px;
  color:#666;
  border:none;
  cursor:pointer;
  box-sizing: border-box;
  transition:all 0.3s;
}
.paginate_simple.paginate_simple_new > div:hover{
  background-color:#e4ebfb;
  color: #2d2f39;
}

.paginate_simple.paginate_simple_new > strong{
  margin-right:3px;
  width:32px;
  height:32px;
  text-align:center;
  padding:0;
  line-height:32px;
  border-radius:3px;
  background-color:#2d2f39;
  border:none;
  box-sizing:border-box;
}

.paginate_simple.paginate_simple_new > div img{
  background-color: transparent;
  border: none;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.top_right_section{display:inline-block;float:right;margin-top:16px;}
.member_section{float:left;display:inline-block;text-align:center;}
.login_section{display:inline-block;width:60px;line-height:40px;color:#fff;font-size:13px;}
.noti_section{display:inline-block;width:74px;height:40px;line-height:40px;color:#Ff4D4D;background-color:#111;border-right:1px solid #30313c;font-size:13px;}
.login_section span, .noti_section span{color:#fff;font-weight:400;font-size:13px;}
.login_section span:hover{color:#dedede;}
.askBtn{width:100px;height:38px;line-height:38px;display:inline-block;vertical-align:top;background-color:#fd6569;color:white;border-radius:5px;margin-left:20px;font-weight:bold;text-align:center;font-size:13px;}
.askBtn:hover{background-color:#f95055}
.join_section span, .mypage_section span{color:white;font-size:12px;}
.join_section{display:inline-block;width:100px;height:40px;line-height:40px;color:white;background-color:#111;}
.mypage_section{display:inline-block;width:150px;height:40px;line-height:40px;color:white;background-color:#111;}
.noti_section:hover{background-color:#171A27;color:#Ff4D4D}
.join_section:hover, .mypage_section:hover{background-color:#171A27;color:white;}

#inquirePop,#inquireResultPop,#signlayerwrap{display:none;position:absolute;top:100px;left:50%;margin-left:-220px;width:360px;padding:35px 40px;height:480px;background-color:white;border-radius:10px;z-index:99991;clear:both;}
.xBtn{cursor:pointer;position:absolute;top:25px;right:25px;}
#inquirePop .poptitle{font-weight:bold;font-size:20px;}
#inquirePop .popsubtitle{display:inline-block;width:220px;font-size:13px;color:#2d2d36;margin-top:30px;margin-bottom:24px;letter-spacing:-0.6px;}
#inquirePop .popphoto{display:inline-block;width:130px;overflow:hidden;vertical-align:top;margin-left:3px;margin-top:30px;}
#inquirePop .popphoto img{width:130px;}
#inquirePop .seclabel{display:inline-block;text-align:left;vertical-align:top;width:75px;font-weight:bold;font-size:14px;line-height:45px;}
#inquirePop .privacy{padding:6px;font-size:11px;color:#999;height:50px;overflow-y:scroll;display:block;margin-top:5px;border:1px solid #eee;background-color:#f0f0f0; clear:both;}
#inquirePop  .privacyagree{margin-top:10px;color:#2d2d36}
#inquirePop .inputs{display:inline-block;vertical-align:top;width:266px;margin-top:10px;float:right;}
#inquirePop .inputs input[type="text"]{border:1px solid #ccc;height:32px;line-height:32px;width:100%;padding:0;}
#inquirePop .inputs textarea{border:1px solid #ccc;height:90px;width:100%;margin-bottom:8px;}
.popaskBtn{display: inline-block;cursor:pointer;vertical-align: top;background-color: #2d2d36;border:1px solid #2d2d36;color: white;height: 52px;line-height: 52px;text-align: center;font-size: 16px;width:100%;margin-top:14px;}
.popaskBtn:hover{background-color:#4c4c5a;}
.registerBtnWrap{display: block; margin-top: 8px;}
.registerBtn{display: inline-block;cursor:pointer;vertical-align: top;border:1px solid #ccc;color: #2d2d36;height: 50px;line-height: 50px;text-align: center;font-size: 16px;width:100%;background-color:#efefef}
.registerBtn:hover{background-color:#dedede;}
#inquireResultPop .restitle{font-weight:bold;font-size:20px;padding:20px 0 10px 0;margin:0 auto;text-align:center;}
#inquireResultPop .resphoto{width:80px;height:80px;border-radius:40px;overflow:hidden;margin:20px auto 0 auto;}
#inquireResultPop .resphoto img{width:80px;height:80px;}
#inquireResultPop .ressubtitle{font-size:14px;color:#2d2d36;margin-top:30px;width:100%;text-align:center;border-bottom:1px solid #d3d4d6;padding-bottom:30px;}
#inquireResultPop .resmsg{margin-top:30px;color:#666;font-size:12px;text-align:center;margin-bottom:20px;}

#signlayerwrap{height:auto;width:470px; padding:54px 45px 37px; box-sizing:border-box;}
#signlayerwrap .poptitle{font-weight:bold;font-size:20px;margin-bottom:30px;}
#signlayerwrap .login_box{border-bottom:1px solid #e9e9e9;}
#signlayerwrap .login_box .inputBox{margin-bottom:8.5px;}
#signlayerwrap .login_box .inputBox.pwBox{margin-bottom:12px;}
#signlayerwrap .login_box .inputBox dt{display:none; font-size:0;}
#signlayerwrap .login_box .inputBox dd input{margin:0; padding:0 18px; width:100%; height:47px; line-height:45px; font-size:14px; color:#666; border-radius:5px; border:1px solid #ddd; box-sizing:border-box;}
#signlayerwrap .login_box .popaskBtn{position:relative; display:block; height:54px; line-height:54px; text-align:center; font-size:16px; font-weight:bold; color:#fff; border-radius:5px; background:#505bf0; border:none;}
#signlayerwrap .login_box .popaskBtn:hover:after{display:block; content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(255, 255, 255, 0.15);}
#signlayerwrap .others{padding:12px 0 15px; position:relative; font-size:12px; color:#666; font-weight:500;}
#signlayerwrap .otherslabel{display:inline-block;cursor:pointer}
#signlayerwrap .otherslabel:hover{font-weight:bold;}
#signlayerwrap .others .find_account{position:absolute; bottom:5px; right:0; font-size:0; padding-right:12px; background:url("/hive/template/LOUD_IMG/member/ico-arrow-right.png") right 52% no-repeat; background-size:7px 11px;}
#signlayerwrap .others .find_account li{display:inline-block; font-size:12px; height:36px; line-height:36px; color:#666;}
#signlayerwrap .others .find_account li:not(:last-child):after{padding:0 2px; content:"·"}
#signlayerwrap .others .find_account li a{display:inline-block;; height:36px; line-height:36px; color:#666;}
#signlayerwrap .others .find_account li a:hover{color:#505bf0;}
#signlayerwrap .social_login_box{padding:20px 0 38px; text-align:center;}
#signlayerwrap .social_login_box p{margin-bottom:10px; font-size:14px; font-weight:bold;}
#signlayerwrap .social_login_box ul{font-size:0;}
#signlayerwrap .social_login_box ul li{display:inline-block; margin:0 8px;}
#signlayerwrap .social_login_box ul li a{position:relative; display:block; width:56px; height:56px; border-radius:50%; overflow:hidden;}
#signlayerwrap .social_login_box ul li a:hover:after{display:block; content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(255, 255, 255, 0.15);}
#signlayerwrap .social_login_box ul li.naver a{background:url("/hive/template/LOUD_IMG/member/ico_login_naver.png") 50% 50% no-repeat; background-size:contain;}
#signlayerwrap .social_login_box ul li.kakao a{background:url("/hive/template/LOUD_IMG/member/ico_login_kakao.png") 50% 50% no-repeat; background-size:contain;}
#signlayerwrap .social_login_box ul li.apple a{background:url("/hive/template/LOUD_IMG/member/ico_login_apple.png") 50% 50% no-repeat; background-size:contain;}
#signlayerwrap .join_banner{border-radius:5px; overflow:hidden; background:#eef3fd url("/hive/template/LOUD_IMG/member/img_join_banner.png") 90% 50% no-repeat; background-size:71px 57px;}
#signlayerwrap .join_banner a{position:relative; display:block; padding:22px 36px;}
#signlayerwrap .join_banner a:hover:after{display:block; content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(255, 255, 255, 0.15);}
#signlayerwrap .join_banner p{font-size:12px; color:#2b2c35; letter-spacing:-0.3px;}
#signlayerwrap .join_banner span{margin-top:7px; display:inline-block; padding-right:12px; font-size:15px; color:#505bf0; font-weight:bold; background:url("/hive/template/LOUD_IMG/member/ico-arrow-join-banner.png") right 50% no-repeat; background-size:8px 13px;}


/* The container */
#signlayerwrap .container {
  display: inline-block;
  position: relative;
  padding-left:22px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  line-height:18px;
}

#signlayerwrap .container.loginsave{padding-top: 0; padding-bottom: 0; background-color: #ffffff;}

/* Hide the browser's default checkbox */
#signlayerwrap .container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
#signlayerwrap .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 18px;
  width: 18px;
  border-radius: 4px;
  border: solid 2px #dddddd;
  background-color: #f8f8f8;
  box-sizing: border-box;
}

/* On mouse-over, add a grey background color */
#signlayerwrap .container:hover input ~ .checkmark {
  border: solid 2px #6f79ff;
}

/* When the checkbox is checked, add a blue background */
#signlayerwrap .container input:checked ~ .checkmark {
  border: solid 2px #6f79ff;
}

/* Create the checkmark/indicator (hidden when not checked) */
#signlayerwrap .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
#signlayerwrap .container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
#signlayerwrap .container .checkmark:after {
  left: 1.5px;
  top: 3px;
  width: 11px;
  height: 8px;
  background-image: url("/hive/template/LOUD_IMG/signIn/ic-select.png");
  background-size: cover;
  background-repeat: no-repeat;
}

.notiCenter{display:none;font-size:13px;}
.belowProfile{display:none;letter-spacing: -1px;}
.noti_dropdown:hover .notiCenter {
    display: block;
}
.mypage_dropdown:hover .belowProfile {
    display: block;
}
.mypage_dropdown{position:relative;}

.notiCenter {
    display: none;
    position: absolute;
    background-color: #fff;
    width:222px;
	z-index:13;
	box-shadow:0 1px 3px #ddd;
	border:1px solid #e5e5e5;
}

.notiCenter a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
	font-size:13px;
}
.notiCenter .notiTime{
	color:#666;font-size:10px;
}

.belowProfile {
    display: none;
    position: absolute;
    background-color: #fff;
    width:222px;
	box-shadow:0 1px 3px #ddd;
	z-index:13;
	border:1px solid #e5e5e5;
	right:0;
}

.belowProfile a {
    color: black;
    padding:12px 30px  12px 48px;
    text-decoration: none;
    display: block;
    text-align: left;

}
.notiCenter a:hover, .belowProfile a:hover {color:#Ff4D4D;background-color:white;}

.notiCenter .ico1 {background:#fff url(/hive/template/LOUD_IMG/sprite.png) no-repeat 15px -537px;float:left;		display:inline-block;width:40px;height:22px;margin-top:14px;vertical-align:middle;}

.belowProfile .ico1 {background:#fff url(/hive/template/LOUD_IMG/sprite.png) no-repeat 13px -99px;float:left;		display:inline-block;width:40px;height:22px;margin-top:14px;vertical-align:middle;}
.belowProfile .ico2 {background:#fff url(/hive/template/LOUD_IMG/sprite.png) no-repeat 13px -154px;float:left;	display:inline-block;width:40px;height:22px;margin-top:14px;vertical-align:middle;}
.belowProfile .ico3 {background:#fff url(/hive/template/LOUD_IMG/sprite.png) no-repeat 16px -455px;float:left;	display:inline-block;width:40px;height:22px;margin-top:14px;vertical-align:middle;}
.belowProfile .ico4 {background:#fff url(/hive/template/LOUD_IMG/sprite.png) no-repeat 13px -262px;float:left;	display:inline-block;width:40px;height:22px;margin-top:14px;vertical-align:middle;}
.belowProfile .ico5 {background:#fff url(/hive/template/LOUD_IMG/sprite.png) no-repeat 13px -722px;float:left;	display:inline-block;width:40px;height:22px;margin-top:14px;vertical-align:middle;}
.belowProfile .ico6 {background:#fff url(/hive/template/LOUD_IMG/sprite.png) no-repeat 13px -261px;float:left;	display:inline-block;width:40px;height:22px;margin-top:14px;vertical-align:middle;}
.belowProfile .icoheart {background:#fff url(/hive/template/LOUD_IMG/mypage/heart.png) no-repeat 17px 0px;float:left;	display:inline-block;width:40px;height:22px;margin-top:14px;vertical-align:middle;}

.update_icon{background-color:#505bf0;width:5px;height:5px;border-radius:5px;display:inline-block;margin-left:8px;margin-bottom:1px;position:relative; top:-2px;}


.clearfix:after, .container:after, .container-fluid:after, .row:after, .form-horizontal .form-group:after, .btn-toolbar:after, .btn-group-vertical>.btn-group:after, .nav:after, .navbar:after, .navbar-header:after, .navbar-collapse:after, .pager:after, .panel-body:after, .modal-footer:after{
	clear:both;
}
.panel-default{border-color:#ddd}
.panel{
	border:1px solid transparent;
	border-radius:4px;
	box-shadow:0 1px 1px rgba(0,0,0,.05)
}
.panel-default>.panel-heading{
	color:#333;
	background-color:#f5f5f5;
	border-color:#ddd;
}
.panel-heading{
	padding:10px 15px;
	border-bottom:1px solid transparent;
	border-top-right-radius:3px;
	border-top-left-radius:3px;
	box-sizing:border-box;
}

.panel-body{padding:15px;}
.row{margin-left:-15px; margin-right:-15px;}

.clearfix:before, .clearfix:after, .container:before, .container:after, .container-fluid:before, .container-fluid:after, .row:before, .row:after, .form-horizontal .form-group:before, .form-horizontal .form-group:after, .btn-toolbar:before, .btn-toolbar:after, .btn-group-vertical>.btn-group:before, .btn-group-vertical>.btn-group:after, .nav:before, .nav:after, .navbar:before, .navbar:after, .navbar-header:before, .navbar-header:after, .navbar-collapse:before, .navbar-collapse:after, .pager:before, .pager:after, .panel-body:before, .panel-body:after, .modal-footer:before, .modal-footer:after{content: " "; display:table;}

:before, :after{
	box-sizing:border-box;
}

.clearfixNew::after,.clearfix:after{content:" "; display: block; width:100%; height:0; clear:both;}

.col-xs-12{
	width:230px;
}
ul{
	margin-top:0;
}

.pull-right{
	float:right!important;
}
.pagination{
	display:inline-block;
	padding-left:0;
	border-radius:4px;
}
.pagination>li{
	display:inline;
}
.pagination>li:first-child>a, .pagination>li:first-child>span{
	margin-left:0;
	border-bottom-left-radius:4px;
	border-top-left-radius:4px;
}
.pagination>li:last-child>a, .pagination>li:last-child>span{border-bottom-right-radius:4px; border-top-right-radius:4px;}
.pagination>li>a, .pagination>li>span{
	position:relative;
	float:left;
/* 	padding:6px 12px; */
	padding:5px 0px;
	line-height:1.428571429;
	text-decoration:none;
	color:#428bca;
	/* background-color:#fff;
	border:1px solid #ddd; */
	margin-left:1px;
}
.noscroll {
    overflow: hidden;
    padding-right: 15px;
}

.nav_body{
	display: none;
}
.nav_top{
	position: fixed;
	bottom: 30px;
	right: 30px;
	width:49px;
	height:49px;
}
.goTop{
	background-image: url(/hive/template/LOUD_IMG/job/bt_right.png);
	width:49px;
	height:49px;
	-ms-transform: rotate(-90deg); /* IE 9 */
    -webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
    transform: rotate(-90deg);
}

#congrats_wrap{background: url(/images_rn/common/bg_dark.png) repeat; display: block; height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 99990;}
#congrats_wrap .cong_imgar{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
#congrats_wrap .cong_imgar .cong_mainar{box-sizing: border-box;width: 520px;height: 520px;border-radius: 10px;background-color: #ffffff;text-align: center;z-index: 99991;}
#congrats_wrap .cong_imgar .cong_mainar{position: relative;padding-top: 90px;}
#congrats_wrap .cong_imgar .cong_mainar .cong_maintxt{font-size: 24px;line-height: 1.5;letter-spacing: -1.8px;color: #444444;margin-bottom: 35px;}
#congrats_wrap .cong_imgar .cong_mainar .cong_subtxt{font-size: 15px;line-height: 1.53;letter-spacing: -1.1px;color: #838383}
#congrats_wrap .cong_imgar .cong_mainar .img_team{position:absolute;bottom: 0;left: 50%;transform: translate(-50%);}
#congrats_wrap .cong_imgar .cong_mainar .img_xbox{display: block;position:absolute;top: 13px;right: 13px;}
#congrats_wrap .left_fanbox{position: absolute;top: -20px;left: -230px;}
#congrats_wrap .right_fanbox{position: absolute;right: -170px;bottom: -120px;}

#congrats_wrap #pop_round{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    right: 0;
    margin: auto;
    padding: 17px;
    background-color: white;
    border-radius: 10px;
    z-index: 99991;
    clear: both;
    background-image: url(/hive/template/LOUD_IMG/common/popup/run_pc.png);
    background-repeat: no-repeat;
    background-position: bottom;
}
#congrats_wrap .w520{
    width: 486px;
    height: 525px;
}
#congrats_wrap .cl_inline.circle{
    width: 112px;
    height: 112px;
    margin: 0 8px;
    border: 1px solid #ccc;
    position: relative;
    font-size: 12px;
}
#congrats_wrap .cl_inline.circle:hover{border: 1px solid #fd6569;}
#congrats_wrap .pop_x{
    padding-bottom: 28px;
    cursor: pointer;
}
#congrats_wrap .pop_title{
    font-size: 24px;
    padding-bottom: 20px;
    line-height: 34px;
    letter-spacing: -1.8px;
    color: #444;
}
#congrats_wrap .pop_title strong{color: #444;}
#congrats_wrap .pop_content{
    font-size: 14px;
    padding-bottom: 17px;
    line-height: 20px;
    letter-spacing: -1.05px;
    color: #666;
}
#congrats_wrap .pop_option a:first-child .circle img{
 padding: 28px 0 11px 0;
 color: #444;
}
#congrats_wrap .pop_option a:first-child .circle strong{
 letter-spacing: -0.9px;
 line-height: 14px;
 color:#444;
}
#congrats_wrap .pop_option a:last-child .circle img{
 padding: 29px 0 19px 0;
}

.event_bannerWrap{display: none; background-color: #151628; position: relative;}
.event_bannerWrap .event_banner2{display: block;}
.event_bannerWrap .event_banner2 .banner_inner{width:1024px; margin:0 auto; height:64px;position: relative;}
.event_bannerWrap .event_banner2.client .banner_inner{background:url('/hive/template/LOUD_IMG/award/img_top_bn_client.png') top center no-repeat}
.event_bannerWrap .event_banner2.designer .banner_inner{background:url('/hive/template/LOUD_IMG/award/img_top_bn.png') top center no-repeat}
.event_bannerWrap .eventXbox{cursor: pointer;width: 27px;height: 27px;position: absolute;top: 18.5px; right: 20px;
                          background-image:url('/hive/template/LOUD_IMG/award/ic_delete.png'); background-size:cover; background-repeat: no-repeat;}

.commonLoading{display: none; height: 100%; left: 0; position: fixed; top: 0; width: 100%; background: url('/hive/template/LOUD_IMG/common/bg_dark.png') repeat; z-index: 999999999;}
.commonLoadingTxt{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; width: 31%; height: 220px; background-color: #ffffff; border-radius: 3px; opacity: 0.9;}
.commonLoadingImg{width: 180px;}
.commonLoadingTxt p{position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%); font-size: 15px; width: 100%;}

.allmenubtn{height:69px;width:68px;text-align:center;background-color:#14151a;margin-right:5px;overflow:hidden;cursor:pointer;}
.allmenuimg{padding: 27px 15px;}

.allmenu_eachWrap{
  margin: 0 auto;
  width: 90%;
  min-width: 1180px;
}
.allmenu_each:first-of-type{
  margin-left: 120px;
}

.allmenu_each:last-of-type .object-list{
  margin-right: 0;
}

.allmenu_each:last-of-type .nav_li_sub .object-list a{
  margin-right: 0;
}

@media (max-width: 1320px) {
  .header_section{min-width:1180px;}
  .allmenu_eachWrap{min-width: 1180px}
}

@media (max-width: 1250px) {
  .nav_section {margin-left: 0px;}
  .allmenu_each:first-of-type {margin-left: 110px;}
}

.allmenu{height:0px;top:69px;position:absolute;z-index:1;left:0;width:100%;background-color:white;box-shadow: 4px 3px 35px 0 rgba(0, 0, 0, 0.2);overflow:hidden;cursor:default;
-moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    box-sizing: border-box;
    text-align: left;
    display: none;
    z-index: 12;
}
.allmenubtn:hover{background-color:#000000;}
.allmenu.active{height:264px;}
.allmenu_each {
  display: inline-block;
  vertical-align: top;
  text-align: left;

}

.allmenuWrap .dropbtn{font-weight: 500; font-size: 14px; height: 32px; border-radius: 16.5px; background-color: #222129; line-height: 31px; vertical-align: middle; margin-top: 19px;margin-left: 14px;}
.allmenuWrap .dropbtn:hover{background-color: #000000;}
.allmenuWrap .headerDown, .allmenuWrap .headerUp{vertical-align: middle; margin-left: 4px;margin-bottom: 1px;}
.allmenuWrap .dropbtn .headerUp{display: none;}
.allmenuWrap.active .dropbtn .headerUp{display: inline-block}
.allmenuWrap.active .dropbtn .headerDown{display: none}

.nav_li_sub .object-list, .nav_li_sub .object-list a{
  font-size: 14px;
  margin: 0px 27px 15px 0px;
  font-weight: 400;
  color: #666;
  letter-spacing: -0.35px;
}
.nav_li_sub .object-list span{
  font-weight: bold;
  color:#292a34;
}
.nav_li_sub .object-list a:hover{

  background-color: #fff;
  border-bottom: 1px solid #64636d;
}

.guideWrap{top: 0; left: 0; width: 100%; height: 100%; position: fixed; z-index: 10000; display: block; outline: none !important;
	background: url('/hive/template/LOUD_IMG/common/bg_dark.png') repeat; overflow-y: auto; display: none;}
.guideWrap.showGuide{display: block !important;}
.guide{ box-sizing: border-box; padding: 68px 0; border-radius: 10px; margin: auto; font-size: 0; position: absolute;
	top: 85px; left: 0; right: 0; width: 1024px; background-color: #ffffff; z-index: 1000; margin-bottom: 80px; }
.guideXbtn{background-image: url('/hive/template/LOUD_IMG/guide/bt-close.png'); width: 33px; height: 33px; background-size: cover; position: absolute; right: 25px; top: 25px; cursor: pointer}
.guideIB{display: inline-block;}
.guideBtn{cursor: pointer}
.guideSub1, .guideSub2{padding: 0 80px; text-align: left}
.guideWrap .guideSub1{padding: 0 40px 0 80px;}
.guideSub2{background-color: #ebeff2;padding: 98px 80px 86px 80px;}
.gSub1Left{vertical-align: bottom;margin-bottom: 110px;margin-right: 40px;}
.gSub1Left img{margin-bottom: 15px;}
.gSub1Left .gSub1LeftTop{font-size: 30px;font-weight: bold; line-height: 1.47; letter-spacing: -0.75px; text-align: left; color: #000000;margin-bottom: 10px;}
.gSub1Left .gSub1LeftTop font{color: #7190ff}
.gSub1Left .gSub1LeftBot{font-size: 16px; line-height: 1.63; letter-spacing: -0.4px; color: #666;}
.gSub2Left{width: 36%; vertical-align: top}
.gSub2Right{width: 64%; margin-top: 52px;}
.gSub2Right .guideImgWrap{display: inline-block;position: relative;}
.gSub2RightTop .guideImgWrap:not(:last-of-type), .gSub2RightBot .guideImgWrap:not(:last-of-type){margin-right: 10px;}
.guideImgWrap div{display: none; width: 127px; height: 126px; border-radius: 50%; background-color: #141414;font-size: 13.5px; opacity: .9;
	font-weight: bold; line-height: 127px; letter-spacing: -0.34px; text-align: center; color: #ffffff;position: absolute; top: 0; left: 0;user-select: none}
.guideWrap .gSub2Right .guideImgWrap img{border-radius: 50%;}
.guideWrap .gSub2Red{font-size: 14px; font-weight: bold; letter-spacing: -0.35px; color: #fd6569; margin-bottom: 52px;}
.guideWrap .gSub2Blue{font-size: 14px; font-weight: bold; letter-spacing: -0.35px; color: #7190ff; margin-bottom: 44px;}
.guideWrap .gSub2Black{font-size: 24px; margin-bottom: 27px;font-weight: bold; line-height: 1.5; letter-spacing: -0.6px; text-align: left; color: #000000;}
.guideWrap .guideSub2 .smGSub2Black{font-size: 16px; line-height: 1.63; letter-spacing: -0.4px; text-align: left; color: #666666; margin-bottom: 27px;}
.guideWrap .gSub2RightTop{margin-bottom: 10px; text-align: right;}
.guideWrap .gSub2RightBot{text-align: right}
.guideWrap .guideSub3{padding: 80px 0 68px 0}
.guideWrap .guideSub3 .gSub2Blue, .guideSub3 .gSub2Black{margin-bottom: 44px; text-align: center;}
.guideWrap .guideBenefits{text-align: center;}
.guideWrap .benefitCard{padding: 30px 0;border-radius: 5px;box-shadow: 0.7px 5px 18px 0 #00000033; background-color: #ffffff; text-align: center; width: 192px; box-sizing: border-box;}
.guideWrap .benefitCard:not(:last-of-type){margin-right: 11px;}
.guideWrap .benefitCard img{margin-bottom: 33px;}
.guideWrap .benefitCard p{font-size: 17px; font-weight: bold; letter-spacing: -0.43px; color: #000000;margin-bottom: 25px;}
.guideWrap .benefitCard span{font-size: 14px;line-height: 1.57; letter-spacing: -0.35px; color: #666;}
.guideWrap .guideSub4{margin-bottom: 96px;}
.guideWrap .guideSub4 .gSub2Red{margin-bottom: 25px;}
.guideWrap .guideSub4 .gSub2Black{text-align: center; margin-bottom: 55px;}
.guideWrap .howToCardWrap{position: relative;}
.guideWrap .howToCardWrap .howArrow{position: absolute; bottom: 90px; right: 60px;}
.guideWrap .howCard{box-sizing: border-box; width: 260px; border-radius: 5px; box-shadow: 0.7px 5px 18px 0 #00000033; background-color: #ffffff;
	padding-bottom: 38px;z-index: 1;position: relative}
.guideWrap .howCard:not(:last-of-type){margin-right: 12px;}
.guideWrap .howCard .howStep{font-size: 16px;font-weight: bold; letter-spacing: -0.4px; text-align: center;margin-bottom: 20px;}
.guideWrap .howCard .howStepExp{margin-bottom: 27px;}
.guideWrap .howCard .gSub2Black{font-size: 18px;font-weight: bold; line-height: 1.28; letter-spacing: -0.45px; text-align: center;}
.guideWrap .howCard span{font-size: 14px; font-weight: 400; line-height: 1.57; letter-spacing: -0.35px; text-align: center; color: #666;}
.guideWrap .howCardTop{text-align:center;padding:11px 0; margin-bottom: 33px;border-top-left-radius: 5px;border-top-right-radius: 5px;}
.guideWrap .howCardTop1{background-color: #7190ff;}
.guideWrap .howCardTop2{background-color: #ff6364;}
.guideWrap .guideSub4.guideSub5{margin-bottom: 0;}
.guideWrap .guideCurrent{position: relative; padding-bottom: 90px;margin-bottom: 94px;}
.guideWrap .currentCardWrap{z-index: 1000; position: relative;}
.guideWrap .currentCardWrap .currentCard{display: inline-block; width: 220px; height: 179px;box-sizing: border-box; vertical-align: top;padding: 30px 0;border-radius: 10px;}
.guideWrap .currentCardWrap .currentCard:hover{box-shadow: 0.4px 3px 10px 0 #00000033;background-color: rgba(255, 255, 255, 0.7);;}
.guideWrap .currentCardWrap .currentCard .prevHref{width: 150px;height: 40px;line-height: 40px; display: none;border-radius: 5px;background-color: #7190ff; text-align: center;
	font-size: 13px; font-weight: bold; letter-spacing: -0.33px; color: #ffffff;margin:auto;}
.guideWrap .currentCardWrap .currentCard:hover .prevHref{display: block}
.guideWrap .currentCardWrap .currentCard p{font-size: 14px; font-weight: bold; letter-spacing: -0.35px; text-align: center; color: #666666; margin-bottom: 22px; }
.guideWrap .currentCardWrap .currentCard.currentBlue p{color:#3964ff}
.guideWrap .currentCardWrap .currentCard.currentBlue span{color:#3964ff}
.guideWrap .currentCardWrap .currentCard span{ display: inline-block; font-size: 20px; font-weight: 500; letter-spacing: -0.9px; text-align: center; color: #000000;
	margin-bottom: 21px; margin-bottom: 25px;}
.guideWrap .currentCardWrap .currentCard span font{ font-size: 36px; font-weight: bold; }
.guideWrap .currentCardWrap .prevHref{margin: auto;}
.guideWrap .strongPo{position: absolute; bottom: 0px; left: 0;}
.guideWrap .guideStartC{border-radius: 5px; box-shadow: 0.4px 3px 6px 0 #00000033; background-color: #3964ff; font-weight: bold; letter-spacing: -0.4px;
	text-align: center; color: #ffffff; margin: auto; display: block; width: 238px; height: 60px; line-height: 60px;font-size: 16px;
	position: absolute;bottom: -25px;left: 380px;left: 50%;transform: translateX(-50%);
}
.guideWrap .guideStartC:hover{background-color: #6183ff}
.guideWrap .projectAnnWrap{padding: 35px 28px; border-radius: 10px; margin: auto; text-align: center;
	border: solid 1px #7190ff; background-color: #ffffff; width: 840px; box-sizing: border-box;}
.guideWrap .projectAnnWrap .annLeftArea{width: 117px; height: 116px; background-image: url('/hive/template/LOUD_IMG/guide/img-loudtip.png'); background-size: cover; vertical-align: middle;margin-right: 22px;}
.guideWrap .projectAnnWrap .annRightArea{vertical-align: middle;}
.guideWrap .annSubTxt{font-size: 14px; letter-spacing: -0.35px; text-align: left; color: #666666;}
.guideWrap .annSubTxt span{display: inline-block; line-height: 1.57; margin-right: 22px;}
.guideWrap a.annGoProject{border-radius: 5px; border: solid 1px #7190ff; background-color: #ffffff; display: inline-block; text-align: center; font-size: 14px; padding: 15px 17px;
	font-weight: 900; letter-spacing: -0.35px; text-align: center; color: #3964ff; vertical-align: bottom;}
.guideWrap a.annGoProject:hover{background-color: #f1f4ff}
.guideWrap .projectAnnWrap .gSub2Blue{margin-bottom: 10px;text-align: left;}
.guideWrap .projectAnnWrap .gSub2Black{display: block;font-size: 19px; font-weight: bold; letter-spacing: -0.48px; margin-bottom: 5px; text-align: left}


.jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content{overflow: hidden !important;}

.contestList .noContestList{background-color: #fff; border-top: 1px solid #eef3fd;}
.contestList .noContestList .noContestDiv{height: 170px; position: relative;}
.contestList .noContestList .noContestDiv .noContest_msg{position: absolute; top: 20%; left: 15%; color: #737c80; text-align: center; font-size: 14px; font-weight: 500; letter-spacing: -0.58px; line-height: 22px;}
.contestList .noContestList .noContestDiv .noContestBtn{position: absolute; top: 48%; left: 16%;}
.contestList .noContestList .noContestDiv .noContestBtn .client_noContest{box-sizing: border-box; text-align: center; line-height: 35px; color: #505bf0; font-weight: 500; width: 143px; height: 38px; border-radius: 5px; border: solid 1px #505bf0; letter-spacing: -0.54px;}
.contestList .noContestList .noContestDiv .noContestBtn .client_noContest:hover{background-color: #f7f9ff;}


.cl_join_article{
  position: relative;
  left: 0;
  right: 0;
  margin:auto;
  width: 980px;
  padding: 100px 0;
  letter-spacing: -1px;
  color: #31323b;
}
.cl_join_title{
  font-size: 16px;
  text-align: center;
  padding-bottom: 50px;
}
.cl_join_title strong{
  display: block;
  padding-bottom: 15px;
  font-size: 26px;
}
.cl_join_type{
  text-align: center;
  font-size: 0;
  padding-bottom: 40px;
}
.cl_join_type_box{
  border: 2px solid #cbcbcb;
  padding: 28px 30px 34px 22px;
  border-radius: 10px;
  margin: 0 13px;
  cursor: pointer;
  width: 240px;
  text-align: right;
  box-sizing: border-box;
  border-radius: 10px;
  box-shadow: 4.8px 3.6px 4px 0 #00000019;
}
.cl_join_type_box img{
  margin-top: -10px;
  margin-right: -15px;
}
.join_type_chk{
  width: 24px;
  height: 24px;
  border: solid 2px #cccccc;
  background-color: #ffffff;
  display: inline-block;
  float: left;
}
.cl_join_type_box.action_type .join_type_chk{
  border-color: #505bf0;
  background-color: #505bf0;
  background-image: url(/hive/template/LOUD_IMG/cl/ic-select-s.png);
  background-repeat: no-repeat;
  background-position: center center;
}
.cl_join_type_box:hover{
  border: 2px solid #505bf0;
}
.cl_join_type_title{
  padding: 14px 0 0 0;
  font-size: 15px;
  line-height: 1.47;
  letter-spacing: -0.38px;
  color: #4d4e56;
}
.cl_join_type_title strong{
  font-size: 18px;
  display: block;
}
.bg_black{
  background-color: #31323b;
}
.bg_red{
  background-color: #ed5959;
}
.bg_green{
  background-color: #a2a2a2;
}
.type_action{
  background-color: #f7f7f7;
}
.bg_green:HOVER{
  background-color: #777;
}
.cl_join_type_btn{
  color: #fff;
  font-size: 14px;
  width: 180px;
  text-align: center;
  border-radius: 50px;
  padding: 10px 0;
}
.cl_join_form_title{
  font-size: 20px;
  text-align: center;
  font-weight: bold;
  padding-bottom: 30px;
}
.cl_join_form_title img{
  padding-right: 5px;
}
.newJoinWrap{
  text-align: center;
}
.joinBtnWrap{
  margin-bottom: 18px;
  margin-top: 15px;
}
.joinBtn{
  display: inline-block;
  padding: 23px;
  text-align: left;
  border-radius: 10px;
  box-shadow: 4.8px 3.6px 4px 0 #00000019;
  border: solid 1px #dddddd;
  background-color: #ffffff;
}
.subJoinBtn{
  cursor: pointer;
}
.subJoinBtn:hover .checkmark{
  border-color:#505bf0;
}

.agreeWrap{
  background-color: #ffffff;
  display: inline-block;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  line-height: 16px;
}
.agreeWrap input{
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.agreeWrap .checkmark{
  border: solid 2px #6f79ff;
  display: inline-block;
  height: 18px;
  width: 18px;
  border-radius: 4px;
  border: solid 2px #cccccc;
  background-color: #ffffff;
  box-sizing: border-box;
}

.agreeWrap .joinCheckBox2 .checkmark{position: relative;}
.agreeWrap .joinCheckBox2 .checkmark .checkImg{top: 2px; left: 1px;}

.agreeWrap .checkImg{
  display: none;
  left: 3px;
  top: 4px;
  width: 12px;
  height: 10px;
  background-image: url(/hive/template/LOUD_IMG/cl/join/ic-select-check.png);
  background-size: cover;
  background-repeat: no-repeat;
  position: absolute;
}

.agreeWrap input:checked ~ .checkmark{
  border: solid 2px #505bf0;
  background-color: #505bf0;
}

.agreeWrap input:checked ~ .checkImg{
  display: block;
}

.agreeWrap input:checked ~ .checkmark .checkImg{
  display: block;
}


.joinCheckBox{display: inline-block; vertical-align: top; margin-right: 14px;}
.joinCheckBox2{display: inline-block;vertical-align: middle;margin-right: 14px;}
.modalJoinBtn .joinAgreeText, .modalJoinBtn2 .joinAgreeText{
  font-size: 16px;
  font-weight: bold;
  line-height: 20px;
}
.joinAgreeText{
  display: inline-block;
  font-size: 13px;
  letter-spacing: -0.33px;
  color: #4d4e56;
  vertical-align: middle;

}

.joinAgreeText strong{
  color: #4d4e56;
}

.joinAgreeText p{
  font-size: 16px;
  font-weight: bold;
  letter-spacing: -0.4px;
  margin-bottom: 5px;
}

.cl_join_form_box .cl_join_left input[disabled], .cl_join_form_box .cl_join_left input[readonly]{background-color: #dddddd !important;opacity: 0.6;}

/* .joinRightArrow{
  width: 8px; height: 16px;
  display: inline-block;
  vertical-align: middle;
  float: right;
  cursor: pointer;
  margin-top: -7px;
} */
.joinRightArrow{
  width: 8px; height: 16px;
  background-image: url("/hive/template/LOUD_IMG/cl/join/ic-right-arrow.png");
  display: inline-block;
  vertical-align: middle;
  float: right;
  cursor: pointer;

  background-size: cover;
  background-repeat: no-repeat;
}
.joinRightArrow.arrow{
  margin-top: -37px;
  margin-right: 15px;
}
.joinRightArrow:hover{
  background-image: url("/hive/template/LOUD_IMG/cl/join/ic-right-arrow-hover.png");

}

.cl_join_form_box{
  text-align: center;
  display: inline-block;
  padding: 30px;
  border: solid 1px #dddddd;
  background-color: #ffffff;
  width: 509px;
  box-sizing: border-box;
  border-radius: 10px;
}
.cl_join_showType{display: none;text-align: left; padding: 18px 0 18px 20px; border-radius: 8px; background-color: #ebeff2;}
.cl_join_showType.cli, .cl_join_showType.dsg{display: block;}
.cl_join_showType img{margin-right: 13px;}
.cl_join_showType .showTypeBox{
  display: none;
}
.cl_join_showType .showTypeBox p{
  font-size: 13px;
  line-height: 1.46;
  letter-spacing: -0.33px;
  text-align: left;
  color: #4d4e56;
  margin: 0
}
.cl_join_showType .showTypeBox p:first-of-type{
  font-weight: bold
}
.cl_join_showType.cli .showTypeBoxCli, .cl_join_showType.dsg .showTypeBoxDsg{
  display: inline-block;
}

.cl_join_left{
  text-align: left;
  margin-top: 30px;
}
.cl_join_rows{
  padding-bottom: 14px;
}
.cl_join_row_title{
  font-size: 13px;
  font-weight: bold;
  padding-bottom: 7px;
}
.cl_join_input_box input[type=text], .cl_join_input_box input[type=password]{
  font-size: 14px;
  height: 20px;
  padding: 10px;
  padding-top: 10px;
  border-color: #cdcdcd;
  background-color: #fff !important;
}
input[disabled]:-webkit-autofill,
    input[disabled]:-webkit-autofill:hover,
    input[disabled]:-webkit-autofill:focus,
    input[disabled]:-webkit-autofill:active {
	 transition: background-color 5000s ease-in-out 0s;
	 -webkit-transition: background-color 9999s ease-out;
     -webkit-box-shadow: 0 0 0px 1000px #dddddd inset !important;
     -webkit-text-fill-color: #000000 !important;
   }
input:-webkit-autofill,
   input:-webkit-autofill:hover,
   input:-webkit-autofill:focus,
   input:-webkit-autofill:active {
	 transition: background-color 5000s ease-in-out 0s;
	 -webkit-transition: background-color 9999s ease-out;
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
    -webkit-text-fill-color: #000000 !important;
  }
input.cl_input_type2{
  width: 350px;
}
input.cl_input_type1{
  width: 350px;
}
input.cl_input_type3{
  width: 55px;
}
.newJoinPop .modalJoinBtn{
  display: block;
  box-sizing: border-box;
  margin-bottom: 10px;
  box-shadow: none;
  border: none;
  background-color: #ffffff;
  padding: 0;
}
.modalJoinBtn label{
  padding: 14px 15px;
  border-radius: 10px;
  border: solid 2px #dddddd;
  background-color: #ffffff;
  display: block;
}
.modalJoinBtn .joinAgreeText span, .modalJoinBtn2 .joinAgreeText span{
  font-size: 16px;
  font-weight: bold;
  line-height: 1.38;
  letter-spacing: -0.4px;
  text-align: left;
  color: #302f3a;
}

.joinBtn.modalJoinBtn2 .joinAgreeText{
  width: 80%;
  margin-right: 0;
}

.modalJoinBtn2{
  display: block;
  padding: 14px 15px;
  margin-bottom: 10px;
  box-shadow: none;
}
.modalJoinBtn2 label{width: 93%}
.modalJoinBtn2 .subJoinBtn{
  width: 100%;
}
.newJoinPop .topText{
  color: #302f3a;
  margin-bottom: 30px;
}
.newJoinPop .topText p{
  font-size: 20px;
  font-weight: bold;
  line-height: 1.1;
  letter-spacing: -0.5px;
  margin-bottom: 5px;
}
.newJoinPop .topText span{
  font-size: 13px;
  letter-spacing: -0.33px;
}
.termsBtn{
  width: 16px;
  height: 9px;
  background-image: url(/hive/template/LOUD_IMG/cl/join/ic-down.png);
  background-size: cover;
  cursor: pointer;
  display: inline-block;
}
.termsBtn1:hover,.termsBtn2:hover,.termsBtn2:hover{
  background-image: url(/hive/template/LOUD_IMG/cl/join/ic-down-hover.png);
}
.termsBtn1.selected,.termsBtn2.selected,.termsBtn3.selected{background-image: url(/hive/template/LOUD_IMG/cl/join/ic-up.png);}
.termsBtn1.selected:hover, .termsBtn2.selected:hover, .termsBtn3.selected:hover{background-image: url(/hive/template/LOUD_IMG/cl/join/ic-up-hover.png);}
.termsContent{
  display: none;
  margin-top: 10px;
  max-height: 130px;
  overflow-y: scroll;
  font-size: 12px;
  line-height: 1.67;
  letter-spacing: -0.3px;
  text-align: left;
  color: #888888;
}
.termsContent p{
	line-height: 1.67 !important;
}
.termsContent span{
    font-size: 12px !important;
    line-height: 1.67 !important;
    letter-spacing: -0.3px !important;
    text-align: left !important;
    color: #888888 !important;
}
.termsContent.termsContent3{
  overflow: hidden;
  text-align: center
}
.termsContent1.selected, .termsContent2.selected, .termsContent3.selected{
  display: block;
}
.modalJoinBtn2 .termsContent3 label{
  margin-right: 33px;
  display: inline-block;
  width: auto;
}
.modalJoinBtn2 .termsContent3 label .agreeWrap{
  margin-left: 10px;
}
.modalJoinBtn2 .termsContent3 .joinAgreeText{
  font-size: 13px;
  letter-spacing: -0.33px;
  text-align: left;
  color: #4d4e56;
  font-weight: 400;
  display: inline;
}
.termsContent3 .joinCheckBox2{margin-right: 9px;}
.closeBtn{
  background-image: url(/hive/template/LOUD_IMG/cl/join/ic-close.png);
    width: 31px;
    height: 31px;
    background-size: cover;
    position: absolute;
    right: 23px;
    top: 23px;
    cursor: pointer;
}
#agreeLayer{background: url(/images_rn/common/bg_dark.png) repeat; display: none; height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 99990;}
#agreeLayer.selected{display: block;}
.newJoinPop{
  width: 400px;
  display: none;
  position: fixed;
  left: 50%;
  top: 50%;
  z-index: 99999;
  transform: translate(-50%, -50%);
  background-color: #ffffff;
  padding: 54px;
  border-radius: 10px;
}
.newJoinPop.selected{
  display: block;
}
.cl_join_ck_btn{
  float: right;
  font-size: 13px;
  color: #fff;
  padding: 12px 0 11px 0;
  width: 86px;
  text-align: center;
  cursor: pointer;
}

.cl_hyphen {
  width: 16px;
  text-align: center;
}
.cl_join_row_warning{
  padding-top: 5px;
  font-size: 12px;
  color: #4c4c4c;
  height: 23px;
}
.pd12{
  padding-top: 12px;
  height: 54px;
}
.pd12 > div{
  display: none;
}
.cl_join_right{
  float: right;
}
.cl_join_agr_box{
  width: 284px;
  height: 142px;
  padding: 18px;
  border: 1px solid #cdcdcd;
  overflow-y: auto;
}
.cl_join_agr_content{
  font-size: 12px;
  color: #949494;
}
.cl_join_agr_ck{
  padding-top: 10px;
  padding-bottom: 34px;
}
.cl_join_agr_ck input,.cl_join_agr_sms input{
  width: 20px !important;
  height: 20px !important;
}
.cl_join_agr_title{
  padding-left: 5px;
  font-size: 12px;
    color: #4c4c4c;
    height: 25px;
}
.cl_join_agr_title .cl_red{
  font-size: 14px;
  font-weight: bold;
}
.cl_join_agr_sms > div{
  padding-right: 20px;
}
.cl_join_complete{
  margin: 40px 0;

}
.pd12 .bg_black:HOVER, .cl_join_complete > div.active:hover{
  background-color: #494b57;
}
.cl_join_complete > div{
  background-color: #cccccc;
  text-align: center;
  padding: 22px 164px;
  display: inline-block;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: -0.4px;
  color: #ffffff;
  cursor: pointer;
}
.cl_join_complete > div.active{
  background-color: #31323b;
}
.noval_redbox {
    background-color: #bfffae !important;
}
.cl_join_type_box.action_type{
  border-color:#505bf0;
}
.action_type .cl_join_type_btn {
  background-color: #ed5959;
}
.MsoNormal span{
  line-height: 14.4px !important;
}
.red{color:red;}

.cl_join_find{display: inline-block;padding: 15px 100px;border-top: 1px solid #dddddd;}
.cl_join_find img{margin-right: 2px;}
.cl_join_find span{font-size: 13px; text-align: left; color: #666666;margin-right: 8px;}
.cl_join_find a{font-size: 13px;font-weight: 500; letter-spacing: -0.33px; text-align: left; color: #555555;display: inline-block;border-bottom: 1px solid #555555;}
.cl_join_find a:hover{color:#505bf0; border-color:#505bf0;}

.information.fail{color:#f00; font-size:12px;}
.information.success{color:#39b139; font-size:12px;}

.necessary{color:#505bf0;}
.notNecessary{font-weight: normal}
.completeBtn{
  width: 100%;
  padding: 20px 0;
  background-color: #302f3a;
  color: #ffffff;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: -0.35px;
  text-align: center;
  margin-top: 30px;
  cursor: pointer;
}
.completeBtn:hover{
  opacity: .7;
}
#id_nick_div .cl_join_row_title span{font-size: 12px; font-weight: 400;color: #444444;}

.cl_join_event{position: absolute; font-size: 13px; letter-spacing: -0.7px; text-align: center; color: #ffffff;
  background-image: url('/hive/template/LOUD_IMG/signIn/img-bg.png'); background-repeat: no-repeat; background-size: cover; width: 320px; height: 59px;
  border-radius: 10px; box-sizing: border-box; bottom: -75px; left: 15px;
  -webkit-animation: mover 1s infinite  alternate;
  -moz-animation: mover 1s infinite  alternate;
  -ms-animation: mover 1s infinite  alternate;
  -o-animation: mover 1s infinite  alternate;
  animation: mover 1s infinite  alternate;
}
.cl_join_event	.cl_join_eventtxt{line-height: 61px}
.cl_join_event .cl_join_eventtxt img{vertical-align: middle;margin-right: 4px}
.cl_join_event .cl_join_eventtxt span{vertical-align: middle;}
.cl_join_event .cl_join_eventtxt span strong{color: #ffffff}
.snsMailSet{font-size: 14px; padding: 10px; border-color: #cdcdcd; background-color: #dddddd !important;opacity: 0.6;}
.snsMailSet img{width: 19px;margin-top: 4px; margin-right: 5px}
.snsMaileditBtn{cursor: pointer; display: inline-block; border-radius: 5px;background-color: #302f3b;font-size: 12px;line-height: 1.25; text-align: center; color: #ffffff; padding: 6px 15px;float: right;}
.snsMaileditBtn:hover{background-color: #000000}
#m_mail.emailInput{display: none;}
@-webkit-keyframes mover{
  0% { transform: translateY(0); }
  100% { transform: translateY(-10px); }
}
@-moz-keyframes mover{
  0% { transform: translateY(0); }
  100% { transform: translateY(-10px); }
}
@-ms-keyframes mover{
  0% { transform: translateY(0); }
  100% { transform: translateY(-10px); }
}
@-o-keyframes mover{
  0% { transform: translateY(0); }
  100% { transform: translateY(-10px); }
}
@keyframes mover{
  0% { transform: translateY(0); }
  100% { transform: translateY(-10px); }
}
.information{padding-left: 4px;}
.information.fail{color:#f00; font-size:12px;}
.information.success{color:#39b139; font-size:12px;}
.joinAgreeText .agreeMsg{display: inline;}
