/* meetup main slider */ .mt_mainSlide{ height: 500px; } .mt_mainSlide .swiper{ width: 100%; height: 500px; padding: 0; margin: 0!important; } .mt_mainSlide .swiper .swiper-wrapper{ height: 100%; display: flex; justify-content: space-between; } .mt_mainSlide .swiper .swiper-slide{ background-repeat: no-repeat; background-position: center; background-size: auto 100%; } .mt_mainSlide .swiper .mt1{ background-image: url("../../images/slide_img/main_slide_meetup_01.png"); } .mt_mainSlide .swiper .mt_cont_wrap{ width: 1100px; } .mt_mainSlide .swiper .mt1 .mt_cont_wrap{ margin: 0 auto; padding: 170px 0; } .mt_mainSlide .swiper .mt1 .mt_cont_wrap .mt_ms_txt{ width: 100%; } .mt_mainSlide .swiper .mt1 .mt_cont_wrap .mt_ms_txt p{ font-size: 2rem; line-height: 2rem; color: #333333; } .mt_mainSlide .swiper .mt1 .mt_cont_wrap .mt_ms_txt p:first-child{ color: #b71c24; margin-bottom: 40px; } .mt_mainSlide .swiper .mt1 .mt_cont_wrap .mt_ms_txt p:nth-child(2){ color: #333; margin-bottom: 10px; } .mt_mainSlide .swiper .mt1 .mt_cont_wrap .mt_ms_txt p:nth-child(3) span{ font-size: 2.25rem; line-height: 2.25rem; color: #b71c24; font-weight: 600; } .mt_mainSlide .swiper .mt2{ background-color: #D2F2FF; } .mt_mainSlide .swiper .mt2 .mt_cont_wrap{ height: 100%; margin: 0 auto; display: flex; justify-content: space-between; } .mt_mainSlide .swiper .mt2 .mt2_txt{ width: 50%; height: 100%; padding: 170px 0; } .mt_mainSlide .swiper .mt2 .mt2_txt p{ font-size: 2rem; line-height: 2rem; color: #333; } .mt_mainSlide .swiper .mt2 .mt2_txt p:first-child{ color: #005F7C; margin-bottom: 40px; } .mt_mainSlide .swiper .mt2 .mt2_txt p:nth-child(2){ margin-bottom: 10px; } .mt_mainSlide .swiper .mt2 .mt2_txt p:nth-child(2) span,.mt_mainSlide .swiper .mt2 .mt2_txt p:nth-child(3) span{ font-size: 2.25rem; line-height: 2.25rem; font-weight: 600; color: #005F7C; } .mt_mainSlide .swiper .mt2 .mt2_img{ position: absolute; top: 0; right: 0; width: 100%; height: 100%; background-image: url("../../images/slide_img/main_slide_mt_img.png"); background-size: auto 100%; background-repeat: no-repeat; background-position: 1000px center; } .mt_mainSlide .ms_pg_wrap{ position: relative; width: 1100px; margin: 0 auto; } .mt_mainSlide .ms_pg{ position: absolute; right: 0px; bottom: 30px!important; text-align: right; } .mt_mainSlide .ms_pg .swiper-pagination-bullet{ width: 70px; height: 5px; background-color: #ffffff; margin: 0!important; border-radius: 0; padding:0; } .mt_mainSlide .ms_pg .swiper-pagination-bullet-active{ width: 250px; background-color: #b71c24; border-radius: 5px; } @media screen and (max-width: 1024px) { .mt_mainSlide .swiper .swiper-slide .mt_cont_wrap{ width:100%; height: 100%; padding: 0 40px; display: flex; } .mt_mainSlide .swiper .swiper-slide .mt_cont_wrap .mt_ms_txt{ margin-top: auto; margin-bottom: auto; height: auto; } .mt_mainSlide .swiper{ height: 400px; } } @media screen and (max-width: 768px) { .mt_mainSlide .swiper .mt1 .mt_cont_wrap .mt_ms_txt p{ font-size: 1.6rem; line-height: 1.65rem; } .mt_mainSlide .swiper .mt1 .mt_cont_wrap .mt_ms_txt p:nth-child(3) span{ font-size: 1.65rem; line-height: 1.65rem; } } @media screen and (max-width: 450px) { .mt_mainSlide .swiper .mt1 .mt_cont_wrap .mt_ms_txt p:first-child{ font-size: 1.3rem; } .mt_mainSlide .swiper .mt1 .mt_cont_wrap .mt_ms_txt p{ font-size: 1.3rem; line-height: 1.35rem; } .mt_mainSlide .swiper .mt1 .mt_cont_wrap .mt_ms_txt p:nth-child(3) span{ font-size: 1.35rem; line-height: 1.35rem; } } /* 캠페인 보기 CSS */ .sub_contents{ background: #fff; } .sub_contents.detail_wrap{background: #fff;} .sub_contents.crowd_contents #slider_wrapper{margin-top:0;} .sub_contents h2.sub_title{text-align: center; padding:80px 0px; font-weight: 600; font-size: 2.2em;} .sub_contents h2.sub_title span{color: #b72932;} .sub_contents .progress-inner .perc li:last-child{color: #333;} .sub_contents p.third{color: #cc1618; padding: 0px 15px; margin-bottom: 5px; font-size: 1.2em; text-align: right;} .js-load.exhib_more{display:inline-block!important; dthwi:calc((100% - 40px)/2); margin-right:20px; } .js-load.exhib_more:last-child{margin-right:0!important;} .js-load.exhib_more > a{display: inline-block; width:100%;} .js-load.exhib_more > a .img_box1 img{width:100%; border-radius: 10px 10px 0 0;} .js-load.exhib_more > a .progressinner{border-radius: 10px} .bg_diff{padding: 30px 0px; text-align: center; margin-bottom: 20px;} .bg_diff span{display: inline-block; margin: 10px 0px; width: calc(100% / 10) ; height: auto;} .bg_diff span a{ /*padding: 5px 10px;*/ font-size:1em; display: inline-block; color: #6b6b6b; border: 0;} .bg_diff span a img{display: block; margin: 0 auto; margin-bottom: 10px; border: 1px solid #eee; border-radius: 5px; width: 100px;} .bg_diff span a:hover{color: #060606;} .bg_diff span a:hover img{opacity:1;} .bg_diff .cate-carousel{padding: 0px 20px; overflow: hidden;} .bg_diff .cate-carousel .flickity-prev-next-button.previous{background-image: url(/images/g_prev01.gif); left:0} .bg_diff .cate-carousel .flickity-prev-next-button.next{background-image: url(/images/g_next02.gif); right:0;} .bg_diff .cate-carousel .flickity-prev-next-button{background-repeat: no-repeat; width: 15px; height: 22px; border-radius: 0; background-size: 15px; top: 60px;} .sub_contents .more_button{padding: 30px 0px 150px 0px;} .sub_contents .more_button .more_btn{} .sub_contents .more_button .more_btn a{padding: 10px 70px; border: 1px solid #ddd; background: #fff;} .sub_contents .more_button .more_btn a:hover{border: 1px solid #cc1618; background: #cc1618; color: #fff;} .progress-inner ul {margin-bottom: 10px;} .progress-inner .progerss_bottom{position: relative;} .progress-inner .progerss_bottom .perc li.ending_wrap{position: absolute; bottom:0; left: 0; width: 100%; height: 100%; background: #fff8f8; margin-bottom: 8px; border-top: 1px dotted #ddd; border-bottom: 1px dotted #ddd; text-align: center;} .progress-inner .progerss_bottom .perc li.ending_wrap p{font-weight: 400;} .progress-inner .progerss_bottom .perc li.ending_wrap p.ending_01{margin-bottom: 8px; margin-top:7px;} .progress-inner .progerss_bottom .perc li.ending_wrap p.ending_02{line-height: 1.8em; padding: 5px 10px; font-size: 0.9em;} .progress-inner .progerss_bottom .perc li.ending_wrap p.ending_02 span{font-size: 1em; color: #db6256; font-weight: 600;} .sub_section .section_inner .project_section:nth-child( 3n ){margin-right: 0px;} .select_wrap{display: block; margin-bottom: 20px;} .select_div {float: right; position: relative; /* border: 1px solid #ccc; */ z-index: 1; background: #fff;} /*.select_div:before {content: ""; position: absolute; top: 50%; right: 15px; width: 0; height: 0; margin-top: -1px; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #333; }*/ .open_sel:before {content: "\f13a"; display: inline-block; font-family: FontAwesome; position: absolute; right: 17%; top: 50%; transform: translateY(-50%); color: #3d3d3d;} .select_div label { position: absolute; top: 0px; left: 5px; padding: .8em .5em; color: #333; z-index: -1; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; width: 90%;} .select_div select { width: 100%; height: auto; line-height: normal; font-family: inherit; padding: .8em .5em; border: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .open_sel select { width: 85%; height: auto; line-height: normal; font-family: inherit; padding: 1em 0.7em; border: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; } /* new css */ /*.subFormBg { background: #fcfcfc;}*/ .titBg { background: #fff; padding: 50px 0; color: #0d0d0d;} .titBg h1 { margin: 0 18.75%;} .titTxt { margin: 0 18.75%; padding-top: 20px; font-size: 0.875rem; line-height: 1.5;} .partnersContactTop h1 { margin: 0 !important;} @media screen and ( min-width : 768px) and (max-width: 1024px){ .titBg h1 { margin: 0 4.882%; } .titTxt { margin: 0 4.882%; } } @media screen and (max-width: 767px){ .titBg h1 { margin: 0 2.604%; } .titBg { padding: 20px 0; } .titTxt { margin: 0 2.604%; font-size: 0.812rem;} } @media screen and (max-width: 1100px){ .sub_contents .section_inner .wrap_1100{padding: 0px 10px;} .sub_section .section_inner .project_section:nth-child( 4n ){margin-right: 10px;} .sub_section .section_inner .project_section:nth-child( 3n ){margin-right: 0px;} } @media screen and (max-width: 768px){ .sub_contents .section_inner .wrap_1100{padding: 0px 5px;} .sub_section .section_inner .project_section:nth-child( 4n ){margin-right: 0px;} .sub_section .section_inner .project_section:nth-child( 3n ){margin-right: 0px;} .sub_section .section_inner .project_section:nth-child( 2n ){margin-right: 0px;} /* .sub_contents .sub_top{padding: 120px 0px 20px 0px;} */ .sub_contents h2.sub_title{margin: 0; padding: 80px 0px;} } @media screen and (max-width: 749px){ .sub_contents .sub_top{padding:0;} .sub_contents.crowd_contents .sub_top{padding-top:0;} } @media screen and (max-width: 540px){ .progress-inner .progerss_bottom .perc li.ending_wrap{height: inherit; bottom: 0px; margin-bottom: 0; border-bottom:0;} } span.color_txt{ color: #333; font-size: 14px; font-weight: 400} /* ----- 캠페인 랜딩페이지 ------ */ .detailTop{text-align:center; margin:70px 0 50px 0;} .detailTop h5{color: #ca4e4e; margin-bottom:15px; font-size:1.3em;} .detailTop h5 span{color:#333;} .detailTop h1{font-size: 1.875rem; font-weight:600; color: #212121; letter-spacing: 1px;} /*.detailTop h1{font-size:2.2em; font-weight:500;}*/ .camp_hash{display:inline-flex; padding: 5px 15px; background:#fafafa; border-radius:50px; margin-right:5px; border:1px solid #efefef; font-size: 0.75rem; color: #757575; } .camp_hash:last-child { margin-right: 0; } #scroll_menu{position:fixed; top:0; left:0; z-index:9999; display:none;} .dpb{display:block!important;} #scroll_open{ position: fixed; top: 0; left: 0; z-index: 9999; display: none; } #shareModal2{ top:86.8%; position: fixed; left: 47.78%; /*height: 500px;*/ transform: translateX(-50%); z-index: 99999; display: none; } .open_alarm .open_alarm_wrap{display: flex; align-items: center; justify-content: center; position: fixed; bottom: 0; left: 0; width: 100%; height: 64px; background-color: #fff; border-top: 1px solid #efefef;} .open_alarm .open_alarm_wrap > li > button{width: 50px; height: 50px; border-radius: 4px; margin-right: 10px; padding: 0; border :0; } .open_alarm .open_alarm_wrap > .open_alarm_fav button img{width: 100%; height: 100%;} .open_alarm .open_alarm_wrap .open_btn{background-color: #c72030; border-radius: 4px; } .open_alarm .open_alarm_wrap .open_btn > a{color: #fff; display: flex; align-items: center; justify-content: center; width: 360px; height: 50px; font-size: 1rem;} .open_alarm .open_alarm_wrap .open_btn > a.end_serv{background-color: #aaa;} .hdmenu{padding-bottom: 20px} .hdmenu h1{font-size:1rem; float:left; font-weight: 500; line-height: 40px; width: calc(100% - 180px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .hdmenu button{ background:#c72030; font-size:1rem; color:#fff; font-weight:400; border-radius: 3px; float:right; width: 160px; height: 40px; display: inline-block; text-align: center; } .detailMain{margin-bottom:50px;} .detailLeft{width: calc(60% - 30px);} .detailLeft .mainImg{width:100%; height:0; padding-bottom:56%; overflow:hidden; background-position:center; background-size:cover; background-repeat:no-repeat;} .detailLeft .mainTxt{ margin-top: 20px; margin-bottom: 20px; font-size: 1rem; line-height: 1.8; letter-spacing: -0.3px; color: #555; } .detailRight{width:40%; margin-left:30px;} .division{font-size:1.5em; font-weight:500; margin-bottom:20px; display:block;} /*.detailRight h1{font-size:1.8em; margin-bottom:18px;}*/ .detailRight h1{font-size:2rem; margin-bottom:30px; font-weight: 400; letter-spacing: 0.5px;} .detailRight h1 small{font-weight:400; font-size:0.937rem; color:#212121; margin-left: 3px; } .detailRight h1:first-of-type{font-size:2em; font-weight:500;} .detail_per{display:inline-block; margin-left: 5px; font-size: 0.8em} .detail_tit{margin:10px 0 8px; font-weight: 400; color: #212121 } .schedule{margin-bottom:15px;} .Sstep{margin-bottom:12px;} .Sstep:before{content:""; display:block; width:calc(100% / 1.5); margin:auto; height:2px; background-color:#6c6c6c; margin-bottom:-10px;} .stepDiv{width:calc(100% / 3); height:18px; float: left;} .step{margin:auto; width:18px; height:18px; position:relative; background-color:#fff; border:3px solid #ca4e4e; border-radius:10px;} .stepIn{width:8px; height:8px; position:absolute; top:50%; left:50%; transform:translate(-50% , -50%); background-color:#ca4e4e; border-radius:10px;} .stepG{margin:auto; width:8px; height:8px; border-radius:10px; background-color:#6c6c6c; margin-top:5px;} .schedule p{float:left; width:calc(100% / 3); text-align:center; font-weight:500;} .dFB { display: flex; } .mob_bar{display:none; width:100%; height:10px; background:#ededed; margin-top:30px} .reward_type_m{display:none;} .reward_type{background-color:#f4f4f4f4; padding:15px; margin:20px 0 30px 0; border-radius: 3px; font-size: 0.875rem;} /*.reward_type>div{float:left;}*/ .reward_type .rt_i{/*width:55px; height:55px; background-color:#fff; text-align:center; border-radius:50px; padding-top:10px; color:#ca4e4e; */color:#ed4b56; font-weight:600; } .reward_type .rt_txt{ color: #333; font-size:0.95em; /*width:calc(100% - 70px); margin-left:15px; color:#90949c; margin-top:10px;*/ } .cp_share_m{display:none;} .cp_share{width:100%; margin-top:40px;} .cp_share .share_cs{float:left; width: 100%; border:1px solid #efefef; border-radius:7px; padding:10px 0; text-align:center; font-size:1.2em; transition: all 0.3s} .cp_share div{float:left; /*width: calc((100% - 20px)/3);*/ border:1px solid #efefef; border-radius:4px; text-align:center; font-size:1.2em; /* transition: all 0.3s*/} .cp_share .zzim { height: 50px; width: 50px; border: 0;} .cp_share .zzim i{width:100%; height: 100%; background-size: auto 100%;} .share_tab { height: 50px; width: 50px; position: relative;} .share_tab i { font-size: 20px; } .ask_btn { width: calc(100% - 120px); border: none !important; color: #fff; transition: all .3s} .ask_btn button { width: 100%; height: 100%; border: none; background-color: #c72030 ; border-radius: 4px; } .ask_btn button.end_serv {background-color: #aaaaaa;} .ask_btn a { width: 100%; height: 100%; border: none; background-color: #c72030 ; border-radius: 4px; color: #fff} .ask_btn a.end_serv{background-color: #aaa} .ask_btn2 { width: calc(100% - 120px); border: none !important; color: #fff; transition: all .3s} .ask_btn2 button { width: 100%; height: 100%; border: none; background-color: #c72030 ; border-radius: 4px; } .ask_btn2 button.end_serv {background-color: #aaaaaa;} .ask_btn2 a { width: 100%; height: 100%; border: none; background-color: #c72030 ; border-radius: 4px; color: #fff} .ask_btn2 a.end_serv{background-color: #aaa} /* scroll */ #scroll_open li a.end_serv{background-color: #aaa;} .shareModal { display: none; position: absolute; top: -150px; left: -60px; background-color: #fff; border-radius: 4px; padding: 20px 20px 30px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05), 0 1px 0 rgba(0, 0, 0, 0.1); } .shareModal > div { float: none !important; } .shareTit { text-align: left; margin-bottom: 15px; display: block !important; font-weight: 500; } .shareSns { gap: 16px; margin-bottom: 10px;} .shareSns li { margin: 0 !important; } /*.shareSns li { border: none !important; font-size: 11px; color: #6d6d6d; text-align: center; width: calc((100% - 80px)/5) !important; height: 100% !important; margin-right: 20px !important; padding:0 5px; }*/ /*.shareSns li:last-child { margin-right: 0}*/ .shareSns li:hover .facebook { background: none !important;} .shareSns li a { display: flex; flex-direction: column; align-items: center; cursor: pointer; font-size: 0.8rem !important;} .shareSns .iconS span { width: 45px; height: 45px; border-radius: 50%; display: flex; justify-content: center; align-items: center} .shareSns .facebook { background-color: #eee; : 70%; background-position: 47%; background-repeat: no-repeat; background-size: 50%;} .shareClose { position: absolute; top: 15px; right: 20px; height: 20px; width: 20px; border: none; } .shareClose:before { content: ''; display: inline-block; width: 2px; height: 16px; transform: rotate(-45deg) translateY(-50%); background: #1c1c1c; position: absolute; top:40%; left:13px;} .shareClose:after { content: ''; display: inline-block; width: 2px; height: 16px; transform: rotate(45deg) translateY(-50%); background: #1c1c1c; position: absolute; top:40%; left:2px;} .shareModal .arrow { display: block; width: 8px; height: 8px; background: #fff; position: absolute; bottom: -4px; left: 80px; transform: rotate(45deg); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05), 0 1px 0 rgba(0, 0, 0, 0.1); } .alarmButton {height:73px; margin-top:10px; background: #bb1328;} .alarm_btn {border:none !important; background: none !important; margin:0; height:50px; width:100%; color:#fff; } .alarm_btn:hover {color:#bb1328; font-weight:700;} .share_cs .cf {width:100%;} /* width:50% */ /*.cp_share div:hover{background-color:rgba(221,221,221,0.3);}*/ .cp_share ul li:hover{background-color:rgba(221,221,221,0.3);} .cp_share div a{ width:100%; height:100%; font-size: 1em} .cp_share .zzim{ margin-right:10px;} .cp_share i {display:inline-block; width:20px; height:20px; vertical-align:middle; background-position:center; background-repeat:no-repeat; background-size:90%; color:#ddd; } .cp_share .ask_btn { margin-left : 10px; height: 50px;} .cp_share .ask_btn2 { margin-left : 10px; height: 50px;} .cp_share .share_tab {} .point_01 {color:#ca4e4e;} .cp_share div p{display:inline-block; line-height:20px;} .tab_open{display:none;} .cp_share h3{text-align:center; font-size:1.4em; margin-bottom:15px;} .cp_share h3 span{display:inline-block; background-color:#bb1328; color:#fff; font-size:0.6em; line-height:19px; width:18px; height:18px; border-radius:20px; margin-right:7px; vertical-align:middle;} .cp_share .tab_open{width:100%; height:auto; border:1px solid #ddd; padding:7px 10px; margin-top:10px; text-align:center;} .cp_share ul li{display:inline-block; height:45px; width:45px; margin-right:10px; border:1px solid #ddd; border-radius:40px; background-position:center; background-repeat:no-repeat; background-size:40%; margin-top: 4px;} .cp_share ul li:last-child{margin-right:0;} .cp_share ul li a{display:block; width:100%; height:100%; cursor:pointer;} .pay_but{margin-top:40px; width:100%;} .pay_but a{padding: 10px 0; background:#c72030; font-size:1.2em; color:#fff; font-weight: 500; border-radius: 3px; width: 100%; display: inline-block; text-align: center } .pay_info_build_wrap .build_form{border-bottom: 1px solid #ccc;} .backer_check{margin-top: 20px; padding: 10px 0;} .reward_custom_info .backer_check > input{margin: 2px 5px 0 0;} /* 랜딩페이지_크리에이터정보 */ .company_info a{display:block; width:100%; /*height:100%;*/} .company_info a i{float:left; width:60px; height:60px; margin-left:10px; margin-top:5px; background-position:center; background-repeat:no-repeat; background-size:90%;} .brand_inner{position:relative; width:100%; margin: 20px 0; border: 1px solid #e2e8f0; padding: 15px; border-radius: 8px; background-color: #f8fafc; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03); } .brand_inner > a{display:block; width:100%; padding: 10px; background-color: #ffffff; border: 1px solid #e2e8f0; border-radius: 6px; box-sizing: border-box; transition: all 0.2s ease-in-out;} .brand_inner > a:hover{background-color: #f1f5f9; border-color: #cbd5e1; box-shadow: 0 2px 4px rgba(0,0,0,0.02);} .brand_inner > a > i{float:left; width:40px; height:40px; border-radius: 50%; background-position:center center; background-repeat:no-repeat; background-size:90%; /*background: #eee;*/border: 1px solid #e4e4e4} .brand_inner a div{float:left; vertical-align:top; width:calc(100% - 84px); font-size:1em;} .brand_inner a div h5{color:#737373; margin-left:15px; line-height:40px; font-size:1em;} /*.brand_inner:after{content:""; width:7px; height:7px; position:absolute; right:15px; bottom:29px; border: solid black; border-width: 0 2px 2px 0; display: inline-block; padding: 3px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg);}*/ .biBtn {} .biBtn li { width: calc((100% - 10px)/2); height: 36px} .biBtn li button { background-color: #f0f0f0; width: 100%; border-radius: 4px; border: none; height: 100%; } .biBtn li > a { width: 100%; border: 1px solid #f0f0f0; border-radius: 4px; margin-left: 10px; height: 100%; transition: all .3s } .biBtn li button i { font-size: 11px;} .biBtn a i { margin-right: 5px; font-size: 11px; margin-top: 2px; } .biBtn a:hover { border-color: #9e9e9e; color: #3d3d3d; } .followingB { border: 1px solid #f0f0f0 !important; border-radius: 4px; height: 100%; transition: all .3s; background-color: #fff !important; } .followingB:hover {border-color: #9e9e9e !important; color: #3d3d3d; } /* comingsoonDetail _ 상세 */ #mv { height: 200px; width: 100%; background-color: #eee} #contents_wrap { width: 1100px; margin: 0 auto; height: 100%; } #contents_wrap .notice {background: #f9f9f9; border: 1px solid #ddd; margin: 50px 0px;} #contents_wrap .notice > ul{padding: 10px 20px;} #contents_wrap .notice > ul.detail_notice01 >li{padding: 10px 0px ;border-bottom: 1px dotted #ddd;} #contents_wrap .notice > ul.detail_notice01 >li:last-child{border-bottom: 0;} #contents_wrap .notice > ul.detail_notice01 >li ul li{font-size: 1em; margin-bottom: 5px;} #contents_wrap .notice > ul.detail_notice01 >li ul li span{float: left; width: 30px} #contents_wrap .notice > ul.detail_notice01 >li ul li p{float: right; width: calc(100% - 30px)} #contents_wrap .notice > ul > li > p.title{font-size: 1.2em; border-left: 3px solid #cb4e4c; padding-left: 10px; font-weight: 600;} #contents_wrap .notice > ul.detail_notice01{background: #fffcfc; border-bottom: 1px dotted #ccc;} #contents_wrap .notice > ul.detail_notice02 > li{margin-bottom: 10px;} #contents_wrap .notice > ul.detail_notice02 > li:last-child{margin-bottom: 0px;} #contents_wrap .notice > ul.detail_notice02 > li > p{} #contents_wrap .story p {font-size: 1rem; padding-top: 15px} #contents_wrap .name {height: 40px; margin-top: 50px; position: relative; } #contents_wrap .name > ul > li {float: left; } #contents_wrap .name ul li:nth-child(1) { width: 40px; height: 40px; background: #eee; border-radius: 50px; font-size: 0} #contents_wrap .name ul li:nth-child(2) { font-size: 1rem; padding: 10px 10px 0; } #contents_wrap .name ul li:nth-child(3) { padding-top: 12px} #contents_wrap .desc p { font-size: 1rem; padding-top: 15px} #contents_wrap .date p { color: #cb4e4d; font-weight: bold; font-size: 1rem; padding-top: 10px} #contents_wrap .notification {width: 100%; cursor: pointer; height: auto;} #contents_wrap input:after { content:''; display: block; clear: both; } #contents_wrap .notification .btn_alarm{width: 100%; height: 70px; font-size: 1rem; letter-spacing: 1px; } #contents_wrap .notification .btn.reward_end{border: 1px solid #eee; margin:0; color:#6d6d6d} #contents_wrap .notification .rewarding{background: #cb4e4d; border: 1px solid #cb4e4d; color: #fff; width: 100%; float: left; margin-top: 50px ; transition: all 0.45s; border-radius: 7px; height: 60px;} #contents_wrap .notification .rewarding:hover {background: rgba(263,78,77,0.9); border: 1px solid rgba(263,78,77,0.9);} #contents_wrap .share_comingsoon { width: 100%; height: 50px; margin: 10px 0 20px !important; } #contents_wrap .share_comingsoon ul li{display:inline-block; height:45px; width:45px; margin-right:10px; border:1px solid #ddd; border-radius:40px; background-position:center; background-repeat:no-repeat; background-size:40%; margin-top: 4px; } #contents_wrap .share_comingsoon ul li:last-child{margin-right:0;background-size:40%; border:1px solid #ddd !important} #contents_wrap .share_comingsoon ul li a{display:block; width:100%; height:100%; cursor:pointer;} /* #contents_wrap .share_comingsoon ul li {display:inline-block; height:45px; width:45px; margin-right:10px; border:1px solid #ddd; border-radius:40px; background-position:center; background-repeat:no-repeat; background-size:40%; margin-top: 4px;} #contents_wrap .share_comingsoon ul li:nth-last-child {margin-right:0;} #contents_wrap .share_comingsoon ul li {display:block; width:100%; height:100%; cursor:pointer;} */ .rewardList { position: relative; } .rewardCW { border: 1px solid #ddd; padding: 10px; cursor: pointer; border-radius: 3px } .rewardCW i { float: right} .rewardCL { border: 1px solid #ddd; position: absolute; top: 40px; left: 0; background-color: #fff; width: 100%; overflow-y: auto; max-height: 300px; border-top: none; display: none; border-radius: 0 0 3px 3px; z-index: 99 } .rewardCL li { border-bottom: 1px solid #f6f6f6; padding: 20px 10px; cursor: pointer; transition: all .3s } .rewardCL li:hover{ background: rgba(183,41,50,0.03)} .rewardCL li:last-child { border-bottom: none; } .rewardCL li h5 { font-size: 1rem; } .rewardCL li p { font-size: 14px; margin: 10px 0; } .rewardCL li em { font-style: normal; display: block; color: #929292; font-size: 12px; font-weight: 400; margin-bottom: 10px } .rewardCL li span { color: #9b9b9b; } .rewardCL li span i { font-style: normal; color: #4a4a4a} .chooseReward { margin: 15px 0; } .chooseReward ul { border-top: 1px solid #e3e3e3; border-bottom: 1px solid #e3e3e3} .chooseReward ul li { font-size: 13px; color: #333; padding: 10px 0; border-bottom: 1px solid #f6f6f6; } .chooseReward li:last-child { border-bottom: none; } .chooseReward ul li div{ width: calc(100% - 40px)} .rewardDelete { width: 20px; height: 20px; position: relative; border:none; } .rewardDelete:before { content: ''; display: inline-block; width: 1px; height: 16px; transform: translateY(-50%) rotate(-45deg); background-color: #000; position: absolute; top: 50%; left: 8px; } .rewardDelete:after { content: ''; display: inline-block; width: 1px; height: 16px; transform: translateY(-50%) rotate(45deg); background-color: #000; position: absolute; top: 50%; left: 8px; } @media all and (min-width:768px) and (max-width: 1024px){ #contents_wrap { width: 100%; margin: 0 auto; } #contents_wrap .wrap_inner { padding: 0 20px; } #contents_wrap .notification {height: 60px;} } @media screen and (max-width: 800px) { .rewardCW { display: none;} .chooseReward { display: none; } .fundingW { display: none; } } @media all and (min-width: 480px) and (max-width: 767px) { #cotents_wrap { z-index: 9999;} .empty {height: 100px;} } /* 랜딩페이지_메뉴 */ .tabListCP{/*border-bottom:1px solid #ccc;*/ margin-bottom:50px; width:100%; background-color:#fff; line-height:40px; padding-top:10px; box-shadow:0 2px 3px rgba(0,0,0,0.1); z-index:100} /* .tabListCP ul{width:550px; margin:auto;} */ .tabListCP ul { width:1100px; margin: 0 auto; } .tabListCP li{float:left; width:calc(100% / 4); font-size:1.3em; font-weight:600; text-align:center; cursor:pointer; letter-spacing:1px; color:#5b5b5b;} .tabListCP .on{color:#c72030;} .tabListCP .on:after{content:""; display:block; width:auto; height:3px; background-color:#c72030;} /* margin-top:15px; */ .tabLsitPF { position: fixed; left: 0; top:0; z-index: 99;} .menuFixed{position:fixed; top:0;} /* 랜딩페이지_내용 */ /* .Dcontent{width:750px; margin:auto; margin-bottom:50px;} */ #tab-2,#tab-3,#tab-4{display:none;} .detailInfo .tL { text-align: left; margin-bottom: 30px;} /* .detailInfo { text-align: center;} */ .detailInfo p span { margin: 0 auto; } .detailInfo p > img { display: inherit;} /* 랜딩페이지_펀딩하기버튼 */ .optWrap{position:fixed; bottom:0; width:100%; z-index: 9999; } .optOn{position:fixed; bottom:0; width:100%; z-index:50; } .optOn>span{display:block; border-bottom:2px solid #c72030; width:100%;} .optOff>span{display:block; border-bottom:2px solid #313332; width:100%;} .optOff{display:none; position:relative; z-index:60;} .optBtn{width:200px; position:relative; right:-70vw; background-color:#c72030; color:#fff; border-radius:5px 5px 0 0; box-shadow: 3px -5px 10px rgba(0,0,0,.1); text-align:center; line-height:40px; font-size:1.3em; letter-spacing:2px; cursor:pointer; display: none; } .optBtn i{margin-left:10px;} .storyBtn{display:block; background-color:#313332;} .optListWrap{width:100%; background-color:#fff; height:50vh; overflow-y:scroll; } .optList{width:800px; margin:auto; padding:30px 0;} .optList h3{margin-bottom:20px; font-weight: 700; color: #292929} .optE{padding:20px; margin-bottom:20px; cursor:pointer; background: #f9f9f9; border-radius: 3px;} .optE.on{ background-color: #fff; box-shadow: rgb(0 0 0 / 5%) 0px 2px 8px, rgb(0 0 0 / 10%) 0px 0px 0px; position: relative; } .optE.on:before { content: ''; display: inline-block; width: 50px; height: 100%; position: absolute; right: 0; top:0; background:#fff7f7 } .optE .pay { font-size: 1.125rem; font-weight: 600; margin-bottom: 20px; } .optE .tit {font-size: 0.875rem; font-weight: 400; color: #00132C; margin-bottom: 10px} .optE .tit em { font-size: 12px; padding-left: 5px; font-style: normal; color: #F86453;} .optE .explan { margin-bottom: 5px; font-size: 12px; line-height: 1rem; color: #686868} .optE .payD { font-size: 12px; } .optE.soldOut{background-color:#dddddd;} .optE h3{float:left; font-weight:600; width:70%; margin-bottom:10px; font-size:1.4em;} .optE h4{float:right; font-weight:600; width:30%; text-align:right; margin-bottom:10px;} .optE p{float:left; width:70%;} .optE span{float:right; width:30%; text-align:right;} .optE span i{color:#ca4e4e; font-weight:600; font-style:normal;} .fdBtn{display:block; text-align:center; line-height:50px; background-color:#ec4c4c; color:#fff; border-radius:3px; font-size:1.2em; letter-spacing:2px; font-weight:500; cursor:pointer; width: 200px; margin: auto} .nonWrite { display: inline-block; padding: 10px 60px; border-radius: 3px; background: #3d3d3d; color: #fff; font-weight: 500; margin-bottom: 40px} /* 랜딩페이지_메이커스 */ .makersType{padding:10px 20px; background-color:#fff1f1; margin-bottom:30px; border-radius:7px;} .makersType p span{font-weight:600; margin-right:10px;} /* 랜딩페이지_밋업 */ .meetupType{background-color:#f0f0f0; padding:10px; border-left:3px solid #ca4e4e; margin-top:10px;} .meetupType h4{color:#ca4e4e; font-size:1.3em; margin-bottom:10px;} .MtabList ul{width:350px;} .MtabList li{width:calc(100% / 2);} /* 랜딩페이지 새소식 */ #dataList { position: relative;} /* .write_btn { background: rgba(250, 99, 97,0.8); overflow: hidden; padding:10px 20px !important; margin-bottom: 30px; display:inline-block; cursor:pointer; color:#fff; transition: all 0.3s; border-radius: 2px; margin-top: 20px; } */ .write_btn:hover{border-radius: 7px; background-color: #fa6462;} @media screen and (max-width: 1100px){ .reward_type_m{display:block; margin:0 10px;} .reward_type_w{display:none;} .reward_type .rt_i{margin-top:0;} .reward_type .rt_txt{margin-top:0;} .cp_share_m{display:block; padding: 0 4.545%; /*padding:0 10px;*/} .cp_share_w{display:none;} .dFB { display: block; } .detailLeft,.detailRight{float:none; width:100%;} .detailLeft{margin-bottom:80px;} .detailRight{margin-left:0; padding: 0 4.545% /*padding:0 10px;*/} .tabListCP ul { margin: 0} .m0 { margin : 0 !important; } .detailLeft .mainTxt { margin-top: 20px; padding: 0 4.545%;} .detailLeft { margin-bottom: 80px; } .dfT { display: flex; align-items: center;} .dfT span { display: block; } .dfT > .rt_i { padding-right: 20px; background: #fff; border-radius: 50%; height: 65px; width: 65px; padding: 15px 5px; margin-right: 20px; text-align: center;} .dfT .rt_txt p:first-child { padding-bottom: 5px} } @media screen and (max-width: 800px){ /*.optOn { display: block}*/ .optOn{display: none; } .optWrap{ z-index: 999; /*z-index:200;*/} .detailTop{margin:50px 10px 50px 10px;} .detailLeft,.detailRight{float:none; width:100%;} .detailLeft{margin-bottom:40px;} .cke_video{margin-bottom:130px;} .detailRight{margin-left:0; padding:0 10px;} .Dcontent{padding:0 10px; /*width:100%;*/} .optBtn{width:100%; right:0;} .optList{width:100%; padding:30px 5px;} .optListWrap{height:calc(100vh - 150px);} .showBtn { padding-bottom: 10px; } .optOff{background-color:#fff;} /* .dHpZot { bottom: 80px !important; } */ .optOff { z-index: 999;} } @media screen and (max-width: 550px){ .tabListCP ul{width:100%; font-size:.9em;} } /* tab CSS */ .set, .panel { margin: 0 0 10px; } /* Tabs -------------------------------------------------- */ .tabs .panel {padding: 10px 0px;} .tabs-menu { border-bottom: 1px solid #ccc; padding: 0; height: 70px; } .tabs-menu li { float:left; *display: inline-block; *display: inline; zoom: 1; margin: 0 ; padding: 0; background-color: #fff; cursor: pointer; position: relative; height: 70px; border-bottom: 1px solid #ccc; padding: 25px 0px; width: calc(100% / 5); } .tabs-menu li span{ display: block; text-align: center; font-size: 1em; border-right: 1px solid #ccc; padding: 0px 15px; } .tabs-menu li:last-child span{ border-right: 0px; } .tabs-menu .active-tab { border-bottom: 1px solid #ca4e4e } .tabs-menu .active-tab span{color: #ca4e4e; font-weight: 600} .sub_contents.detail_wrap .sub_section.campany_info{margin-top: 0px;} .sub_contents.detail_wrap .sub_section.campany_nav_bg{width:100%; height: 70px; background: #eee; margin: 0; border-bottom: 1px solid #ccc} .panel img{max-width: 100%; height: auto;} div.top_right .right_wrap{padding-left: 10px;} div.top_right .right_wrap .right_opner{height: 70px;} div.top_right .right_wrap .right_opner .btn{width: 100%; height: 70px; font-size: 1.1em; letter-spacing: 1px;} div.top_right .right_wrap .right_opner .btn.reward_end{background: #eee; margin:0;} div.top_right .right_wrap .right_opner .btn.rewarding{background: #cb4e4d; border: 1px solid #cb4e4d; color: #fff; width: 100%; float: left; margin: 50px 0;} @media screen and (max-width: 700px){ .tabs-menu{margin-right:0;} .tabs-menu li{width:calc(100% / 4);} } #blog-header-container { position: fixed; top: 0px; left: 0px; width: 100%; z-index: 99; } #menu-container { position: fixed; top: 50px; left: 0px; width:100%; padding-top: 15px; box-sizing: border-box; -webkit-transition: padding-left 200ms linear; -moz-transition: padding-left 200ms linear; -ms-transition: padding-left 200ms linear; -o-transition: padding-left 200ms linear; transition: padding-left 200ms linear; display: none; } #menu-container.fixed { opacity: 1; -webkit-box-shadow: 0 1px 5px 1px rgba(0,0,0,0.2); box-shadow: 0 1px 5px 1px rgba(0,0,0,0.2); position: fixed; top: 0; left: 0; display: block; z-index: 99; padding-top:0px; background: #fff; } #menu-container .menu-item { font-size: 1.4em; font-weight: bold; color: #fff; } #menu-container .menu-icon { display: block !important; position: absolute; left: -50px; top: 14px; font-size: 1.6em; font-weight: bold; color: #fff; -webkit-transition: left 300ms linear; -moz-transition: left 300ms linear; -ms-transition: left 300ms linear; -o-transition: left 300ms linear; transition: left 300ms linear; } #menu-container .menu-icon.on { left: 15px; } #blog-container { margin-top:200px; padding: 20px; } #menu-container.fixed .tabs-menu{margin-top: 0px; border-bottom: 0px;} #menu-container.fixed .tabs-menu li{float: left; border-bottom: 0px;} #menu-container.fixed .tabs-menu li.active-tab{float: left; border-bottom: 0px; border-top: 1px solid #ca4e4e} #menu-container.fixed div.top_right .right_wrap .right_opner{margin-top: 0px;} div.top_right .right_wrap .company_info, div.top_right .right_wrap .share_wrap{padding: 10px 0px;} div.top_right .right_wrap .company_info .company_wrap, div.top_right .right_wrap .share_wrap .share_inner{padding: 10px; border: 1px solid #ddd; border-top: 2px solid #ca4e4e} div.top_right .right_wrap .company_info .company_wrap h3, div.top_right .right_wrap .share_wrap .share_inner h3, #reward_box .reward_inner h3{padding: 10px 0px; margin: 10px 0px; border-bottom: 1px dotted #ddd; font-size: 1.4em;} div.top_right .right_wrap .company_info .company_wrap h3 span, div.top_right .right_wrap .share_wrap .share_inner h3 span, #reward_box .reward_inner h3 span{color: #fff; background: #989898; font-size: 0.6em; width: 18px; height: 18px; line-height: 16px; text-align: center; float: left; border-radius: 20px; margin-right: 10px; } div.top_right .right_wrap .share_wrap .share_inner .share_box, #reward_box .reward_inner .reward_box{padding: 10px 0px;} div.top_right .right_wrap .company_info .company_wrap .company_inner h4, div.top_right .right_wrap .share_wrap .share_inner .share_box h4{display: block; border-left: 3px solid #696969; padding-left: 10px; margin-bottom: 20px; font-size: 1.3em; color: #08549a;} div.top_right .right_wrap .company_info .company_wrap .company_inner p, div.top_right .right_wrap .share_wrap .share_inner .share_box p{margin-left: 13px; margin-bottom: 5px; font-size: 1.1em; overflow: hidden;} div.top_right .right_wrap .company_info .company_wrap .company_inner p:last-child, div.top_right .right_wrap .share_wrap .share_inner .share_box p:last-child{margin-bottom: 0px;} div.top_right .right_wrap .company_info .company_wrap .company_inner p a{ float: right; width:calc(100% - 90px);} div.top_right .right_wrap .company_info .company_wrap .company_inner p span{display: inline-block; text-align: justify; width: 90px; font-weight: 600; letter-spacing: 1px; float: left;} div.top_right .right_wrap .share_wrap .share_inner h3 span{background: #d5514d} div.top_right .right_wrap .share_wrap .share_inner .share_box p{line-height: 1.5em;} div.top_right .right_wrap .share_wrap .share_inner .share_box .share_btn{padding: 20px 10px; margin-top: 20px; border-top: 1px dotted #ddd; padding-bottom:0px;} div.top_right .right_wrap .share_wrap .share_inner{border-top: 2px solid #333;} /*배송정보*/ div.top_right .right_wrap .company_info .company_wrap h3 a{float:right; width:25px; height:25px; margin-bottom:5px; margin-left:5px; background-position:center; background-repeat:no-repeat; background-size:97%; opacity:0.8;} /*배송정보*/ div.top_right .right_wrap .delivery_wrap{padding: 10px; border: 1px solid #ddd; border-top: 2px solid #333} div.top_right .right_wrap .delivery_wrap h3 span{color: #e9334a; background: #fff; font-size: 0.6em; width: 18px; height: 18px; line-height: 15px; text-align: center; float: left; border-radius: 20px; margin-right: 10px; font-weight: 600; border: 1px solid #e9334a;} div.top_right .right_wrap .delivery_wrap h3 {padding: 10px 0px; margin: 10px 0px; border-bottom: 1px dotted #ddd; font-size: 1.4em;} div.top_right .right_wrap .delivery_wrap .delivery_inner{padding: 10px 20px;} div.top_right .right_wrap .delivery_wrap .delivery_inner > div{float: left; width: calc(100% / 3 - 2px); text-align: center;} div.top_right .right_wrap .delivery_wrap .delivery_inner > div:first-child{text-align: center; padding-right: 10px;} div.top_right .right_wrap .delivery_wrap .delivery_inner > div:last-child{text-align: center; padding-left: 10px;} div.top_right .right_wrap .delivery_wrap .delivery_inner > div span{background: #fff; display: inline-block; color: #bb1328; padding: 15px; border-radius: 60px; font-weight: 600; border: 1px solid #bb1328; margin-bottom: 10px; text-align: center;} div.top_right .right_wrap .delivery_wrap .delivery_inner > div span img{width: 25px;} div.top_right .right_wrap .delivery_wrap .delivery_inner > div span img.on{display: none} div.top_right .right_wrap .delivery_wrap .delivery_inner > div b{display: block; font-weight: normal;} div.top_right .right_wrap .delivery_wrap .delivery_inner > div p{font-weight: 600; color: #333;} div.top_right .right_wrap .delivery_wrap .delivery_inner > div.active span{background: #bb1328; color: #fff; font-weight: 600; margin-bottom: 5px;} div.top_right .right_wrap .delivery_wrap .delivery_inner > div.active span img{display: none} div.top_right .right_wrap .delivery_wrap .delivery_inner > div.active span img.on{display: block;} .sub_section .top_left .delivery_wrap{padding: 10px; border: 1px solid #ddd; border-top: 2px solid #333; margin: 0 auto; margin-bottom: 50px;} .sub_section .top_left .delivery_wrap h3 span{color: #e9334a; background: #fff; font-size: 0.6em; width: 18px; height: 18px; line-height: 19px; text-align: center; float: left; border-radius: 20px; margin-right: 10px; font-weight: 600; border: 1px solid #e9334a;} .sub_section .top_left .delivery_wrap h3 {padding: 10px 0px; margin: 10px 0px; border-bottom: 1px dotted #ddd; font-size: 1.4em;} .sub_section .top_left .delivery_wrap .delivery_inner{padding: 10px 20px;} .sub_section .top_left .delivery_wrap .delivery_inner > div{float: left; width: calc(100% / 3); text-align: center;} .sub_section .top_left .delivery_wrap .delivery_inner > div:first-child{text-align: center; padding-right: 10px;} .sub_section .top_left .delivery_wrap .delivery_inner > div:last-child{text-align: center; padding-left: 10px;} .sub_section .top_left .delivery_wrap .delivery_inner > div span{background: #fff; display: inline-block; color: #bb1328; padding: 15px; border-radius: 60px; font-weight: 600; border: 1px solid #bb1328; margin-bottom: 10px; text-align: center;} .sub_section .top_left .delivery_wrap .delivery_inner > div span img{width: 40px;} .sub_section .top_left .delivery_wrap .delivery_inner > div span img.on{display: none} .sub_section .top_left .delivery_wrap .delivery_inner > div b{display: block; font-weight: normal;} .sub_section .top_left .delivery_wrap .delivery_inner > div p{font-weight: 600; color: #333;} .sub_section .top_left .delivery_wrap .delivery_inner > div.active span{background: #bb1328; color: #fff; font-weight: 600; margin-bottom: 5px;} .sub_section .top_left .delivery_wrap .delivery_inner > div.active span img{display: none} .sub_section .top_left .delivery_wrap .delivery_inner > div.active span img.on{display: block;} @media screen and (max-width: 1100px){ div.top_right .right_wrap .delivery_wrap{margin-top:10px;} div.top_right .right_wrap .cont_delivery .delivery_wrap{display: block;} .sub_section .top_left .delivery_wrap{width: 100%;} } @media screen and (max-width: 425px){ .sub_section .top_left .delivery_wrap{width: 100%;} } /* #blog-share-container { position: fixed; top: 0px; left: 0px; width: 100%; z-index: 99; } */ #share-container { /* position: fixed; top: 50px; left: 0px; width:100%; padding-top: 15px; box-sizing: border-box; */ -webkit-transition: padding-left 200ms linear; -moz-transition: padding-left 200ms linear; -ms-transition: padding-left 200ms linear; -o-transition: padding-left 200ms linear; transition: padding-left 200ms linear; } #share-container.fixed, #share-container2.fixed, #share-container3.fixed { opacity: 1; position: fixed; display: block; z-index: 99; padding-top:0px; background: #fff; width: 340px; } #share-container .menu-item { font-size: 1.4em; font-weight: bold; color: #fff; } #share-container .menu-icon { display: block !important; position: absolute; left: -50px; top: 14px; font-size: 1.6em; font-weight: bold; color: #fff; -webkit-transition: left 300ms linear; -moz-transition: left 300ms linear; -ms-transition: left 300ms linear; -o-transition: left 300ms linear; transition: left 300ms linear; } #share-container .menu-icon.on { left: 15px; } #blog-container { margin-top:200px; padding: 20px; } div.top_right .right_wrap .share_wrap .notice{background: #fff7f7; padding: 20px; margin-top: 10px; border: 1px solid #ccc; padding-bottom:10px;} div.top_right .right_wrap .share_wrap .notice p{} div.top_right .right_wrap .share_wrap .notice p b{font-size: 1.2em;} div.top_right .right_wrap .share_wrap .notice a{float: right; margin-top: 20px; background: #cb4e4c; padding: 3px 10px; font-size: 0.9em; color: #fff;} #reward_box > p{text-align: center; display: block; padding:0px 10px; font-weight: 600; margin: 30px 0px; padding-bottom:10px;} #reward_box .reward_inner h3{border-bottom: 0px; border-left: 2px solid #333; padding: 0px; padding-left: 10px;} #reward_box .reward_inner .reward_div{border: 1px solid #ddd; margin-bottom: 20px;} #reward_box .reward_inner .reward_div .reward_wrap{padding: 20px;} #reward_box .reward_inner .reward_div .reward_wrap.end_reward{padding: 20px; cursor: no-drop; background: #f7f7f7;} #reward_box .reward_inner .reward_div .reward_wrap p.reward_money{font-size: 1.3em; font-weight: 600; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px dotted #ccc;} #reward_box .reward_inner .reward_div .reward_wrap p.reward_money span{letter-spacing:2px;} #reward_box .reward_inner .reward_div .reward_wrap .reward_contents{} #reward_box .reward_inner .reward_div .reward_wrap .reward_contents p.reward_title{line-height: 1.8em;} #reward_box .reward_inner .reward_div .reward_wrap .reward_contents .value_wrap{margin-top: 20px; text-align: right; border-top: 1px dotted #ccc; padding-top: 10px;} #reward_box .reward_inner .reward_div .reward_wrap .reward_contents .value_wrap p{font-weight: 600;} #reward_box .reward_inner .reward_div .reward_wrap .reward_contents .value_wrap p span{color: #d5514d;} #reward_box .reward_inging .value_wrap p, #reward_box .sold_out_wrap .value_wrap p{text-align: left; margin-bottom: 10px;} #reward_box .reward_inging .value_wrap p:last-child, #reward_box .sold_out_wrap .value_wrap p:last-child{margin-bottom: 0px;} .reward_inging p.tecbe, .reward_inging p.tecbe_day, .reward_inging p.reward_button_toggle{display: none;} .reward_inging.active p.tecbe, .reward_inging.active p.tecbe_day, .reward_inging.active p.reward_button_toggle{display: block;} .reward_inging.active{background: #fff7f7;} .reward_inging.active p.reward_button_toggle{display: block;} #reward_box .sold_out_wrap{cursor: no-drop; background: #eee;} #reward_box .sold_out_wrap .sold_out_toggle{margin-top: 20px; text-align: center; font-size: 1.2em; border-top:1px solid #ccc; padding-top: 20px; font-weight: 600;} .reward_inging.active p.reward_button_toggle a{display: block; color: #fff; background: #CA4E4C; padding: 10px; margin-top:20px; text-align: center;} .contents_div_footer{background: #f9f9f9; border: 1px solid #ddd; margin: 50px 0px;} .contents_div_footer > ul{padding: 10px 20px;} .contents_div_footer > ul.detail_notice01 >li{padding: 10px 0px ;border-bottom: 1px dotted #ddd;} .contents_div_footer > ul.detail_notice01 >li:last-child{border-bottom: 0;} .contents_div_footer > ul.detail_notice01 >li ul li{font-size: 1em; margin-bottom: 5px;} .contents_div_footer > ul.detail_notice01 >li ul li span{float: left; width: 30px} .contents_div_footer > ul.detail_notice01 >li ul li p{float: right; width: calc(100% - 30px)} .contents_div_footer > ul > li > p.title{font-size: 1.2em; border-left: 3px solid #cb4e4c; padding-left: 10px; font-weight: 600;} .contents_div_footer > ul.detail_notice01{background: #fffcfc; border-bottom: 1px dotted #ccc;} .contents_div_footer > ul.detail_notice02 > li{margin-bottom: 10px;} .contents_div_footer > ul.detail_notice02 > li:last-child{margin-bottom: 0px;} .contents_div_footer > ul.detail_notice02 > li > p{} .lst_notice > h3{padding-left: 15px; border-left: 3px solid #ca4e4e; /*margin: 20px 0px 40px;*/} .project_article{padding: 20px; border: 1px solid #ddd; margin-bottom: 20px;} .project_article .news_top h2{text-align: left; color: #333; font-size: 1.7em; font-weight: 600;} .project_article .editor_write p iframe{width:100%;} @media screen and (max-width: 1100px){ div.top_left, div.top_right{width: 100%;} div.top_right .right_wrap .right_opner p{position: absolute; top: 0px; right: 0; width: 20%; min-width: 120px;} #menu-container.fixed div.top_right .right_wrap .right_opner p{position: static; width: 100%;} #menu-container.fixed .tabs-menu li{width: calc(100% / 4);} #menu-container.fixed div.top_left{width: 75%;} #menu-container.fixed div.top_right{width: 25%;} #menu-container.fixed div.top_right .right_wrap{padding:0;} #share-container.fixed{position: static; width: 100%;} #reward_box {margin-top:0px !important; } .tabs-content{width: 95%; margin: 0 auto;} div.top_right .right_wrap{width: 100%; margin: 0 auto;} div.top_right .right_wrap .company_info{width: 49.4%; float: left;} div.top_right .right_wrap .company_info{margin: 0; width: 100%; float: none;} div.top_right .right_wrap .share_wrap{margin-left: 0.2%} div.top_right .right_wrap .company_info .company_wrap{height:auto;} div.top_right .right_wrap .company_info .company_wrap .company_inner p{margin-bottom: 20px;} div.top_right .right_wrap .company_info .company_wrap .company_inner h4{margin-top: 20px; margin-bottom: 40px; } #reward_box .reward_inner .reward_div{width: 49.4%; float: left;} #reward_box .reward_inner .reward_div:nth-child(even){margin-left: 0.3%} #reward_box .reward_inner .reward_div:nth-child(odd){margin-right: 0.3%} #reward_box .reward_inner .reward_div .reward_wrap .reward_contents p.reward_title{height: 46px; overflow: hidden;} .sub_contents.detail_wrap .sub_section .sub_top{padding: 100px 60px} .tabs-menu{margin-top: 0px;} .sub_contents.detail_wrap .sub_section .hash_wrap span{font-size: 1.2em;} .sub_contents.detail_wrap .sub_section h2{font-size:2.5em;} .sub_contents.detail_wrap .sub_section .progress_wrap li .progress_inner > small{font-size: 0.9em;} .sub_contents.detail_wrap .sub_section .progress_wrap li h3{font-size: 1.2em;} .contents_div_footer{width: 100%; margin: 0 auto;} div.top_right .right_wrap{padding: 0px;} div.top_right .right_wrap .right_section{width:calc(100% - 20px); margin: 0px 10px;} } @media screen and (max-width: 700px){ div.top_right .right_wrap .right_opner{display:none;} } @media screen and (max-width: 749px){ .sub_contents.detail_wrap .sub_section.sub_section_top{margin-top: 0px;} .sub_contents.detail_wrap .sub_section .sub_header{width:100%;} } /* 상세페이지 새소식 tab */ .panel.panel-2 .lst_notice .btn_div p{text-align: right;} .panel.panel-2 .lst_notice .btn_div p a{padding: 5px 20px; border: 1px solid #cb4e4c; background: #cb4e4c; color: #fff; display: inline-block;} .panel.panel-2 .lst_notice .btn_div p a:hover{background: #ad3836} .sub_contents .news_wrap h2.sub_title{margin-bottom: 20px;} .sub_contents .news_wrap p.sub_crime{text-align: left; display: block; width: 100%; margin: 0 auto; border: 1px solid #c3c3c3; background: #fff; padding: 20px; line-height: 1.7em; margin-bottom: 30px;} .sub_contents .news_wrap p.sub_crime span{display: inline-block; background: #db6256; color: #fff; text-align: center; font-size: 0.6em; padding: 3px 15px; line-height: 1em; margin-right: 10px} .sub_contents .sub_middle{background: #fff;} .sub_contents .sub_middle .inner_div{margin-bottom: 30px;} .sub_contents .sub_middle .inner_div label{display: block; margin-bottom: 5px; font-size: 1.2em; font-weight: 400; color: #333;} .sub_contents .sub_middle .inner_div input{border: 1px solid #ddd; width: 100%; height: 35px; padding: 5px 15px;} .sub_contents .sub_middle p.sub_p{text-align: right;} .sub_contents .sub_middle p.sub_p input{padding: 10px 35px; background: #db6156; color: #fff; border: 1px solid #db6156;} .sub_contents .sub_middle p.sub_p input:hover{background: #bd5248;} .project_article .news_top{margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px dotted #ddd;} .project_article .news_top > span{float: left; font-size: 3em; font-weight: 400; margin-right: 10px; line-height: 1em; color: #b7b7b7} .project_article .news_top > h2{float: left; width: calc(100% - 115px); margin-top:8px;} .project_article .news_top > p{float: left; width: 100%; font-weight: 400; text-align: right; color: #929292} #editor_write *{margin-bottom: 10px; line-height: 1.5em;} .project_article .page_btn{border-top: 1px dotted #ddd; padding: 10px 8px; text-align: right;} .project_article .page_btn p{display: inline-block;} .project_article .page_btn p input{padding: 7px 15px; background: #ececec; font-size: 12px;} .project_article .page_btn p input.update_btn{background: #fff;} /* tab - 응원하기 */ .reply_article >form{margin-bottom: 50px;} .reply_article .reply_header{background: #f7f7f7; padding:20px; border: 1px solid #eee;} .reply_article .reply_header > textarea{width: 100%; height: 120px; padding: 10px; border: 1px solid #ddd; box-sizing: border-box; resize: vertical;} .reply_article .reply_header > p{text-align: right; display: block; margin-top:-5px; width: 100%; border: 1px solid #ddd; border-top:0px;} .reply_article .reply_header > p label{display: inline-block; width: calc(100% - 142px); height: 43px; float: left; background: #fdfdfd; text-align: left; line-height: 43px; padding-left: 20px;} .reply_article .reply_header > p input{padding: 15px 30px; color: #fff; background: #cb4e4d; font-size: 0.9em; border: 0px; width:142px;} .reply_article .reply_top02{padding: 20px; padding-bottom: 20px; position: relative; border-top: 1px solid #ddd; margin-top: 10px;} .reply_article .reply_top02 .reply_input > p{font-size: 1.1em; font-weight: bold; margin-bottom: 10px;} .reply_article .reply_top02 .reply_input > p span{font-size: 0.8em; font-weight: 600; margin-left: 10px; display: inline-block; color: #8e8e8e;} .reply_article .reply_top02 .reply_line{position: absolute; width: 100%; height: 100%; top:0; left: 0; display: block; background: rgba(111, 111, 111, 0.05)} .reply_article .reply_top02 .space{} .reply_article .reply_top02 .reply_contents{padding-left: 10px; font-size: 1em; line-height: 1.5;} .reply_article .reply_top02 .reply_box{margin-top:10px; text-align: right;} .reply_article .reply_top02 .reply_box > p{display: inline-block; padding: 0px 5px; border-right: 1px solid #ccc; line-height: 1.5; font-size: 0.8em; z-index: 0;} .reply_article .reply_top02 .reply_box > p:last-child{border-right: 0px;} .reply_article .reply_top02 .reply_box > p.re_reply{cursor: pointer;} .reply_article .reply_top02 .reply_box > p.border_btn a, .reply_article .reply_top02 .reply_box > p.border_btn span{font-size: 1em; line-height: 1.5; vertical-align: middle;} .reply_article .reply_top02.act{background: #f9f9f9; border-bottom: 1px solid #dedede; width: 95%; border-top:0px; margin: 0 auto;} .reply_article .reply_top02 .reply_box .reply_input_box{ display: none;} .reply_article .reply_top02 .reply_box > p.re_reply:hover .reply_input_box{display: block;} .reply_article .reply_top02 .reply_box .reply_00{padding: 20px; background: #f7f7f7; border: 1px solid #eee; margin-top:12px;} .reply_article .reply_top02 .reply_box .reply_00 textarea{width: 100%; height: 85px; padding: 10px; border: 1px solid #ddd; box-sizing: border-box; resize: vertical;} .reply_article .reply_top02 .reply_box .reply_00 form > p{text-align: right; display: block; margin-top:-5px; width: 100%; border: 1px solid #ddd; border-top:0px;} .reply_article .reply_top02 .reply_box .reply_00 form > p label{display: inline-block; width: calc(100% - 142px); height: 43px; float: left; background: #fdfdfd; text-align: left; line-height: 43px; padding-left: 20px;} .reply_article .reply_top02 .reply_box .reply_00 form > p input{padding: 15px 30px; color: #fff; background: #cb4e4d; font-size: 0.9em; border: 0px; width:142px;} .reply_plus{width:100%; height:100%; margin-top:30px;} .reply_plus a{display:block; width:150px; line-height:40px; margin:auto; text-align:center; background-color:#f7f7f7; border:1px solid #ccc; cursor:pointer; font-weight:600;} @media screen and (max-width: 768px){ .sub_contents.detail_wrap .sub_section h2.title{font-size: 1.8em; line-height: 1.5} .sub_contents.detail_wrap .sub_section .hash_wrap span{font-size: 1em;} .sub_contents.detail_wrap .sub_section h2{font-size: 1.7em; margin-top: 10px;} .reward_type{margin:3% 2.064% !important} .mob_bar{display:block!important;} /*.brand_inner a{border:1px solid #ededed; border-radius: 10px}*/ .brand_inner a i{margin-left:10px} .pay_but a{display:none} .optBtn{border-radius: 0!important;} .cp_share{ position: fixed; left: 0; bottom: 0; background: #fff; border-top: 1px solid #e6e6e6; z-index: 99; padding: 10px ; } .crowd_detail{} header{box-shadow:1px 1px 1px 1px #eee} .myInfo{display:none} .searchBtn{margin-right: 0!important;} .detailLeft .mainImg{padding-bottom: 80%} .hdmenu{display:none} } @media screen and (max-width: 700px){ #menu-container.fixed{display: none !important;} .fixed_menu{display: block; position: fixed; bottom: 0; left: 0; width: 100%; padding: 5px;} .fixed_menu .top_left{width: calc(100% - 55px); height: 50px; float: left;} .fixed_menu .top_left input{display:block; margin-top:0; width: 100%; height: 50px; background: #cb4e4c; border: 1px solid #cb4e4c; color: #fff; font-size: 1.2em; letter-spacing: 2px;} .fixed_menu .toggle_div{float: right; width: 50px; background: #fff;} .fixed_menu .toggle_div p{padding: 10px;} .fixed_menu .toggle_div p img{width: 100%;} .fixed_wrap{position: relative;} .fixed_wrap .toggle_inner{position: absolute; bottom:10px; right: 0; width: 210px; display: none;} .fixed_wrap .toggle_inner > ul > li{box-shadow: 1px 2px 4px #6d6d6d;-webkit-box-shadow: 1px 2px 4px #6d6d6d; -moz-box-shadow: 1px 2px 4px #6d6d6d; -o-box-shadow: 1px 2px 4px #6d6d6d; -ms-box-shadow: 1px 2px 4px #6d6d6d;} .fixed_wrap .toggle_inner > ul > li, .fixed_wrap .toggle_inner .tabs-menu > li{width: 100%; padding: 0; height: auto; text-align: center;} .fixed_wrap .toggle_inner > ul > li:first-child{margin-bottom: 3px; background: #cb4e4b; border: 0;} .fixed_wrap .toggle_inner > ul > li:last-child{margin-top: 5px; border: 0px solid #ddd;} .fixed_wrap .toggle_inner > ul > li a{display: block; padding: 10px 0px; } .fixed_wrap .toggle_inner > ul > li:first-child a{color: #fff; letter-spacing: 2px;} .fixed_wrap .toggle_inner .tabs-menu{border-bottom: 0; height: auto; border: 1px solid #eee;} .fixed_wrap .toggle_inner .tabs-menu > li span{border-right: 0; padding: 15px } .fixed_wrap .toggle_inner .tabs-menu > li{border-bottom: 1px dotted #eee} .fixed_wrap .toggle_inner .tabs-menu > li:last-child{border-bottom: 0} .fixed_wrap .toggle_inner > ul > li.shared_icon > p{padding: 5px; border: 1px solid #ddd; background: #fff;} .fixed_wrap .toggle_inner > ul > li.shared_icon ul li{width: 70px; float: left;} .fixed_wrap .toggle_inner > ul > li.shared_icon ul li a{padding:0;} .fixed_wrap .toggle_inner > ul > li.shared_icon ul li a img{width: 100%;} .fixed_wrap .toggle_inner > ul > li.shared_icon{position: relative;} .fixed_wrap .toggle_inner > ul > li.shared_icon .tooltip_div{position: absolute; top: -83px; left: -200px; background: #fff; width: 240px; text-align: left; border-radius:5px; box-shadow: 4px 4px 6px rgba(33, 33, 33, 0.3);} .fixed_wrap .toggle_inner > ul > li.shared_icon .tooltip_div img{width: 20px; position: absolute; bottom: -16px; right: 14px;} .fixed_wrap .toggle_inner > ul > li.shared_icon .tooltip_div span{display: inline-block; text-align: right; font-size: 1.6em; font-family: lato, sans-serif; line-height: 0.7; float: right;} .fixed_wrap .toggle_inner > ul > li.shared_icon .tooltip_div p{padding: 5px; border:1px solid #afafaf} .fixed_wrap .toggle_inner > ul > li.shared_icon .tooltip_div p:FIRST-CHILD{ background: #cb4e4a; color: #fff; border: 1px solid #cb4e4a;} .fixed_wrap .toggle_inner > ul > li.shared_icon .tooltip_div p:last-child{border-top: 0;} .fixed_wrap .cp_share{width:100%; background-color:#fff; bottom:5px; margin-bottom:0;} .fixed_wrap .cp_share ul{padding:6px 0; width:240px; margin:auto;} .fixed_wrap .cp_share ul li{display:inline-block; width:45px; height:45px; margin-bottom:0; margin-right:15px; background-color:#fff;} .fixed_wrap .cp_share ul li:first-child{margin-bottom:0; background-color:#fff; background-repeat:no-repeat; background-size:40%; background-position:center;} } @media screen and (max-width: 600px){ .sub_contents.detail_wrap .sub_section .progress_wrap{border-radius:15px; width: 80%; margin: 0 auto;} .sub_contents.detail_wrap .sub_section .progress_wrap ul{padding:20px;} .sub_contents.detail_wrap .sub_section .progress_wrap li{width: 50%; border-right:0; margin: 0; border-right: 1px dotted #b7b7b7; border-bottom: 1px dotted #b7b7b7; padding: 15px 0px;} .sub_contents.detail_wrap .sub_section .progress_wrap li:nth-child(2), .sub_contents.detail_wrap .sub_section .progress_wrap li:nth-child(4){border-right: 0;} .sub_contents.detail_wrap .sub_section .progress_wrap li:nth-child(3), .sub_contents.detail_wrap .sub_section .progress_wrap li:nth-child(4){border-bottom:0;} .sub_contents.detail_wrap .sub_section .progress_wrap li:last-child{width: 100%; margin-bottom: 0; border-bottom:0; padding: 15px 30px;} .sub_contents.detail_wrap .sub_section .progress_wrap li .progress_inner > small{font-size: 1.2em;} .sub_contents.detail_wrap .sub_section .progress_wrap li h3 {font-size: 1.6em;} .sub_contents.detail_wrap .sub_section .hash_wrap{margin-top:0} #menu-container.fixed .tabs-menu li{width: auto;} #reward_box .reward_inner .reward_div{margin-bottom: 10px; width: 100%; float: none;} } @media screen and (max-width: 425px){ .sub_contents.detail_wrap .sub_section .progress_wrap{ width: 90%; } .sub_contents.detail_wrap .sub_section .progress_wrap li:last-child{padding: 15px 5px;} .sub_contents.detail_wrap .sub_section .progress_wrap li:last-child .progress_inner h3{text-align: center;} div.top_right .right_wrap .right_opner .btn.rewarding{font-size: 1.1em;} div.top_right .right_wrap .right_section{margin:0px 5px;} div.top_right .right_wrap .company_info, div.top_right .right_wrap .share_wrap{margin: 0; width: 100%; float: none;} #reward_box .reward_inner .reward_div:nth-child(odd), #reward_box .reward_inner .reward_div:nth-child(even){margin-left:0; margin-right: 0;} .contents_div_footer{width: 100%;} div.top_right .right_wrap .company_info .company_wrap{height: auto;} .reply_article .reply_header > p input, .reply_article .reply_top02 .reply_box .reply_00 form > p input{width: 100px;} .reply_article .reply_header > p label, .reply_article .reply_top02 .reply_box .reply_00 form > p label{width: calc(100% - 100px)} } @media screen and (max-width: 375px){ .fixed_wrap .toggle_inner > ul > li.shared_icon .tooltip_div{left: -120px; top:-90px;} } @media screen and (max-width: 320px){ .sub_contents.detail_wrap .sub_section .progress_wrap{width: 100%;} .sub_contents.detail_wrap .sub_section .progress_wrap ul{padding: 10px;} .tabs-menu li span{font-size: 1em;} div.top_right .right_wrap .right_opner p{width: 0;} .contents_div_footer > ul.detail_notice01 >li ul li span{width:10px;} .contents_div_footer > ul.detail_notice01 >li ul li p{width: calc(100% - 10px)} .fixed_wrap .toggle_inner > ul > li.shared_icon .tooltip_div{left: -90px; top:-75px;} } /* reward page */ .reward_contents{padding-bottom: 250px;} .reward_contents h1{font-size: 1.7em; margin-bottom: 20px; padding-left: 10px; border-left: 3px solid #b72932; word-break: break-all} .reward_wrap h2.sub_title span{display: block; text-align: center; font-size: 0.7em; margin-bottom: 10px; font-weight: 400;} .reward_contents .reward_head{ width:100%; display: flex; justify-content: left; margin-bottom: 50px; } .reward_contents .reward_head_img{ width: 40%; aspect-ratio: 3/2; margin-right: 30px; } .reward_contents .reward_head_img img{ width: 100%; aspect-ratio: 3/2; } .reward_contents .reward_head_list{ margin-top: auto; margin-bottom: auto; } .reward_contents .reward_head_list li:nth-child(1) p{ margin-bottom: 5px; } .reward_contents .reward_head_list li:nth-child(2) h4{ font-size: 1.5rem; margin-bottom: 40px; } .reward_contents .reward_head_list li:nth-child(3) p{ font-size: 1rem; } .reward_contents .reward_head_list li:nth-child(3) p span{ font-size: 1rem; } .checkbox.custom { float: left; margin: 0; padding: 0; display: block; width: 100%; margin-bottom: 20px; } input[type="checkbox"].custom { margin-left: 0; padding: 0; } input[type=checkbox].css-checkbox { position: absolute; overflow: hidden; clip: rect(0 0 0 0); height: 1px; width: 1px; margin: -1px; padding: 0px; border: 0; } input[type=checkbox].css-checkbox+label.css-label, input[type=checkbox].css-checkbox+label.css-label-red{ padding-left: 40px; height: 40px; display: block; line-height: 40px; background-repeat: no-repeat; background-position: 0 0; font-size: 1.6em; vertical-align: middle; cursor: pointer; opacity: 1; } input[type=checkbox].css-checkbox+label.css-label:hover, input[type=checkbox].css-checkbox+label.css-label-red:hover { /* opacity: 0.5; */ /* 선택적 사용 */ } input[type=checkbox].css-checkbox:checked+label.css-label, input[type=checkbox].css-checkbox:checked+label.css-label-red { background-position: 0px -40px; } .css-label { background-image: url('/images/g_check.png'); } .css-label-red { background-image: url('/images/g_check.png'); background-size: 40px; font-weight: 600; } .css-label-red span{color: #333; font-size: 0.8em; font-weight: normal} .sub_top{padding: 30px 0;} .crowd_contents .sub_top{padding: 0;} .sub_top .wrap_1100 .sub_title{ text-align: center; font-size: 14px; font-weight: 700; color: #999; padding: 10px 20px; margin: 0 20px; width: 15%;} .sub_top .wrap_1100 .sub_title p{font-size: 12px; font-weight: 500;} .sub_top .wrap_1100 .sub_title.step_on{color: #C72030; } /*페이지 옮길때마다 바뀌는 색 이걸로 써주세요*/ .reward_title{ margin-bottom: 15px; } .meetup_step{margin-bottom: 100px;} .meetup_step .img_box{width:14px; height: 50px; background-size: 100% auto; background-position: center;background-repeat: no-repeat; } .meetup_step .img_box{background-image: url("../../images/arrow_right.png");} .meetup_step .img_box.img_on{background-image: url("../../images/arrow_right_red.png");} /* payment*/ .payment_amount .payment_amount_wrap{margin-bottom: 15px; border-bottom: 1px dotted #ccc; padding: 0 10px;} .payment_amount .payment_amount_wrap li{padding-bottom: 10px; display: flex; align-items: center; justify-content: space-between; font-size: 14px; font-weight: 400;} .payment_amount .payment_amount_wrap li .red{color: #c53d45;} .payment_amount .total_amount { background-color: #FDF3F2; padding: 20px; display: flex; align-items: center; justify-content: space-between; font-size: 1.2rem; font-weight: 600; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; } .payment_amount .total_amount .red{color: #c53d45; font-weight: 600;} .payment_amount .total_amount .red span{font-weight: 600; font-size: 1.2rem;} .backer_check{display: flex; align-items: center; padding: 10px 0; margin-top: 20px;} .backer_check > input{margin: 2px 5px 0 0;} .payment_info h3,.reward_custom_info .address_wrap h3{font-size: 1.3rem; font-weight: 600; margin-bottom: 30px;} .payment_info .pay_btn > a:first-child{border: 1px solid #c53d45; border-radius: 4px; color: #c53d45; padding: 5px; margin-right: 20px; display: flex; align-items: center; width: 100px; height: 30px; cursor: pointer;} .payment_info .pay_btn > a:first-child img{height: 20px; margin-right: 10px;} .payment_info .pay_btn > a:last-child{border: 1px solid #333; border-radius: 4px; color: #333; padding: 5px;display: flex; align-items: center; width: 100px; height: 30px; cursor: pointer;} .payment_info .pay_btn > a:last-child img{height: 13px; margin-right: 10px;} .payment_pick {background-color: #FDF3F2;} .payment_none {background-color: rgba(204, 204, 204, 0) } .reward_contents h2{ padding-bottom:20px; border-bottom: 1px solid #aaa; } .reward_div .reward_section{padding: 30px 30px; border-bottom: 1px solid #aaa;} .reward_detail{padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #eee;} .reward_detail .reward_option > div > .select .value{display: inline-block; width: 100px; color: #db6256; font-size: 18px;} .reward_detail .reward_option > div > label{float: left; line-height: 40px; margin-right: 15px; font-size: 1.3em; color: #333} .reward_detail .reward_option > div > select{float: right; height: 38px; width: 120px; padding: 10px; text-align: center; color: #db6256; font-size: 18px;} .reward_detail .reward_option > div > select option{text-align: center; } .reward_detail .select .list ul li:hover, .reward_detail .select .list ul li.hovered{background: #db6256} .reward_day{} .reward_day .reward_day_price{display: flex; justify-content: left; margin-bottom: 12px;} .reward_day .reward_day_price p:first-child{margin-right: 15px;} .reward_day .reward_day_price .limited_p_wrap{padding-top: 15px;} .reward_day .reward_day_price .limited_p_wrap span{vertical-align: bottom; font-weight: 600;} .reward_day .section_wrap{padding-left: 40px;} .reward_day .section_wrap .delivery_limited > p:first-child{font-size: 1.1rem; font-weight: 600;} .reward_day .section_wrap .delivery_limited p{line-height: 1.6rem;} .reward_day .section_wrap .delivery_limited > p:nth-child(2){font-size: 1.1rem;} .reward_day .delivery_charge{ display:flex; justify-content:left; margin-top: 20px;} .reward_day .delivery_charge p{ font-size: 0.875rem; color: #222222; font-weight: 500;} .reward_day .delivery_charge p:first-child{margin-right: 15px;} .reward_day .delivery_charge p span{font-weight: 400;} .reward_day .delivery_charge .delivery_inner{float: right;} .reward_day .delivery_charge .delivery_inner p{display: inline-block; line-height: 1em;} .reward_day .delivery_charge .delivery_inner p:first-child{margin-right: 10px; } .reward_day .delivery_charge .delivery_inner p > span{color: #db6256; font-weight: 600;} .reward_day .delivery_charge .delivery_inner p > span span{color: #333; font-weight: 400;} .reward_day .delivery_charge .delivery_inner .delivery_alarm{font-size: 0.7rem; color: #777;} .reward_day .delivery_limited p{font-size: 1.2em; line-height: 1.7em;} .reward_div .reward_section{margin-bottom: 0px;} .reward_section .wrap{display: flex; justify-content: space-between;padding-right: 40px;} .reward_section .option_section{border-top: 2px solid #fff; display: block!important;} .reward_section .option_section .option{ font-size: 0.9rem; display: flex; justify-content: left;height: 30px; } .reward_section .option_section .option *{font-size: 0.9rem; line-height: 30px; height: 30px;} .reward_section .option_section .option p{font-weight: 500; margin-right: 15px;} .reward_section .option_section .option select{width: 100%; background-image: url("../../images/arrow_down.png"); background-repeat: no-repeat;background-size: auto 8px; background-position: 97% center} .reward_section .amount{display: flex;} .reward_section .amount p{ font-size: 0.9rem; font-weight: 500; margin-right: 25px; vertical-align: middle; height: 30px; line-height: 30px;} .reward_section .amount div{display: flex;justify-content: left;} .reward_section .amount div button{border: 0; background-color: transparent; height: 30px;} .reward_section .amount div button .fa-regular.fa-chevron-up{ font-weight: 700; font-size: 0.875rem; color: #777; } .reward_section .amount div button:hover .fa-regular.fa-chevron-up{ color: #b71c24; } .reward_section .amount div button.am_down .fa-regular.fa-chevron-up{ transform: rotate(180deg); } .reward_section .amount div input{ width: 50px; height: 30px; background-color: transparent; border: 0; text-align: center; font-size: 0.9rem; font-weight: 500; } .reward_section .amount div button.am_up{margin-right: 15px;} .reward_section .amount div button.plus_btn{ height: 30px; background-color: #F86453; color: #fff; font-size: 0.875rem; padding: 0 10px; font-weight: 500; } .reward_section .pay_list{margin-top: 20px; margin-bottom: 30px;} .reward_section .pay_list li{ background-color:#fff; height: 30px; padding: 0 20px; position: relative;border-radius: 3px; margin-bottom: 10px;} .reward_section .added_select > p {position: absolute; right: 20px ;top: 50%;transform: translateY(-50%);width: 12px; height: 12px; font-size: 1rem; line-height: 30px;} .reward_section .added_select >p #added_del{cursor:pointer; display: block; width: 100%; height: 100%; text-indent: -9999999px; background-image: url("../../images/icon_close.png"); background-repeat: no-repeat;background-size: auto 12px; background-position: center;} .reward_section .added_select .list_tit{height: 100%; display: flex; justify-content: left; padding-right: 40px;} .reward_section .added_select .list_tit p{ height: 100%; line-height: 30px; font-size: 0.875rem; font-weight: 500; padding-left: 20px; margin-right: 20px;} .reward_section .added_select .list_tit p span{margin-left: 15px; font-size: 0.875rem;} .reward_section .total{width: 100%; text-align: right;} .reward_section .total .total_txt{font-size: 1.3rem; font-weight: 500;} .reward_section .total .total_txt span{font-weight: 600; color: #b71c24;font-size: 1.5rem;margin-left: 15px; display: inline-block; width: 80px; margin-right: 10px;} .reward_section.active{border: 1px solid #db6256} .reward_detail .reward_option > div > p {float: right; height: 38px; width: 200px; padding: 0px; text-align: center; color: #db6256; font-size: 18px;} .reward_detail .reward_option > div > p input{width: 80%; height: 38px; padding: 10px; border: 1px solid #ddd; text-align: right;} .reward_section2{background: #f5f5f5; border: 1px solid #333;} .reward_1st{text-align: center; margin-top:20px;} .reward_section .reward_1st a{width: 300px; padding: 20px 30px; font-size: 1.4em; letter-spacing: 1px; background: #db6256; border: 1px solid #db6256; color: #fff; display: block; margin: 0 auto;} .css-label-red1{padding-left: 40px; height: 40px; display: block; line-height: 40px; background: transparent; background-image: none; font-size: 1.6em; vertical-align: middle; cursor: pointer; opacity:1;} .reward_contents .plus{text-align: center; margin-top: 50px; margin-bottom: 50px; border: 1px solid #b71c24;padding: 30px;} .reward_contents .plus .reward_detail{display: flex;justify-content: center;} .reward_contents .plus .reward_detail >p {margin-right: 20px; font-weight: 500;} @media screen and (max-width: 1024px){ .reward_head{ padding: 0 40px; } } @media screen and (max-width: 768px){ .option_section .wrap div{margin-right: 10px;} .option_section .wrap div:last-child{margin-right: 0} .reward_contents h1{margin: 0px 40px 20px 40px; line-height: 1.5;} .reward_contents .plus .reward_detail{display: block;} .reward_contents .plus .reward_detail p:first-child{margin-bottom: 10px;} } @media screen and (max-width: 667px){ } @media screen and (max-width: 600px){ .reward_contents h1{margin: 0px 20px 20px 20px;} .reward_contents .reward_inner{padding: 10px;} .reward_detail > p{float: none; display: block;} .reward_detail .reward_option{float: none; margin-top: 15px;} .reward_detail .reward_option > div > label{float: none; padding-left: 40px;} .reward_day .delivery_charge h3, .reward_day .delivery_charge .delivery_inner{float: none;} .reward_day .delivery_charge .delivery_inner{margin-top: 15px;} } @media screen and (max-width: 425px){ .reward_title h2{font-size: 1.1rem; padding:0px;} .reward_div .reward_section{margin: 0; margin-bottom:10px} .reward_day .delivery_limited p{font-size: 1em;} .reward_day .delivery_charge h3{font-size: 1,2em;} .sub_top .wrap_1100 .sub_title{padding: 20px 0; width: 100%;} .sub_top .sub_title_cont div.mo{ display: none; } .reward_contents .reward_head{padding: 0 15px; display: block;} .reward_contents .reward_head .reward_head_img{width: 100%;} .reward_section .option_section{ padding-left: 0} .reward_section .option_section .wrap{ display: block; padding: 0 20px; } .reward_section .option_section .wrap div{ margin-bottom: 15px; } .reward_section .pay_list li{ height: auto; padding: 0 20px; } .reward_section .pay_list li .list_tit{ display: block; } .reward_section .pay_list li .list_tit p{ padding: 5px 0; } .reward_section .added_select > p{ width: 25px; height: 25px; top: 20px; right: 10px; } .reward_section .added_select > p a{ background-size: auto 15px; } .sub_top .wrap_1100 .sub_title:nth-child(1){ width: auto; } } .pop-layer p.ctxt { color: #666; line-height: 25px; } .pop-layer .btn-r { width: 100%; margin: 10px 0 20px; padding-top: 10px; border-top: 1px solid #DDD; text-align: right; } .pop-layer { display: none; position: absolute; top: 50%; left: 50%; width: 420px; min-height: 715px; overflow-y:auto; background-color: #fff; z-index: 10; } .dim-layer { display: none; position: fixed; _position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; } .dim-layer .dimBg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: .75; filter: alpha(opacity=50); } .dim-layer .pop-layer { display: block; } a.btn-layerClose { display: inline-block; height: 25px; padding: 0 14px 0; border: 1px solid #304a8a; background-color: #3f5a9d; font-size: 13px; color: #fff; line-height: 25px; } a.btn-layerClose:hover { border: 1px solid #091940; background-color: #1f326a; color: #fff; } .mypoint_spanfont { font-size: 20px; } .pop-conts{padding: 30px;} .pop-conts h3{text-align: center; border-bottom: 1px solid #ddd; margin-bottom: 20px; padding-bottom: 20px; font-size: 2em;} .pop-conts .pop_text{margin-bottom: 20px;} .pop-conts .pop_text h4{font-size: 1.3em; border-left: 2px solid #ce574b; padding-left: 10px; margin-bottom: 10px;} .pop-conts .pop_text p{border: 1px solid #ddd; padding: 10px; word-break: break-all; color: #949494; background: #f9f9f9; margin-top:10px;} .pop-conts .pop_text p b{color: #333;} .pop-conts .btn-r{text-align: center; margin: 0;} .pop-conts .btn-r p.reward_1st{margin: 0; width: 49.5%; float: left;} .pop-conts .btn-r p.reward_1st input{width: 100%; height: 40px; background: #ce574b; color: #fff; border: 1px solid #ce574b;} .pop-conts .btn-r a.btn-layerClose{width: 49.5%; float: right; line-height: 40px; background: #f5f5f5; border: 1px solid #ddd; color: #333; height: 40px;} @media screen and (max-width: 425px){ .dim-layer .pop-layer{width:98%;} } @media screen and (max-width: 375px){ .pop-conts{padding: 30px 10px;} } .cb{clear:both;} /*.reward_order_wrap{padding-top: 30px;}*/ /*.reward_order_wrap > h3{font-size: 1.3rem; font-weight: 600; margin-bottom: 30px;}*/ /*.reward_order_wrap .card_h3{float: left; margin-bottom:15px; }*/ /*.reward_order_wrap .card_box{float:right; padding:7.5px 15px; font-size:0.8em; line-height:14px; margin-bottom:-11px; background:#f84a63; color:#fff;}*/ /*.reward_order_wrap .order_list_wrap{margin-top:25px; border:1px solid #ddd;}*/ /*.reward_order_wrap .order_list_wrap > h3{font-weight: bold; font-size: 1.2em; margin-bottom: -10px; padding: 30px 30px 0px 30px;}*/ /*!* .reward_order_wrap .order_list_wrap .order_detail{margin:15px 0;} *!*/ /*.reward_order_wrap .order_list_wrap .order_detail p:first-child{float: left; width: 80%; margin-right: 20px; padding-left: 15px;}*/ /*.reward_order_wrap .order_list_wrap .order_detail p:last-child{float: right; text-align: right; width: calc(20% - 20px); font-weight: 600;}*/ .reward_order_wrap .order_list_wrap{ border-top: 1px solid #ccc; } .reward_new_css .order_listed{ padding: 20px 30px ; background-color: #FDF3F2; vertical-align: middle; } .reward_new_css .order_listed .order_detail{ margin-bottom: 20px; } .reward_new_css .order_listed .order_detail p:first-child{ font-size: 1.1rem; line-height: 1.2rem; color: #222; margin-bottom: 5px; font-weight: 500; } .reward_new_css .order_listed .order_detail p:nth-child(2){ font-size: 0.9rem; line-height: 1.2rem; font-weight: 500; } .reward_new_css .order_listed .order_detail p:nth-child(2) span{ font-weight: 500; font-size: 0.9rem; } .reward_new_css .order_listed .op{ display: flex; justify-content: left; margin-bottom: 8px; font-size: 0.875rem; } .reward_new_css .order_listed .op:last-child{ margin-bottom: 0; } .reward_new_css .order_listed .op p:first-child{ width: 5%; margin-right: 15px; } .order_listed{padding: 0px 30px} .order_listed:nth-child(n+2){margin-top:25px;} .order_listed .order_detail input { border:1px solid #e0d2d2; padding:10px; font-size:0.9em; margin-bottom:15px;} span.value_won{color: #c53d45;} .reward_order_wrap .order_list_wrap .order_detail.reward_plus_wrap p{padding-left:0;} .reward_plus_wrap p b{font-size: 1.2em;} .reward_plus_wrap{margin-top:20px;} .order_detail .info p { line-height:200%; } .pointInfo { margin:30px 0; } .cash_use { color:#c72030; } .mycash.cf { margin:0 30px 30px 30px; } .cashEdit li:nth-child(1) { display:block; width: 20%; padding:0 3%; height: 35px; line-height:35px; float:left; text-align: center; border-right:1px solid #ccc;} .cashEdit li:nth-child(2) { display:block; width: 40%; padding:0 3%; height: 35px; line-height:35px; float:left; text-align: center; border-right:1px solid #ccc; overflow: hidden; text-overflow:ellipsis;} .cashEdit li:nth-child(3) { display:block; width: 20%; padding:0 3%; height: 35px; line-height:35px; float:left; text-align: center; border-right:1px solid #ccc;} .cashEdit li:nth-child(4) { display:block; width: 20%; padding:0 3%; height: 35px; line-height:35px; float:left; text-align: center; } .cashEdit::after {content:""; display: block; clear: both;} .cashTitle li { font-size:1.2em; font-weight:500; color:#666; letter-spacing:2px; } .cashTitle { background:#f0f0f0; } .cash_list:nth-child(2n+1) { background:#f8f8f8; } @media screen and (max-width: 650px){ .pointInfo {margin-bottom:0;} } .reward_order_wrap .order_list_wrap .nice_value{padding: 20px 30px 20px 30px; margin-top: 20px; border-top: 1px dotted #ddd; background: #fcfcfe;} .reward_order_wrap .order_list_wrap .nice_value p{width:calc(100% / 4); float: left; text-align: center; font-size: 1.4em;} .reward_order_wrap .order_list_wrap .nice_value p span{display: block; font-size: 0.7em; margin-bottom: 5px;} .reward_order_wrap .order_list_wrap .nice_value p.all_value{color: #c53d45; font-weight: 600;} .cash_border {margin:30px 30px 0px 30px; border-bottom:1px solid #ccc;} .cash_wrap {padding: 0 45px;} .cash_title {font-size: 1.25em; font-weight:500; display: inline-block;} .cash_sub {font-size:1em; display: inline-block; margin-left: 10px;} .cash_use {padding-top:15px;} .cash_use>input {width:300px; border:1px solid #eee; border-right:none; line-height:20px; font-size:12px; } .cash_use>button {width:70px; line-height:24px; font-size:12px; margin-left:-2px; border:1px solid #ccc;} /* 결제안내 */ .reward_notice.reward_order_wrap .reward_notice_inner{padding: 20px 30px; margin-top: 20px;} .reward_notice.reward_order_wrap .reward_notice_inner .pop_text{margin-bottom: 5px;} .reward_notice.reward_order_wrap .reward_notice_inner .pop_text:last-child{margin-bottom: 0px;} .reward_notice.reward_order_wrap .reward_notice_inner .pop_text p{word-break: break-all;} .reward_notice.reward_order_wrap .reward_notice_inner .pop_text p:first-child{font-weight: 600; color: #000;} .reward_notice.reward_order_wrap .reward_notice_inner .pop_text p:last-child{padding-left: 11px; margin-top:3px;} .reward_notice.reward_order_wrap .reward_notice_inner .pop_text p b{color: #c5434a;} .reward_middle .reward_middle_left{float: left; width: 49%;} .left{margin-bottom: 20px;} .reward_middle .reward_middle_right{float: right; width: 49%;} .right{margin-bottom: 20px;} .reward_order_wrap.address_wrap .address_div{padding: 28px 30px; margin-top: 20px; border-radius: 5px; background: #FDF3F2;} .reward_order_wrap.address_wrap .address_div .address_top{margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px dotted #ccc;} .reward_order_wrap.address_wrap .address_div .address_top input{padding: 7.5px 15px;} .reward_order_wrap.address_wrap .address_div .address_top a.favorite_btn{padding: 7.5px 15px; background: #f84a63; border:1px solid #f84a63; color: #fff; } .reward_order_wrap.address_wrap .address_div .address_write{} .reward_order_wrap.address_wrap .address_div .address_write .daum_address_inner{margin-bottom: 10px;} .reward_order_wrap.address_wrap .address_div .address_write .daum_address_inner label{display: block; font-weight: 600;} .reward_order_wrap.address_wrap .address_div .address_write .daum_address_inner input[type="text"]{border: 1px solid #eee; width: 100%; font-size: 0.9em; padding: 10px;} .reward_order_wrap.address_wrap .address_div .address_write .daum_address_inner.daum_address01 input[type="text"]{width:calc(100% - 100px); float: left; border-right: 0px;} .reward_order_wrap.address_wrap .address_div .address_write .daum_address_inner.daum_address01 input[type="button"]{width:100px; float: right; font-size: 0.9em; padding: 10px 0px;} /* 리워드 배송 정보 */ .reward_custom_info .address_wrap h3{margin-bottom: 30px; } .reward_custom_info .address_div{background-color: transparent!important; margin-top: 0!important; padding: 0 10px!important;} .reward_custom_info .address_div > *{font-size: 0.875rem;} .reward_custom_info .address_div .address_top input{ color: #777; border-radius: 3px;} .reward_custom_info .address_div .address_top input:hover{font-wpeight: 600; border: 1px solid #f84a63; color: #f84a63;} .reward_custom_info .address_div .address_top {display: flex; justify-content: space-between;} .reward_custom_info .address_div .address_top {margin-bottom: 15px!important; padding-bottom: 5px!important;} .reward_custom_info .address_div .address_top .address_top_in input{border: 0; padding: 0 20px 0 0 ;} .reward_custom_info .address_div .address_top .address_top_in .address_manage a{background-color: transparent;color: #555; padding: 0 15px 0 0; border: 0; background-image: url("../../images/icon_plus.png"); background-size: auto 10px; background-position: right 5px;background-repeat: no-repeat;} .reward_custom_info .address_div .address_top .address_top_in .address_manage:hover a{font-weight: 600; color: #222; background-image: url("../../images/icon_plus_hover.png");} .reward_custom_info .address_div .address_top .address_top_select{font-size: 13px; font-weight: 600;} .reward_custom_info .address_div .address_top .address_top_select, .reward_custom_info .address_div .address_top .address_top_in input{height:30px; line-height:30px; vertical-align: middle;} .reward_custom_info .address_div .address_top .address_top_in{ display: flex; justify-content: space-between; width: 90%;} .reward_custom_info .address_div .address_write .daum_address_inner label{ margin-bottom: 10px;} .reward_custom_info .address_div .address_write .daum_address01,.address_cont{margin-bottom: 15px!important;} .reward_custom_info .address_div .address_write .daum_address02,.reward_custom_info .address_div .address_write .daum_address03{margin-bottom: 0!important;} .reward_custom_info .address_div .address_cont{display: flex; justify-content: space-between;} .reward_custom_info .address_div .daum_address01{width: 30%;} .reward_custom_info .address_div .address_cont div:first-child{width: 70%;} .reward_custom_info .address_div .address_cont div:nth-child(2){width: 28%;} /*후원자정보*/ .reward_middle .reward_middle_left .backer_contents{border: 1px solid #ddd; padding: 20px 30px; margin-top:20px; background: #fcfcfe;} .reward_middle .reward_middle_left .backer_contents p{margin-bottom: 10px;} .reward_middle .reward_middle_left .backer_contents p label{display: block; font-size: 0.9em; font-weight: 600;} .reward_middle .reward_middle_left .backer_contents p input{border: 1px solid #eee; width: 100%; font-size: 0.9em; padding: 10px;} /*후원자정보_즉시결제창*/ .reward_middle .reward_middle_right .backer_contents{padding: 20px 30px; margin-top:20px; background: #fff;} .reward_middle .reward_middle_right .backer_contents p{margin-bottom: 10px;} .reward_middle .reward_middle_right .backer_contents p label{display: block; font-weight: 600;} .reward_middle .reward_middle_right .backer_contents p input{border: 1px solid #eee; width: 100%; font-size: 0.9em; padding: 10px;} .reward_custom_info .reward_middle_right .backer_contents{padding: 0 10px; margin-bottom: 10px;} .reward_custom_info .reward_middle_right .backer_contents p label{display:inline-block; width: 10%; font-size: 0.875rem; font-weight: 600;} .reward_custom_info .reward_middle_right .backer_contents p:last-child{} /*카드결제정보*/ .reward_middle .reward_middle_right .card_info{border: 1px solid #db6256; background: #fffdfc; padding: 20px 30px; margin-top:20px;} .reward_middle .reward_middle_right .card_info input{border: 1px solid #e0d2d2; padding: 10px; font-size: 0.9em;} .reward_middle .reward_middle_right .card_info .card_num input{width:100px; text-align: center; letter-spacing: 2px;} .reward_middle .reward_middle_right .card_info .card_num_inner{margin-bottom: 10px;} .reward_middle .reward_middle_right .card_info .card_num_inner label{display: block; font-size: 0.9em; font-weight: 600;} .reward_middle .reward_middle_right .card_info .card_num02 input, .reward_middle .reward_middle_right .card_info .card_num03 input{width:50px; text-align: center;} .reward_middle .reward_middle_right .card_info .card_num03 span{display: inline-block; line-height: 35px; letter-spacing: 2px; margin-left: 9px;} .reward_middle .reward_middle_right .card_info .card_num04 input{width: 100%;} .reward_middle .reward_middle_right .reward_perm.reward_order_wrap{padding-top: 11px;} .reward_middle .reward_middle_right .perm_wrap{padding:20px 30px; border: 1px solid #ccc; background: #fcfcfe;} .reward_middle .reward_middle_right .perm_wrap .yack_wrap{display: none; margin-top:10px; padding-top: 10px; border-top: 1px solid #ddd;} .reward_middle .reward_middle_right .perm_wrap .perm_top {cursor: pointer; background-image: url("/images/g_arrow.gif"); background-repeat: no-repeat; background-position: right 4px; background-size: 20px;} .reward_middle .reward_middle_right .perm_wrap .perm_top label{display: inline-block; margin-left: 10px; font-weight: bold;} .reward_middle .reward_middle_right .perm_wrap .yack_wrap label {display: inline-block; margin-left: 10px; font-size: 0.9em;} .reward_middle .reward_middle_right .perm_wrap .yack_wrap .yack_div{margin-bottom: 5px;} .reward_middle .reward_middle_right .perm_wrap .yack_wrap .yack_div:last-child{margin-bottom: 0px;} .reward_middle .reward_middle_right .perm_wrap .yack_wrap .yack_div a{border:1px solid #c5c5c5; background: #fff; margin-left: 10px; font-size: 0.8em; padding: 2px 5px; border-radius: 2px;} .pay_box .reward_perm.reward_order_wrap{padding-top: 11px;} .pay_box .perm_wrap{padding:20px 30px; border: 1px solid #ccc;} .pay_box .perm_wrap .yack_wrap{display: none; margin-top:10px; padding-top: 10px; border-top: 1px solid #ddd;} .pay_box .perm_wrap .perm_top {cursor: pointer; background-image: url("/images/g_arrow.gif"); background-repeat: no-repeat; background-position: right 4px; background-size: 20px;} .pay_box .perm_wrap .perm_top label{display: inline-block; margin-left: 10px; font-weight: bold;} .pay_box .perm_wrap .yack_wrap label {display: inline-block; margin-left: 10px; font-size: 0.9em;} .pay_box .perm_wrap .yack_wrap .yack_div{margin-bottom: 5px;} .pay_box .perm_wrap .yack_wrap .yack_div:last-child{margin-bottom: 0px;} .pay_box .perm_wrap .yack_wrap .yack_div a{border:1px solid #c5c5c5; background: #fff; margin-left: 10px; font-size: 0.8em; padding: 2px 5px; border-radius: 2px;} .address_save .pop-layer{width: 640px;} .address_save .pop-layer .pop-conts{padding: 0px; border: 5px solid #db6156;} .address_save .pop-layer .pop-conts .head{padding: 20px; background: #db6156} .address_save .pop-layer .pop-conts .head h4{color: #fff;} .address_save .pop-layer .pop-conts .head h4 a{float: right; background: transparent; border: 1px solid #fff; width: auto; color: #fff; text-align: center; padding: 0px 20px; margin-top: -2px; font-weight: 400;} .address_save .address_table{padding: 20px; border-bottom: 1px solid #ccc;} .address_save .address_table p{font-weight: 600; letter-spacing: 1px;} .address_add{display: none;} .address_save .address_table span.add_address_btn{font-weight: 400; font-size: 0.9em; color: #fff; background: #db6056; padding: 5px 10px; float: right; margin-top: -5px; cursor: pointer;} .new_address_name{margin-bottom: 10px;} .address_add_table{padding: 25px; border-bottom: 1px solid #ddd;} .new_address_name label{display: block; font-size: 0.8em;} .new_address_name input{width: 100%; border: 1px solid #eee; padding: 10px;} .new_address_div input{margin-bottom: 5px;} .new_address_div input.half_width{width: calc(100% - 120px); float: left; border-right: 0px;} .new_address_div input.postCode_btn{width:120px; float: right; padding: 11px; font-size: 0.8em; background: #eee;} .address_add_table .half_div{float: left; width: 49%;} .address_add_table .half_div:last-child{float: right; width: 49%;} p.modal_input02{text-align: right;} p.modal_input02 input{font-size: 0.9em; background: #dc5f56; padding: 10px 20px; border: 0px; color: #fff;} .address_list{padding: 20px;} .address_list > div{margin-bottom: 10px; border-bottom: 1px dotted #ddd; padding: 10px 0px;} .address_list > div:last-child{margin-bottom: 0px; border-bottom:0;} .address_object .address_table1{float: left; width: calc(100% - 90px); margin-left: 10px;} .address_object .address_table1 p:last-child{font-weight: 600; margin-top:5px;} .address_object .address_btn{float: right; width: 80px; text-align: center; margin: 0 auto;} .address_object .address_btn input{font-size: 0.9em; border: 0px; border-left: 1px solid #ccc; padding: 0px; padding-left: 20px;} p.submit_p{text-align: center; display: block; padding: 20px 0px; margin-top: 50px;} p.submit_p input{width: 300px; color: #fff; background: rgba(250, 99, 97, 0.8); border: 0; font-size: 1.2em; letter-spacing: 2px; padding: 20px; border-radius: 5px; transition: 0.3s; margin-top: 20px;} p.submit_p input:hover { background: rgba(250, 99, 97, 1);} @media screen and (max-width: 1100px){ .sub_contents .sub_middle .wrap_1100{width: 100%; padding:0 10px;} .reward_middle .reward_middle_right .card_info .card_num input{width: 80px;} } @media screen and (max-width: 920px){ .reward_middle .reward_middle_right .card_info .card_num input{width: 64px;} .reward_middle .reward_middle_right .perm_wrap .perm_top input{float: left;} .reward_middle .reward_middle_right .perm_wrap .perm_top label{float: right; width: calc(100% - 30px); padding-right: 22px; word-break: break-all} } @media screen and (max-width: 768px){ .sub_contents .sub_middle .wrap_1100{padding:0 5px;} .reward_middle .reward_middle_left, .reward_middle .reward_middle_right{float: none; width:100%;} .reward_contents h1.order_h1{margin: 0px 0px 20px 0px; font-size: 1.5em;} p.submit_p input{width:30%;} } @media screen and (max-width: 650px){ .reward_order_wrap .order_list_wrap .order_detail p:last-child{width: 120px;} .reward_order_wrap .order_list_wrap .order_detail p:first-child{width: calc(100% - 140px)} .address_save .address_table span.add_address_btn{margin-top:10px; display: block; width: 100px; text-align: center;} } @media screen and (max-width: 550px){ .reward_order_wrap .order_list_wrap .order_detail{margin-bottom: 15px; border-bottom: 1px dotted #ccc} .reward_order_wrap .order_list_wrap .order_detail.reward_plus_wrap{border-bottom: 0px;} .reward_order_wrap .order_list_wrap .nice_value p{font-size: 1.2em;} .reward_order_wrap .order_list_wrap .order_detail p:last-child{float: none; width: 100%; margin-top:10px;} .reward_order_wrap .order_list_wrap .order_detail p:first-child{width: 100%; float: none;} .address_save .pop-layer{width:90%;max-height:500px;} } /* 후원 완료 페이지 */ .reward_complete_title > h3{margin-bottom: 40px; text-align: center;} .reward_order_wrap .reward_comp_title{ border-left: 3px solid #db6256; padding-left: 10px;} .reward_middle .reward_order_wrap .camp_share{border: 1px solid #ddd; padding: 20px 30px; text-align: center; background: #fcfcfe} .reward_middle .reward_order_wrap .camp_share p{ font-weight: 600;} .reward_middle .reward_order_wrap .camp_share p a{display: block; width:150px; margin: 0 auto; margin-top: 20px; padding: 10px 20px; background: #db6256; color: #fff; font-size: 0.9em; border: 0;} .reward_notice.reward_order_wrap .reward_notice_inner.reward_notice_inner01 .pop_text{margin-bottom: 10px} .reward_notice.reward_order_wrap .reward_notice_inner.reward_notice_inner01 .pop_text:last-child{margin-bottom: 0px} .reward_notice.reward_order_wrap .go_mpage{padding: 10px 30px; border: 1px solid #ccc; border-top:0px} .reward_notice.reward_order_wrap .go_mpage p {color: #333; line-height: 40px;} .reward_notice.reward_order_wrap .go_mpage p a{float: right; padding: 0px 20px; background: #333; color: #fff; font-weight: 400; border-radius: 4px; font-size: 0.9em;} .more_campaign{margin-top: 30px;} .more_campaign .section_inner{margin-top:30px;} .more_campaign .section_inner .project_section{width: calc(100% / 3 - 15px);} .more_campaign .progress-inner .cate_div_in{margin-top:0px;} .more_campaign .progress-inner h3.dot_txt{font-size: 1em;} .more_campaign .progress-inner .camp_info{height: 120px} .more_campaign .progress-inner .progerss_bottom{padding-top:5px;} .more_campaign .section_inner .project_section{margin-right: 22px;} .more_campaign .section_inner .project_section:last-child{margin-right: 0px;} .more_campaign_wrap{margin-top:50px; background: #fbfbfb; border-top:1px dotted #ddd; padding-bottom:50px;} .sub_contents .more_campaign_wrap p.third{font-size:1.1em;} .sub_contents .more_campaign_wrap .progress-inner .perc li:last-child{font-size: 1em;} .more_campaign_wrap .progress-inner .cate_div_in span:last-child{font-size: 0.9em;} #reward_complete{padding-bottom:0px;} .more_campaign_btn{display: block; text-align: center; margin-top: 10px;} .more_campaign_btn a{border: 1px solid #ccc; padding: 15px 40px; background: #fff;} @media screen and (max-width: 800px){ .wrap_800{width: 100%; padding-left: 20px; padding-right:20px;} } @media screen and (max-width: 768px){ .sub_section .more_campaign .section_inner .project_section:nth-child( 3n ){display: none;} .more_campaign .section_inner .project_section{width:calc(100% / 2 - 11px)} } @media screen and (max-width: 550px){ .reward_notice.reward_order_wrap .go_mpage p{text-align: center;} .reward_notice.reward_order_wrap .go_mpage p a{display: block; float: none; width: 150px; margin: 0 auto;} } @media screen and (max-width: 492px){ .more_campaign .section_inner .project_section{width: 100%; margin-right: 0px;} .sub_section .more_campaign .section_inner .project_section:nth-child( 3n ){display: block;} } /* 모임 페이지 시작 */ .meet_wrapper .sidenav .profile_top{background: #426da7 } .barcode_modal.meet_class > h2{background: #224779 } .barcode_modal.meet_class .btn_group p.ok_btn{background: #224779 } /* 모임 메인 meet_list.jsp */ .meet_wrapper #slider_wrapper{margin-top:125px; background: #f9fbff;} .meet_wrapper .sub_contents .sub_top{padding: 0px;} .meet_wrapper .top_banner{margin-top:20px; background: url("/images/meet_sbanner.jpg");} /* .meet_wrapper .bg_diff span:nth-child(2n) a:hover{background: #224779; border-color: #224779;} .meet_wrapper .bg_diff span a:hover{background: #456fa7; border-color: #456fa7;} */ .meet_wrapper .section_inner .project_section > a:hover{border-color: rgba(34, 71, 121, 0.29)} .meet_wrapper .section_inner .project_section:nth-child(4n){margin-right: 0;} .meet_wrapper .progress-inner .camp_info{height: 80px; overflow: hidden; padding-top:0px; padding-bottom:5px;} .meet_wrapper .progress-inner .cate_div_in{margin-bottom: 3px; margin-top:3px; text-align: left; padding: 0px;} .meet_wrapper .progress-inner .cate_div_in span:first-child {font-size: 0.9em; color: #186ebd; padding-left: 0px;} .meet_wrapper .progress-inner h3.dot_txt{letter-spacing: 0px; font-weight: 600; font-size:1.14em; text-align: justify; word-break: break-all !important;} .meet_wrapper .progress-inner .perc li{margin-bottom: 10px; font-size: 0.9em;} .meet_wrapper .progress-inner .perc li span{color: #237eb7;} .meet_wrapper .progress-inner input.entry_meey_input{margin: 0px 15px 10px 15px; width: calc(100% - 30px); text-align: center; padding: 8px 10px; font-size: 0.9em; background: #357dab; color: #fff; display: none;} .meet_wrapper .section_inner .project_section > a > span{min-height: inherit;} .section_inner .project_section > a .img_box{position: relative; width: 100%; aspect-ratio: 3/2; padding-bottom: 56%; overflow: hidden;transition: 0.3s ease; border: 1px solid #e4e4e4; border-radius: 4px;} .section_inner .project_section > a .img_box:hover{border-radius: 5px} .section_inner .project_section > a .img_box:before{content: ""; display: block; padding-top:100%;} .section_inner .project_section > a .img_box::before{content: ""; display: block; padding-top:100%;} .section_inner .project_section > a .img_box span.child{position: absolute; top:0; left: 0; right: 0; bottom:0; background-size: cover; background-repeat: no-repeat; background-position: center; border-radius: 3px; overflow: hidden; transition: transform 0.2s ease 0.1s} .section_inner .project_section a .img_box:hover span.child{transform: scale(1.05);transition: 0.3s ease} .meet_wrapper .progress-inner .progerss_bottom{border-top: 1px dotted #eee; padding-top:5px;} .meet_wrapper .sub_contents .more_button .more_btn a:hover{border-color:#004b7c; background: #004b7c; font-weight: 600;} @media screen and (max-width: 749px){ .meet_wrapper #slider_wrapper{ margin-top: 1px;} } @media screen and (max-width: 1100px){ .meet_wrapper .section_inner .project_section:nth-child(4n){margin-right: 15px;} .meet_wrapper .section_inner .project_section:nth-child(3n){margin-right: 0;} .bg_diff span a img{width: 90%;} } @media screen and (max-width: 786px){ .meet_wrapper .section_inner .project_section:nth-child(3n){margin-right: 15px;} .meet_wrapper .section_inner .project_section:nth-child(2n){margin-right: 0;} .section_inner .project_section > a .img_box{padding: unset;} .bg_diff span a img{width: 90%;} .bg_diff .cate-carousel .flickity-prev-next-button{ top: 45px; } } @media screen and (max-width: 540px){ .section_inner .project_section > a .img_box{width:165px; height:120px; display:block; float:left; padding: unset;} .section_inner .project_section > a .img_box:before{padding-top:0; height: 0; height: 100%\0} .section_inner .project_section > a .img_box::before{padding-top:0;} .section_inner .project_section > a .img_box span.child{display:block; height:100%;} .bg_diff .cate-carousel .flickity-prev-next-button{ top: 50px; } } /* 오픈예정,파트너스 */ .mark{position:absolute; top:0; left:0; padding:5px 10px; background-color:#b72932; color:#fff; border-radius:0 0 7px 0; font-size:0.9em;} /* 모임 상세 페이지 meet_detail.jsp */ .sub_contents.detail_wrap.meeting_wrapper{background: #fff; padding-bottom: 30px; border: 1px solid #f1f1f1;} .meet_top > h2{text-align: center; padding: 50px 0px} .meet_top > h2 span{display: block; font-size: 0.5em; margin-bottom: 20px;} .meet_top > h2 span b{font-weight: normal; border: 1px solid #224779; background: #224779; padding:4px 10px; border-radius: 5px; color: #fff;} .meeting_main_top {padding-top:50px; margin-bottom: 50px;} .meeting_main_top > div{float: left; width: 50%} .meeting_main_top .meet_main_img{padding: 0px 50px 0 0; position: relative;} .meeting_main_top .meet_main_img img{width: 100%; height: auto; border: 1px solid #eaeaea; padding: 10px;} /* .meeting_main_top .meet_main_img img{width: 335px; height: auto; border: 12px solid #eaeaea; position: absolute; top: 120px; left: 95px; box-shadow: -10px 7px 16px #525252ad; -ms-box-shadow: -10px 7px 16px #525252ad; -moz-box-shadow: -10px 7px 16px #525252ad; -webkit-box-shadow: -10px 7px 16px #525252ad; -o-box-shadow: -10px 7px 16px #525252ad; z-index: 2;} */ .meeting_main_top .meet_main_img > span{position: absolute; background: #212121; color: #fff; top: 50px; left: 30px; width: 95px; height: 95px; padding: 25px; font-size: 1.1em; line-height: 1.5em;} .meeting_main_top .meet_main_img .blue_bg{position: absolute; width: 250px; height: 390px; background: #224779; right: 90px; top: 93px;} .meeting_main_top .meeting_info_wrap{padding: 20px 0px; padding-bottom: 50px;} .meeting_main_top .meeting_info_wrap > h2{line-height: 1.4em; font-size: 1.8em; margin-top: 10px; margin-bottom: 20px; min-height: 58px;} .meeting_main_top .meeting_info_wrap .cate_div span{border: 1px solid #ccc; padding: 1px 12px; margin-right: 10px; float: left; font-size: 0.8em;} .meeting_main_top .meeting_info_wrap .cate_div span.span01{border-color: #224779; color: #224779;} .meeting_main_top .meeting_info_wrap .cate_div span.span02{background: #224779; color: #fff;} .meeting_main_top .meeting_info_wrap .cate_div span.span03{background: #fff; color: #d06300; border-color:#d06300} .meeting_main_top .meeting_info_wrap .cate_div span.span04{background: #848484; color: #fff;} .meeting_main_top .meeting_info_wrap .cate_div span.span05{background: #d4631b; color: #fff; border-color:#d4631b} .meeting_main_top .meeting_info_wrap .meeting_info{} .meeting_main_top .meeting_info_wrap .meeting_info01{padding: 5px 0px; height: 125px; margin-bottom: 30px;} .meeting_main_top .meeting_info_wrap .meeting_info02{border: 1px solid #ccc; padding: 20px 30px; margin-top: 11px; background: #fcfcfe;} .meeting_main_top .meeting_info_wrap .meeting_info01 p{margin-bottom: 20px; font-weight: 600; font-size: 1.1em; line-height: 1.5em;} .meeting_main_top .meeting_info_wrap .meeting_info01 p:last-child{margin-bottom: 0px;} .meeting_main_top .meeting_info_wrap .meeting_info01 p span{font-weight: normal; float: left; width: 86px; border-left: 2px solid #224779; padding-left: 10px; font-weight: 600; color: #585858; line-height: 1em; margin: 3px 0px; font-size: 1.2em} .meeting_main_top .meeting_info_wrap .meeting_info01 p b{float: right; width: calc(100% - 90px); font-size:1.2em;} .meeting_main_top .meeting_info_wrap .meeting_info01 p b.impact{font-size: 1.2em; color: #2a78bf} .meeting_main_top .meeting_info_wrap .meeting_info01 p a.go_map{border: 1px solid #ccc; margin-left: 10px; font-size: 0.7em; padding: 3px 5px;} .meeting_main_top .meeting_info_wrap .meeting_info02 p{margin-bottom: 20px; font-weight: 600; position: relative; font-size: 1.2em;} .meeting_main_top .meeting_info_wrap .meeting_info02 p:last-child{margin-bottom: 0px} .meet_wrapper .sub_section.campaign_info{padding-top:0px; background: #fcfcfe;} .meet_wrapper div.top_right .right_wrap .company_info .company_wrap{border-top: 2px solid #234679; background: #fff;} .meet_wrapper div.top_right .right_wrap .share_wrap{ background: #fff;} .meet_wrapper .entry_btn, .meet_wrapper .entry_btn p, .meet_wrapper .entry_btn p input{height: 100%; width:100%;} .meet_wrapper .entry_btn p input{background: #224779; color: #fff; letter-spacing: 2px; font-size: 1.2em; border-color:#224779; height: 70px; font-weight: 600;} .meet_wrapper #blog-header-container{position: static;} .meet_wrapper #menu-container{position: static; display: block !important; padding-top:0;} .meet_wrapper #menu-container.fixed{position: fixed;} .meet_wrapper .tabs-menu li a{display: block;} .meet_wrapper .tabs-menu .active-tab{border-bottom: 1px solid #224779} .meet_wrapper .tabs-menu .active-tab span{color: #224779} .meet_wrapper #menu-container.fixed .tabs-menu li.active-tab{border-top:1px solid #224779} .meet_wrapper .top_left #contents{padding: 20px 0px; border-bottom: 1px solid #ccc; margin-bottom: 30px;} .meet_wrapper .top_left #contents img{max-width: 100%;} #info-container { -webkit-transition: padding-left 200ms linear; -moz-transition: padding-left 200ms linear; -ms-transition: padding-left 200ms linear; -o-transition: padding-left 200ms linear; transition: padding-left 200ms linear; display: none; } #info-container.fixed { opacity: 1; position: fixed; display: block; z-index: 99; padding-top:0px; background: #fff; width: 340px; } #info-container .menu-item { font-size: 1.4em; font-weight: bold; color: #fff; } #info-container .menu-icon { display: block !important; position: absolute; left: -50px; top: 14px; font-size: 1.6em; font-weight: bold; color: #fff; -webkit-transition: left 300ms linear; -moz-transition: left 300ms linear; -ms-transition: left 300ms linear; -o-transition: left 300ms linear; transition: left 300ms linear; } #info-container .menu-icon.on { left: 15px; } .meet_wrapper .share_inner .meeting_info_wrap > h2{line-height: 1.5em; font-size: 1.3em; margin-top: 10px; margin-bottom: 10px; min-height: 50px;} .meet_wrapper .share_inner .meeting_info_wrap .cate_div{margin-top:10px; margin-bottom: 15px;} .meet_wrapper .share_inner .meeting_info_wrap .cate_div span{border: 1px solid #ccc; padding: 1px 8px; margin-right: 5px; float: left; font-size:0.8em;} .meet_wrapper .share_inner .meeting_info_wrap .cate_div span.span01{border-color: #224779; color: #224779;} .meet_wrapper .share_inner .meeting_info_wrap .cate_div span.span02{background: #224779; color: #fff;} .meet_wrapper .share_inner .meeting_info_wrap .cate_div span.span03{background: #fff; color: #d06300; border-color:#d06300} .meet_wrapper .share_inner .meeting_info_wrap .cate_div span.span04{background: #848484; color: #fff;} .meet_wrapper .share_inner .meeting_info_wrap .cate_div span.span05{background: #d4631b; color: #fff; border-color:#d4631b} .meet_wrapper .share_inner .meeting_info_wrap .meeting_info{} .meet_wrapper .share_inner .meeting_info_wrap .meeting_info01{padding: 10px; border: 1px solid #ccc; background: #f7f7fb;} .meet_wrapper .share_inner .meeting_info_wrap .meeting_info02{border: 1px solid #ccc; padding: 20px 30px; margin-top: 11px; background: #fcfcfe;} .meet_wrapper .share_inner .meeting_info_wrap .meeting_info01 p{margin-bottom: 15px; line-height: 1.5em; padding: 0px 5px;} .meet_wrapper .share_inner .meeting_info_wrap .meeting_info01 p:last-child{margin-bottom: 0px;} .meet_wrapper .share_inner .meeting_info_wrap .meeting_info01 p:first-child b{font-weight: 600; color: #000} .meet_wrapper .share_inner .meeting_info_wrap .meeting_info01 p span{font-weight: normal; float: left; border-left: 0px solid #224779; padding-left: 0px; font-weight: 600; color: #7b7b7b; line-height: 1em; margin: 3px 0px;} .meet_wrapper .share_inner .meeting_info_wrap .meeting_info01 p b{width:100%; font-weight: 500; word-break: break-all} .meet_wrapper .share_inner .meeting_info_wrap .meeting_info01 p b.impact{font-size: 1.2em; color: #2a78bf} .meet_wrapper .share_inner .meeting_info_wrap .meeting_info01 p:last-child b{margin-left: 10px} .meet_wrapper .share_inner .meeting_info_wrap .meeting_info01 p a.go_map{border: 1px solid #ccc; margin-left: 10px; font-size: 0.7em; padding: 3px 5px; background: #fff;} .meet_wrapper .share_inner .meeting_info_wrap .meeting_info02 p{margin-bottom: 10px; font-weight: 600; position: relative;} .meet_wrapper .share_inner .meeting_info_wrap .meeting_info02 p:last-child{margin-bottom: 0px} .meet_wrapper div.top_right .right_wrap .share_wrap .share_inner .share_box .share_btn{padding:0px 10px; margin-top:0px; border:0px;} .meet_wrapper .on_barcode_banner{margin-top:10px;} .meet_wrapper .on_barcode_banner a{width: 100%; display: block;} .meet_wrapper .on_barcode_banner a img{width: 100%; border: 1px solid #ccc;} .meet_wrapper .share_box.meet_share > p{font-weight: normal; width: 100%; border-left: 2px solid #224779; padding-left: 10px; font-weight: 600; color: #7b7b7b; line-height: 1em; margin: 3px 0px; display: none;} .meet_wrapper div.top_right .right_wrap .share_wrap .share_inner .share_box.meet_share p{line-height: 1em; margin-bottom: 0px; margin-left: 0px;} .meet_wrapper div.top_right .right_wrap .share_wrap .share_inner .share_box.meet_share .share_btn{margin-top:0px; padding:0px; text-align: right;} .meet_wrapper div.top_right .right_wrap .share_wrap .share_inner .share_box.meet_share .share_btn a img{width: 40px;} .meet_wrapper .contents_div_footer{margin-bottom: 10px;} .meet_wrapper .contents_div_footer > ul.detail_notice01{background: #fff; border: 1px solid #234679; } .meet_wrapper .contents_div_footer > ul > li > p.title{border-color: #234679;} /*지도*/ .meet_wrapper #meeting_map{margin-bottom: 40px;} .meet_wrapper #meeting_map h3{letter-spacing: 1px; margin-bottom: 10px; font-size: 1.3em; font-weight: 600;} .meet_wrapper #meeting_map #map{border: 1px solid #234679} .meet_wrapper #meeting_map .map_address{border: 1px solid #234679; background: #234679; color: #fff; padding: 5px 15px;} /*모임댓글*/ .meet_wrapper #meeting_reply{margin-bottom: 40px;} .meet_wrapper #meeting_reply h3{letter-spacing: 1px; margin-bottom: 10px; font-size: 1.3em; font-weight: 600;} .meet_wrapper #meeting_reply .comment_form{padding: 15px 10px;} .meet_wrapper #meeting_reply .comment_form textarea {padding: 10px; float: left; width: calc(100% - 100px); border: 1px solid #ccc;} .meet_wrapper #meeting_reply .comment_form input{float: right; width: 90px; height: 58px; font-size: 0.9em;} .meet_wrapper #meeting_reply .replyList{padding: 15px 10px;} .meet_wrapper #meeting_reply .replyList .comment{padding: 10px; border-top:1px solid #ccc;} /* .meet_wrapper #meeting_reply .replyList .comment:last-child{border-bottom: 1px solid #ccc;} */ .meet_wrapper #meeting_reply .replyList .comment .comment_contents{position: relative;} .meet_wrapper #meeting_reply .replyList .comment .comment_contents > p.reply_name{font-weight: 600; color: #000;} .meet_wrapper #meeting_reply .replyList .comment .comment_contents > p > span{display: inline-block; margin-left: 20px; font-size: 0.9em; color: #545454; font-weight: 500;} .meet_wrapper #meeting_reply .replyList .comment .comment_contents .reply_text{padding: 5px; margin-top: 5px;} .meet_wrapper #meeting_reply .replyList .comment .comment_contents .reply_btn{position: absolute; top: 0px; right: 0px; font-size: 0.8em; font-weight: 600; cursor: pointer;} .meet_wrapper #meeting_reply .replyList .comment .comment_contents .reply_reply{background: #fafaff; border: 1px solid #c9cfd8; margin-top:10px;} .meet_wrapper #meeting_reply .replyList .comment .comment_contents .reply_reply li{padding: 10px; border-top: 1px dotted #c9cfd8;} .meet_wrapper #meeting_reply .replyList .comment .comment_contents .reply_reply li:first-child{border-top: 0;} .meet_wrapper #meeting_reply .replyList .comment .comment_contents .reply_reply li.reply_child p.reply_name{font-weight: 600; color: #000;} .meet_wrapper #meeting_reply .replyList .comment .comment_contents .reply_reply li.reply_child p > span{display: inline-block; margin-left: 20px; font-size: 0.9em; color: #545454; font-weight: 500;} .meet_wrapper #meeting_reply .replyList .comment .comment_contents .reply_reply li.created_reply textarea{padding: 10px; float: left; width: calc(100% - 100px); border: 1px solid #ccc;} .meet_wrapper #meeting_reply .replyList .comment .comment_contents .reply_reply li.created_reply input{float: right; width: 90px; height: 58px; font-size: 0.9em;} .meet_wrapper #meeting_reply .replyList .comment .comment_contents .reply_reply li.created_reply{display: none; border-top: 1px dotted #c9cfd8} .meet_wrapper #meeting_reply .replyList .comment .comment_contents .reply_reply li.created_reply.show{display: block;} .meet_wrapper #meeting_reply .replyList .comment .comment_contents .reply_btn.act{color: #234679; text-decoration: underline;} .meet_wrapper #meeting_reply .replyList .comment{position: relative;} .meet_wrapper #meeting_reply .replyList .comment .created_reply{display: none;} .meet_wrapper #meeting_reply .replyList .comment .created_reply.show{display: block;} .meet_wrapper #meeting_reply .replyList .comment .reply_name{font-weight: 600; color: #000} .meet_wrapper #meeting_reply .replyList .comment .reply_name span{display: inline-block; margin-left: 20px; font-size: 0.9em; color: #545454; font-weight: 500;} .meet_wrapper #meeting_reply .replyList .comment .reply_text{padding: 5px; margin-top:5px;} .meet_wrapper #meeting_reply .replyList .comment .reply_btn{cursor: pointer; position: absolute; top: 10px; right: 10px; font-size: 0.8em; font-weight: 600; color: #234679;} .meet_wrapper #meeting_reply .replyList .comment .reply_btn.act{color: #234679; text-decoration: underline;} .meet_wrapper #meeting_reply .replyList .comment .btnList{position: absolute; top: 10px; right: 40px; font-size: 0.8em; font-weight: 600;} .meet_wrapper #meeting_reply .replyList .comment .btnList a{margin-left: 5px;} .meet_wrapper #meeting_reply .replyList .created_reply{padding-top: 10px; margin-top: 10px; border-top: 1px dotted #ccc;} .meet_wrapper #meeting_reply .replyList .add_reply textarea{padding: 10px; float: left; width: calc(100% - 100px); border: 1px solid #ccc;} .meet_wrapper #meeting_reply .replyList .add_reply input[type="submit"]{float: right; width: 90px; height: 58px; font-size: 0.9em;} /* 대댓글 */ .meet_wrapper #meeting_reply .replyList.act{padding: 0px;} .meet_wrapper #meeting_reply .replyList.act .comment{background: #fafaff; border: 1px solid #c9cfd8; border-top: 1px dotted #c9cfd8; margin: 0px 20px;} .meet_wrapper #meeting_reply .replyList.act:last-child{} @media screen and (max-width: 1100px){ .meet_wrapper .wrap_1100{padding-left:20px; padding-right: 20px;} #blog-info-container{display: none;} .meet_wrapper .sub_contents.detail_wrap .sub_section h2{font-size: 1.5em;} .meeting_main_top .meet_main_img img{ top: 140px;} .meeting_main_top .meet_main_img .blue_bg{right: 15%;} .meet_wrapper #menu-container div.top_left, .meet_wrapper #menu-container div.top_right{float: left;} .meet_wrapper #menu-container div.top_left{width: 75%} .meet_wrapper #menu-container div.top_right{width: 25%} .meet_wrapper div.top_right .right_wrap .right_section{} .meet_wrapper .on_barcode_banner{float: left; width: 49.4%; margin-left: 0.2%; margin-top: 6px;} } @media screen and (max-width: 1000px){ .meeting_main_top .meet_main_img .blue_bg{right: 5%;} } @media screen and (max-width: 920px){ .meeting_main_top .meet_main_img, .meeting_main_top .meeting_info_wrap{float: none; width: 100%;} .meeting_main_top .meet_main_img{width: 400px; margin: 0 auto; padding:0; text-align: center; margin-bottom: 60px;} .meeting_main_top .meeting_info_wrap{padding:0px;} .meeting_main_top .meet_main_img > span{top:10px; left: 0px;} .meeting_main_top .meet_main_img img{width: 300px; top: 60px; left: 50%;} .meeting_main_top .meet_main_img .blue_bg{right: 7px; top: 17px} .meet_wrapper div.top_right .right_wrap .company_info .company_wrap{height: auto;} .meet_wrapper div.top_right .right_wrap .share_wrap .share_inner .share_box .share_btn a img{width: 45px;} .meet_wrapper .on_barcode_banner{margin-top:0px; margin-bottom: 20px;} } @media screen and (max-width: 749px){ .meeting_main_top .meet_main_img{width: 100%; margin: 0 auto; margin-bottom: 50px;} } @media screen and (max-width: 425px){ .meet_wrapper div.top_right .right_wrap .right_section{margin: 0px; width: 100%;} .meet_wrapper .on_barcode_banner{float: none; width: 100%;} } /* 미팅 참가 페이지 */ .meeting_map_modal{display: none; padding-bottom: 40px;} .meeting_map_modal .map_address{ background: #234679; color: #fff; padding: 5px 15px;} .entry_info_wrap{padding: 40px 0px; background: #fcfcfe; border-top:1px solid #a3b1c5; border-bottom: 1px solid #a3b1c5;} .entry_info_wrap h3.title{font-size: 1.5em; padding-left: 15px; border-left:3px solid #234679;} .entry_info_wrap div > div{margin-top:30px;} .entry_info_wrap div > div > h3{font-size: 1.4em; letter-spacing: 2px;} .entry_info_wrap div > div > ul{border: 1px solid #ccc; margin-top: 10px; background: #fff;} .entry_info_wrap div > div > ul li{width: calc(100% / 2 - 1px); float: left; border-left: 1px solid #ccc; border-bottom: 1px solid #ccc; overflow: hidden;} .entry_info_wrap div > div > ul li:nth-child(odd){border-left: 0px;} .entry_info_wrap div > div > ul li:last-child{border-bottom: 0px;} .entry_info_wrap div > div > ul li.full100{width: 100%;} .entry_info_wrap div > div > ul li > span{width: 120px; float: left; background: #f7f7f7; border-right: 1px solid #ccc; padding: 20px; letter-spacing: 1px; color: #333;} .entry_info_wrap div > div > ul li > p{width: calc(100% - 120px); float: left; padding: 17px;} .entry_info_wrap div > div > ul li > p input{width: 100%;} .entry_info_wrap div > div > ul li.full100 > p{padding:15px 17px} .entry_info_wrap div > div > ul li > p.yack_p{padding: 11px 17px;} .entry_info_wrap div > div > ul li input.yack_chek{width: auto; margin-right: 10px;} .entry_info_wrap div > div > ul li small{display: block; margin-left: 22px; line-height: 1.2em; margin-top:5px;} .entry_info_wrap div > div > ul li > p.yack_p a{font-size: 0.5em; padding: 2px 6px; border: 1px solid #ccc; margin-left: 3px;} .entry_info_wrap div > div > ul li.yack_wrap{padding: 20px 30px; border: 0px; background: #f7f7fb; display: none; border-top: 1px solid #ccc;} .entry_info_wrap div > div > ul li.yack_wrap h4{padding-bottom: 10px; font-weight: 600; font-size: 1.1em} .entry_info_wrap div > div > ul li.yack_wrap .yack_box{border: 1px solid #ccc; padding: 15px 20px; background: #fff;} .entry_info_wrap div > div > ul li.yack_wrap .yack_box p{margin-bottom: 10px;} .entry_info_wrap div > div > ul li.none_border{border-bottom:0px;} .entry_info_wrap .entry_submit{margin-top: 20px; text-align: center;} .entry_info_wrap .entry_submit input{padding: 15px 50px; margin: 0px 5px; letter-spacing: 2px;} .entry_info_wrap .entry_submit input.submit_btn{background: #234679; border: 1px solid #234679; color: #fff;} @media screen and (max-width: 920px){ .meeting_main_top .meeting_info_wrap.entry_meetinfo{padding: 20px 0px;} } @media screen and (max-width: 749px){ .entry_info_wrap div > div > ul li{float: none; width: 100%; border-left: 0;} .entry_info_wrap div > div > ul li.full100 > p{padding: 13px 17px;} .entry_info_wrap div > div > ul li > p.yack_p{padding: 5px 17px;} .entry_info_wrap div > div > ul li.yack_wrap{padding: 20px;} } /* 모임 신청 완료 페이지 */ #entry_complete{margin-top: 120px;} .wrap_800.entry_info_wrap{background: #fff;} .meet_wrapper .reward_order_wrap .reward_comp_title{border-left: 3px solid #224779} .meet_wrapper .reward_order_wrap .order_list_wrap{border: 1px solid #224779} .order_list_wrap.entry_info_wrap{padding:0px;} .entry_info_wrap div > .order_list_wrap.entry_info_wrap > ul{margin: 0; border: 0;} .entry_info_wrap div > .order_list_wrap.entry_info_wrap .nice_value{margin: 0; border-top: 1px solid #ccc;} .wrap_800.entry_info_wrap div > div > ul li > p{padding: 20px 17px;} .meet_wrapper .reward_order_wrap .order_list_wrap .nice_value p{width: 100%; font-size: 0.9em;} .meet_wrapper .reward_order_wrap .order_list_wrap .nice_value p b{color: #5887c5} .meet_wrapper .entry_info_wrap div > div > h3{font-size: 1.3em; letter-spacing: 0;} .meet_wrapper .reward_notice.reward_order_wrap{padding:0px;} .meet_wrapper .reward_notice.reward_order_wrap .go_mpage p a{background: #224779} .meet_wrapper .reward_notice.reward_order_wrap .go_mpage{margin-top:0px; border: 1px solid #ccc;} @media screen and (max-width: 800px){ .wrap_800 {/*width: 95%;*/ margin: 0 auto;} .mw400 { max-width: none; } } @media screen and (max-width: 750px){ #entry_complete{margin-top: -1px;} } .progress-inner .title_div{/* display: table; */width: 100%;} .progress-inner .title_div h3.dot_txt{/* display: table-cell; vertical-align: middle; */ text-align: left;} .progress-inner .title_wrap{height: 42px; overflow: hidden;} span.creator{font-size: 1em; display: block; margin-top: 13px; color: #949494;} p.creator{font-size: 1em; display: block; margin-top: 13px; color: #949494;} /*사전 예약*/ .reser_wrap div.top_right .right_wrap .company_info .company_wrap .company_inner h4{margin-bottom: 0px;} .reser_wrap .top_header > img{width: 100%;} .reser_wrap .top_left{padding: 10px 7px;} .reser_wrap .top_left .top_header_info{margin-top: 15px;} .reser_wrap .top_left .top_header_info h2{font-size: 1.6em; line-height: 1.6em;} .reser_wrap div.top_right .right_wrap .share_wrap .right_opner{margin-bottom: 10px;} .reser_wrap div.top_right .right_wrap .share_wrap .company_info{padding: 0; padding-bottom: 10px; } .reser_wrap div.top_right .right_wrap .share_wrap{padding-top:0;:} #share-container2{margin-top:10px;} .reser_wrap .reser_contents{padding-bottom: 100px; padding-top:40px; margin-top: 50px; border-top: 1px dotted #ccc;} .reser_wrap .user_infomation{display: none;} .reser_wrap div.top_right .right_wrap .right_opner .reward_entry{color: #fff; background: #b72932; border: 1px solid #b72932;} #reser_body #modal4{padding: 0px} #reser_body #modal4 h2{padding: 10px 20px; font-size: 1.3em; color: #fff; background: #dd5e55;} #reser_body #modal4 h2 span{float: right; cursor: pointer;} #reser_body #modal4 .modal_wrap{padding: 10px 20px; margin-top:10px;} #reser_body #modal4 .modal_wrap .modal-title{margin-bottom: 10px; font-size: 1.1em; font-weight: 600; border-left:3px solid #dd5d55; padding-left: 10px; line-height: 1em; } #reser_body #modal4 .modal_wrap .modal_input{margin-top: 10px;} #reser_body #modal4 .modal_wrap .modal_input p span{font-size: 0.9em; margin-left: 5px; text-align: center; padding: 9px 15px;} .openMore > div { width: calc((100% - 20px)/3); margin-right: 20px; } .openMore > div:nth-child(3) { margin-right: 0;} @media screen and (max-width: 1100px){ #reser_body .top_right{display: none;} .reser_wrap .user_infomation{display: block; padding: 20px 0px; border: 1px solid #eee; border-left: 0; border-right: 0; margin-top:30px;} .reser_wrap .top_left{padding: 10px 100px;} .share_inner .share_click{cursor:pointer; position: relative;} /* .share_inner .share_box{display: none;} */ .share_inner .share_box.active{display: block; width: 300px; position: absolute; right: 0; top: 55px; background: #fff; border: 1px solid #ccc; padding: 20px; box-shadow: 5px 5px 5px #bfbfbf; -webkit-box-shadow: 5px 5px 5px #bfbfbf; -moz-box-shadow: 5px 5px 5px #bfbfbf; -ms-box-shadow: 5px 5px 5px #bfbfbf; -o-box-shadow: 5px 5px 5px #bfbfbf;} .share_inner .share_box.active p:first-child{font-size: 1.1em; margin-bottom: 10px; padding-left: 10px; border-left:2px solid #b72932; line-height: 1em;} .share_inner .share_box.active p:last-child{margin-bottom: 20px;} .share_inner .share_box.active .share_btn{margin-top:20px;} .share_inner .share_box.active .share_btn a{float: left; width: 63px; margin-right: 5px;} .user_infomation > div{float: left;} .user_infomation .info01{width: calc(100% - 250px)} .user_infomation .info01 h4{padding-left: 20px; border-left: 3px solid #b72932; margin: 14px 10px;} .user_infomation .user_entry{width: 200px} .user_infomation .user_entry p{text-align: left;} .user_infomation .user_entry p input{width: 95%; display: inline-block; margin: 0 auto; padding: 15px; color: #333; background: #f3f3f3; border: 1px solid #cecece} .user_infomation .user_entry p input.reward_entry{background:#b72932; border: 1px solid #b72932; color: #fff;} .user_infomation .share_inner{width: 50px; position: relative;} .share_inner .share_click span{text-align: center; border: 1px solid #b72932; padding: 12px; display: block; width: 100%; font-size: 0.9em; color: #b72932; } .reser_wrap .reser_contents{border-top:0; margin-top:0; padding-top:0;} #share-container3.fixed{width: 100%; left: 0;} #share-container3.fixed .user_infomation{margin: 0; padding: 10px 100px;} #share-container3.fixed .share_inner .share_box.active{top:-195px;} .bg_diff span{width:calc(100% / 8) !important; } .bg_diff span a{padding: 5px 0px;} .openMore > div { width: 100%; margin-right:0; margin-bottom: 20px; } .space { margin-bottom: 850px; } } @media screen and (max-width: 749px){ .reser_wrap .top_left{padding: 10px 10px;} #share-container3.fixed .user_infomation{margin: 0; padding: 10px 10px;} .bg_diff span{width:calc(100% / 6) !important; } .bg_diff span a{padding: 10px 0px; color: #333;} .bg_diff span a img{opacity: 1;} .space { margin-bottom: 0; } } @media screen and (max-width: 560px){ .user_infomation .user_entry{width: 150px;} .user_infomation .info01{width:calc(100% - 200px);} .bg_diff span{width:calc(100% / 4) !important; } .bg_diff span a{padding: 10px 0px; color: #333;} .bg_diff span a img{opacity: 1; width: 90%; margin-bottom: 10px;} } /* 캠페인등록하기 */ .makeContent { width: calc((100% - 60px)/4) ; margin-right: 20px; position: relative; /*border:1px solid #f0f0f0;*/ padding-bottom: 60px; height: 500px;} .makeContent:last-child {margin-right: 0;} .mcTxt{padding:20px 10px;} /*.mcTxt a { position: absolute; left: 50%; bottom: 20px; transform: translateX(-50%);}*/ .compaginTop {height: 300px; background-color: #000; color: #fff; padding: 90px 0; } .compaginTop h2 { font-size: 1.562rem;} .compaginTop p {padding-top: 20px; font-size: 0.875rem;} .compaginTop a{color:#c9c6c6; margin-top: 15px; display:block} .camp_open_tit{} .camp_open_tit h2{font-size:1.5em} .camp_open_tit p{font-size:1em; color:#7d7d7d} @media screen and (max-width: 1100px) { .makeWrap { display: flex; flex-wrap: wrap; } .makeContent{ width: calc((100% - 20px)/2) ; } .makeContent:nth-child(1), .makeContent:nth-child(2) { margin-bottom: 20px;} .makeContent:nth-child(2), .makeContent:nth-child(4) {margin-right: 0;} } @media screen and (max-width : 768px) { .makeWrap { display: block } .makeContent{ width: 100%; margin-bottom: 20px;} .makeContent:last-child { margin-bottom: 0;} } /* 카테고리 */ .categoryWrap .flickity-viewport { height: 150px !important;} .mobileListV { display: none; background-repeat: no-repeat; } @media screen and (max-width: 768px) { .listHead { margin-top: 0 !important; } .listTypeM { width: 33% !important; } /*.listTypeM a { display: flex !important; }*/ /*.listTypeM .img_box { width: 150px; height: 100px !important; }*/ .listTypeM .beforeLine { display: none} /*.listTypeM .progress-inner { width: calc(100% - 150px); padding-left: 10px; }*/ .listTypeM .campaign small { margin-top: 5px !important;} .listTypeM .campaign b {-webkit-line-clamp: 1; height: auto; margin-bottom: 15px !important;} .galleryTypeM { width: calc((100% - 20px)/2) !important; margin-bottom: 40px !important; position: relative; margin-right: 20px; float: left !important;} .galleryTypeM:nth-child(2n) { margin-right: 0;} .galleryTypeM:nth-child(odd) { margin-right: 20px !important;} .galleryTypeM .img_box { width: 100% !important; height: 120px !important; } .galleryTypeM .progress-inner { width: 100% !important; } .galleryTypeM .percent_bar { position: absolute} .clfHead { height: 50px !important; } .clForm { border: 1px solid #e6e6e6; width: 100%; border-radius: 4px; height: 50px !important;} .clForm .search { border-right: 1px solid #e6e6e6; display: flex !important; width: 100%; } .clForm .search input { margin-left: 0 !important; height: 100%; width: calc(100% - 30px) !important; padding: 0 10px !important;} .clForm .search a { width: 30px !important; } .clForm .search svg { height: 100%;} .clForm .search_form select { border-right: 1px solid #e6e6e6 !important; padding: 0 20px !important;} .mobileListV { display: block; width: 50px; background-size: 50%; background-position: 50%; border: none; height: 100%; } } /* 캠페인 오픈 페이지 */ @keyframes openMainVisual{ 0%{animation-timing-function:ease-in;opacity:0}5%{animation-timing-function:ease-out;opacity:1}21%{opacity:1}25%{opacity:0} } .openRegisterPT { padding: 50px 0; } .openMainTxt {} .openMainTxt h2 { font-size: 2.5rem; font-weight: 700; line-height: 1.3; font-style: normal; } .openMainTxt p { margin-top: 15px; font-weight: 400; color: #495057; letter-spacing: 0.3px; font-size: 1rem; line-height: 1.5 } .openMainTxt a { display: inline-block; font-size: 1rem; padding: 15px 30px; border-radius: 3px; background: #333; color: #fff; transition: all .3s; margin-top: 50px } .openMainTxt a span { color: #fff; font-size: 1rem; font-weight: 600; } .openMainTxt a:hover { background: #181818; box-shadow: 3px 3px 10px rgba(0,0,0,0.15) } .openMainVisual { width: 500px; height: 600px; } /*.openMainVisual li { animation: openMainVisual 16s linear infinite; height: inherit }*/ /*캠페인 오픈 애니메이션*/ .openMainVisual li:nth-child(1) {background: #ddd; background-image:url("/images/main_img/creator_bg.png"); background-size: cover; background-repeat: no-repeat } .openMainVisual li:nth-child(2) {background: #ddd} .openMainVisual li:nth-child(3) {background: #ddd} .mobileOMV { display: none;} .openRegisterPWrap { } .openRC01 { padding: 50px 0; } .openRegisterPWrap h3 { font-size: 1.562rem; font-weight: 600; padding-bottom: 15px; } .openRegisterPWrap p { font-size: 1rem; color: #6b6b6b; } .openRegisterList { margin-top: 70px; } .openRegisterList li { width: calc((100% - 60px)/4); border-radius: 15px; padding: 30px 20px; color: #282829; font-weight: 700; font-size: 1rem; border: 1px solid #f2f4f6; box-shadow: 2px 2px 15px rgba(0,0,0,0.05); margin-right: 20px; display: flex; flex-direction: column; justify-content: space-between;} .openRegisterList li:last-child { margin-right: 0} .openRegisterList li span { display: block; margin-top: 10px; font-size: 0.875rem; font-weight: 400; color: #3d3d3d; line-height: 1.5 } .openRegisterList li span:first-child { margin-top: 30px; } .openRegisterList li .underLine { line-height: 1.8; } /*.openRegisterList li .beforeUnderLine:after { content: ''; display: inline-block; height: 10px; width: 215px; background: #c72030; opacity: 0.2; position: absolute; left: -5px; top: 11px; }*/ .openRegisterList li .underLine em { font-style: normal; font-size: 0.875rem; font-weight: 400; color: #3d3d3d; line-height: 1.5 ; border-bottom: 2px solid rgba(255,35,32,0.4); } .openRegisterList li a { display: inline-flex; align-items: center; gap: 8px; margin-top: 20px; padding: 11px 18px; background: #b72932; color: #fff; border-radius: 8px; font-weight: 600; font-size: 0.875rem; text-decoration: none; transition: background 0.2s, transform 0.15s; } .openRegisterList li a:hover { background: #9e2229; } .openRegisterList li:last-child a { margin-top: 20px; } .openRegisterList li:nth-child(3) { position: static; } .openRegisterList li:nth-child(3) a { position: static; bottom: auto; } .rightArrowI { display: block; width: 18px; height: 18px; fill: #fff; flex-shrink: 0; } .openRC02 { padding: 100px 0 150px; } .openRegisterPT .openMainVisual li{width:100%; height:100%; background-image: url("../../images/cam_img/cam_slide_01.png"); background-repeat: no-repeat; background-size: 500px auto; background-position: center;} .openRC02 > ul { margin-top: 70px;} .openRC02 > ul > li > strong { font-size: 20px; line-height: 1.5; font-weight: 700; color: #292929; padding-right: 25px; width: 350px; } .orcList { width: calc(100% - 350px); } .orcList section { font-size: 1rem; font-weight: 700; color: #6d6d6d; width: 50%; } .orcList section span { width: 35px; height: 35px; display: inline-block; margin-right: 15px; background-position: center; background-size: 35px auto; background-repeat: no-repeat;} /*#f7f9fb*/ .lineTop { margin-top: 40px; padding-top: 40px; border-top: 1px solid #f2f4f6; } .orcList section .ol_icon1{background-image: url("../../images/icon_crowd.png"); } .orcList section .ol_icon2{background-image: url("../../images/icon_ondemend.png"); } .orcList section .ol_icon3{background-image: url("../../images/icon_meetup.png"); } .orcList section .ol_icon1_2{background-image: url("../../images/icon_crowd2.png");} .openRegisterBottom { background: #fcfbfb; padding: 60px 0; margin-bottom: 100px;} .openRegisterBottom > div > section { width: 40%; margin-right: 40px;} .openRegisterBottom h2 { font-size: 1.562rem; font-weight: 600; padding-bottom: 15px; line-height: 1.5; color: #292929; } .openRegisterBottom p { font-size: 1rem; line-height: 1.5; color: #6b6b6b;} .compaginProcess li { font-size: 1.062rem; color: #292929; font-weight: 400; padding-left: 30px; position: relative; line-height: 30px; margin-bottom: 15px; } .compaginProcess li:last-child { margin-bottom: 0} .compaginProcess li:nth-child(1):before { content: '1'; position: absolute; left: 0; top:50%; transform: translateY(-50%); border: 1px solid #ed1c3f; border-radius: 50%; width: 20px; height: 20px; line-height: 18px; text-align: center; color: #ed1c3f; font-size: 14px } .compaginProcess li:nth-child(2):before { content: '2'; position: absolute; left: 0; top:50%; transform: translateY(-50%); border: 1px solid #ed1c3f; border-radius: 50%; width: 20px; height: 20px; line-height: 18px; text-align: center; color: #ed1c3f; font-size: 14px } .compaginProcess li:nth-child(3):before { content: '3'; position: absolute; left: 0; top:50%; transform: translateY(-50%); border: 1px solid #ed1c3f; border-radius: 50%; width: 20px; height: 20px; line-height: 18px; text-align: center; color: #ed1c3f; font-size: 14px } .compaginProcess li:nth-child(4):before { content: '4'; position: absolute; left: 0; top:50%; transform: translateY(-50%); border: 1px solid #ed1c3f; border-radius: 50%; width: 20px; height: 20px; line-height: 18px; text-align: center; color: #ed1c3f; font-size: 14px } .compaginProcess li:nth-child(5):before { content: '5'; position: absolute; left: 0; top:50%; transform: translateY(-50%); border: 1px solid #ed1c3f; border-radius: 50%; width: 20px; height: 20px; line-height: 18px; text-align: center; color: #ed1c3f; font-size: 14px } .compaginProcess li:nth-child(6):before { content: '6'; position: absolute; left: 0; top:50%; transform: translateY(-50%); border: 1px solid #ed1c3f; border-radius: 50%; width: 20px; height: 20px; line-height: 18px; text-align: center; color: #ed1c3f; font-size: 14px } .openResigterPop { background: rgba(0,0,0,0.45) !important; position: fixed; left: 0; top: 60px; width: 100vw !important; height: 100%; border: none !important; z-index: 999 !important; } .orpTit { background: #fff; width: 350px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 65px 24px 24px; text-align: left; border-radius: 10px; } .orpTit h4 { font-size: 1.25rem; font-weight: 700; line-height: 1.5; } .orpTit p { font-size: 1rem; color: #6b6b6b; line-height: 1.5; padding: 0 !important; margin-bottom: 50px !important; } .orpTit a { } .orpTit .ing_bt { margin: 0 !important; padding: 12px 33px !important; } .orpTit .newBtn { border: 1px solid #d9d9d9; background: #fff; border-radius: 3px; color: #757575; } .orpTit .newBtn:hover {border-color: #b2b2b2; color: #4c4c4c; transition: all .3s } .orpTit .modify { border-radius: 3px; margin-left: 10px !important; color: rgba(255,255,255,0.8); transition: all .3s } .orpTit .modify:hover { background: #c72030; color: #fff; } .ing_close { position: absolute; right: 24px; top: 50px; padding: 15px; cursor: pointer; font-size: 16px; border-color: #fff;} .ing_close:before { content: ''; display: inline-block; width: 1px; height: 16px; transform: rotate(-45deg) translateY(-50%); background: #292929; position: absolute; left: 20px; top: 50%;} .ing_close:after { content: ''; display: inline-block; width: 1px; height: 16px; transform: rotate(45deg) translateY(-50%); background: #292929; position: absolute; left: 9px; top: 50%;} @media screen and (max-width: 1024px) { .openRegisterList { display: block} .openRegisterList li { width: 100%; margin-right: 0; margin-bottom: 30px; } .openRegisterList li:nth-child(3) a { position: initial; } .openRegisterList li:last-child { margin-bottom: 0} .openRegisterList li span br { display: none; } } @media screen and (max-width: 920px) { .openMainVisual { width: 300px; height: 400px;} } @media screen and (max-width: 768px) { .mobileOMV { display: block; width: 100vw; height: 400px; } .pcOMV { display: none; } .openRC02 { padding: 50px 0 70px} .openRC02 > ul { margin-top: 40px} .openRC02 > ul > li { display: block;} .orcList { width: 100%; margin-top: 30px; } .openRegisterList { margin-top: 40px} .openRegisterBottom > div { display: block} .openRegisterBottom > div section { width: 100%; margin-bottom: 30px; } } .ctPostion {position: fixed; top:0; left: 0; z-index: 999; background: #fff; width: 100%; padding-top: 20px !important; } .ctPostion h2 {display: none; } /* 캠페인 신청 */ .openWrap { background: #fff; box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.04), 0px 1px 0px rgba(0, 0, 0, 0.02); color: #292929; position: fixed; top: 0; left: 0; width: 100vw; z-index: 99; font-size: 0.875rem} .backSite { padding: 10px 20px 10px 0; font-weight: 600} .backIcon { transform: scale(1) rotate(180deg); margin-right: 5px; width: 15px; display: inline-block; } .openWrap p { font-weight: 700; } .openWrap .owBtnl li a { display: inline-block; padding: 5px 20px; border: 1px solid #d9d9d9; color: #4c4c4c; transition: all .3s; border-radius: 3px } .openWrap .owBtn li a:hover {border-color: #b2b2b2; color: #4c4c4c; transition: all .3s } .openWrap .owBtn li button { padding: 5px 20px; background: #333; transition: all .3s; border-radius: 3px; border-color: #333; color: #fff; margin-left: 15px; } .openWrap .owBtn li button:hover { background: #181818; border-color: #181818; } .openWrap .owList { margin-bottom: 0} .opwTit { font-weight: 700; padding: 40px 0 20px; font-size: 30px; height: 40px; } .owList { margin-bottom: 0 !important;} .compaginWriteW { padding: 50px 0 150px; position: relative} .cwwInfo { position: relative} .writeLeft { width: 850px; } .writeLeft .choice_wrap { margin-top: 20px; } .writeLeft .checkbox_wrap{margin-bottom: 10px; align-items: center;} .writeLeft .checkbox_wrap button{ margin-right: 10px; border-radius: 4px; padding: 4px; } .writeLeft .checkbox_wrap > input{margin-right: 10px;} .writeLeft .checkbox_wrap > p{text-decoration: underline; cursor: pointer;} .writeLeft .checkbox_wrap > input[type="radio"]{display: none;} .writeLeft .checkbox_wrap label{margin-right: 20px;} .writeLeft .checkbox_wrap label .position_left{margin-left: 30px;} .writeLeft .checkbox_wrap > label span{ display: inline-block; vertical-align: middle; color: #6d6d6d; margin: 0 10px 0 0; } #schAppend .checkbox_wrap label input[type="checkbox"]{display: none;} #schAppend .checkbox_wrap label input[type="checkbox"] + span.schAppend_icon{position:relative; display: inline-block; width: 25px; height: 25px;} #schAppend .checkbox_wrap label input[type="checkbox"]:checked +span:after, #schAppend .checkbox_wrap label input[type="checkbox"]:not(:checked) + span:after{ content:""; position: absolute; top: 50%; left: 50%; width:25px; height:25px; transform: translate(-50%,-50%); border: 1px solid #E5E5E5; border-radius: 50%;} #schAppend .checkbox_wrap label input[type="checkbox"]:checked + span.schAppend_icon:after{border-color: #F86453; } #schAppend .checkbox_wrap label input[type="checkbox"]:checked + span.schAppend_icon:before{content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width:15px; height:15px; border-radius: 50%; background-color: #F86453;} #schAppend .count_person p{ margin-bottom: 10px;} .count_person label input[type="checkbox"]{display: none;} .count_person label input[type="checkbox"] + span{display: inline-block; vertical-align: middle; margin-right: 10px;} .count_person label input[type="checkbox"] + span.cp_icon{position:relative; display: inline-block; width: 25px; height: 25px;} .count_person label input[type="checkbox"]:checked +span:after, #schAppend .count_person label input[type="checkbox"]:not(:checked) + span:after{ content:""; position: absolute; top: 50%; left: 50%; width:25px; height:25px; transform: translate(-50%,-50%); border: 1px solid #E5E5E5; border-radius: 50%;} .count_person label input[type="checkbox"]:checked + span.cp_icon:after{border-color: #F86453; } .count_person label input[type="checkbox"]:checked + span.cp_icon:before{content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width:15px; height:15px; border-radius: 50%; background-color: #F86453;} #schAppend .count_person li{margin-bottom: 10px;} .writeLeft .checkbox_wrap input[id="passwordLandingO"]:checked ~ .passwordW { display: block;} .writeLeft > li .write_box{width: 100%;} .writeLeft > li .write_box li{display: flex; align-items: center;} .writeLeft > li .write_box .write_box_tit > p{ font-size: 14px; display: inline-block; margin-right: 10px; color: #878787; position: relative; width: 115px; border-right: 1px solid #ededed; } .writeLeft > li .write_box .write_box_wrap{ padding: 20px 0; /*border-bottom: 1px solid #ededed;*/ /*margin-top: 15px;*/ } .writeLeft > li .write_box .write_box_wrap > p{ font-size: 14px; display: inline-block; color: #878787; position: relative; width: 100px; border-right: 1px solid #ededed; margin-right: 10px; } .writeLeft > li .write_box .write_box_wrap input[type="radio"]{display: none;} .writeLeft > li .write_box .write_box_wrap input[type="radio"] + label { cursor: pointer; margin-right: 40px;} .writeLeft > li .write_box .write_box_wrap input[type="radio"] + label span { display: inline-block; vertical-align: middle; color: #6d6d6d; } .writeLeft > li .write_box .write_box_wrap input[type="radio"] + label .icon { position: relative; width: 25px; height: 25px; border: 1px solid #e5e5e5; border-radius: 50%; margin-right: 5px; display: inline-block} .writeLeft > li .write_box .write_box_wrap input[type="radio"]:checked + label .icon:after { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 15px; height: 15px; background-color: #f86453; border-radius: 50%; } .writeLeft > li .write_box .write_box_wrap input[type="radio"]:checked + label .icon {border-color: #f86453; } .passwordW { display: none;} .meetOpenSetting03 input[id="passwordLandingO"]:checked ~ .passwordW { display: block} .writeLeft > li .write_box .write_box_wrap input[id="passwordLandingO"]:checked ~ .passwordW { display: block;} /*.writeLeft > li .write_box > .write_box_wrap > label{padding-top: 20px;}*/ .writeLeft .choice_wrap .write_box .write_box_wrap > label{margin-right: 40px;} .writeLeft .choice_wrap .write_box .tag_wrap{ color: #878787;} .writeLeft .choice_wrap .write_box .tag_wrap .add_tag_btn{display: flex; align-items: center;} .writeLeft .choice_wrap .write_box .tag_wrap .add_tag_btn > button{border: unset; text-decoration: underline; color: #878787; margin: 0 5px;} .writeLeft .choice_wrap .write_box .tag_wrap .add_tag_btn > span{margin-left: 5px;} .writeLeft .choice_wrap .write_box .tags_lis{padding: 20px 0;} .writeLeft .choice_wrap .write_box .tags_lis .tag{ background-color: #E5E5E5; border-radius: 50px; color: #333; padding: 5px 10px; position: relative; width: 12.5%; } .writeLeft .choice_wrap .write_box .tags_lis .tag > i{ position: absolute; right: 10px; top: 50%; transform: translateY(-50%); cursor: pointer; } .writeLeft .choice_wrap .write_box .tags_lis .tag > i:after{ content: ""; display: block; width: 2px; height: 13px; border-radius: 10px; background-color: #333; transform: rotate(-45deg); } .writeLeft .choice_wrap .write_box .tags_lis .tag > i:before{ content: ""; display: block; width: 2px; height: 13px; border-radius: 10px; background-color: #333; position: absolute; top: 0; transform: rotate(45deg); } .writeLeft > li .write_box .write_box_wrap > label span{ display: inline-block; vertical-align: middle; color: #6d6d6d; } .writeLeft .payment_management{ /*border-bottom: 1px solid #efefef;*/ border-top: 1px solid #efefef; font-size: 1.2rem; display: inline-block; padding: 20px 0; } .writeLeft .payment_management span{color: red; vertical-align: middle;} .writeLeft .payment_check{color: #878787; padding: 10px 0;} .writeLeft .payment_check > input , .writeLeft .payment_check > span{margin-right: 10px;} .writeLeft .payment_btn > button{background-color: #F86453; color: #fff; padding: 15px 25px; border-radius: 5px; border: unset; margin-top: 10px;} .writeLeft .age_amount p{ text-decoration: underline; color: #878787; margin-right: 10px; } .payment .fwW .writeLeft .write_box .payment_check input[type="checkbox"] { display: none;} .payment .fwW .writeLeft .write_box .payment_check input[type="checkbox"] + label { cursor: pointer; margin-right: 40px;} .payment .fwW .writeLeft .write_box .payment_check input[type="checkbox"] + label { display: inline-block; vertical-align: middle; color: #6d6d6d; } .payment .fwW .writeLeft .write_box .payment_check input[type="checkbox"] + label.icon { position: relative; width: 25px; height: 25px; margin-right: 5px; cursor:pointer;} .payment .fwW .writeLeft .write_box .payment_check input[type="checkbox"] + label.icon:after {content:""; position:absolute; display: block; width: 25px; height: 25px; border: 1px solid #e5d5d5; top: 50%; left: 50%; transform: translate(-50%,-50%); border-radius: 50%;} .payment .fwW .writeLeft .write_box .payment_check input[type="checkbox"]:checked + label.icon:after { border: 1px solid #f86453 } .payment .fwW .writeLeft .write_box .payment_check input[type="checkbox"]:checked + label.icon:before {content: ""; position: absolute; display: block; width: 15px; height: 15px; border-radius: 50%; background-color: #F86453; top: 50%; left: 50%; transform: translate(-50%,-50%); } .writeRight { width: 300px;} .compaginWriteW input { border: 1px solid #e5e5e5; padding: 10px; border-radius: 2px; transition: all .3s; height: 50px; font-size: 0.975rem; line-height: 1.2em; color: rgba(0,0,0,.84); font-weight: 400; } .compaginWriteW input:hover { border-color: #333} .compaginWriteW input:focus { border-color: #333; outline: none;} .compaginWriteW input::placeholder {color: #b3b3b3} /*.writeTitle { font-weight: 500; font-size: 1rem; color: #292929; }*/ .writeInfo { padding-bottom: 20px; font-size: 1.062rem; font-weight: 400; color: #292929;} .writeInfo span { padding-top: 8px; color: #6d6d6d; font-size: 0.812rem; display: inline-block; font-weight: 400 } .pointerTxt {font-style: normal; display: block; text-decoration: underline !important; color: #f66; margin-top: 10px;} .writeInfo .pointerInfo { background-color: #fff7f7; color: #f66; font-weight: 500; font-size: 12px; font-style: normal ; padding: 15px 10px; margin-top: 15px; border-radius: 3px} .writeInfo .pointerInfo svg { width: 14px; margin-right: 5px; fill: #f66} .writeInfo .pointerInfo02 { display: block; background-color: #fcfcfc; border-radius: 3px; color: #6d6d6d; padding: 15px 10px; font-size: 12px; font-weight: 500; margin-top: 15px; font-style: normal ; line-height: 2;} .writeInfo .titOption { font-style: normal; color:#B1B2B2; font-weight: 400;} .writeInfo .titOption:after{ content: '*'; display: inline-block; margin-left: 3px; color: #ff6666; transform: translateY(1px); font-size: 16px; } .writeImgUpload { cursor: pointer; padding: 15px 30px; border-radius: 3px; background: #3d3d3d; color: #fff; margin-right: 20px; font-weight: 500; transition: all .3s; } .writeImgUpload:hover { background: #181818; } .writeImgUpload input[type="file"] { display: none; } .writeImgUpload i { margin-right: 5px} .writeImgUpload + span { font-size: 0.75rem; color: #6d6d6d; } .uploadWrap { width: 100%; border: 1px solid #ededed; padding: 20px 0; text-align: center; position: relative; } .uploadWrap img { width: 300px; height: 200px; } .uploadWrap button { position: absolute; right: 10px; top: 10px; width: 22px; height: 22px; border: none;} .uploadWrap button:before { content: ''; position: absolute; left: 15px; top: 40%; display: inline-block; width: 1px; height: 16px; transform: rotate(-45deg) translateY(-50%); background-color: #939393; transition: all .2s } .uploadWrap button:after { content: ''; position: absolute; left: 4px; top: 40%; display: inline-block; width: 1px; height: 16px; transform: rotate(45deg) translateY(-50%); background-color: #939393; transition: all .2s } .uploadWrap button:hover:before { background-color: #575757} .uploadWrap button:hover:after { background-color: #575757} .test01 .writeRight { visibility: hidden} .test01:hover .writeRight { visibility: visible} .cwwInfo .writeRight { visibility: hidden; transition: .1s } .cwwInfo:hover .writeRight { visibility: visible} .writeRight .salePay { text-decoration: line-through; font-size: 11px; } .chooseWrap input[type="radio"] { display: none; } .chooseWrap input[type="radio"] + label { cursor: pointer; margin-right: 40px;} .chooseWrap input[type="radio"] + label span { display: inline-block; vertical-align: middle; color: #6d6d6d; } .chooseWrap input[type="radio"] + label .icon { position: relative; width: 25px; height: 25px; transition: background 0.1s ease; border-radius: 50%; border: 1px solid #e5e5e5; margin-right: 10px; } .chooseWrap input[type="radio"] + label .icon:after { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 8px; height: 8px; transition: all .3s ease; opacity: 0; border-radius: 50%; } .chooseWrap input[type="radio"]:checked + label .icon {border-color: #f86453 ; } .chooseWrap input[type="radio"]:checked + label .icon:after { background-color: #f86453; opacity: 1;} .showBox { display: none;} .chooseWrap input[id="landingImg"]:checked ~ .sb01 { display: block} .chooseWrap input[id="landingVideo"]:checked ~ .sb02 { display: block} .sb02 .cbinput { height: 44px; width: calc(100% - 140px); border-radius: 3px; border-color: #e5e5e5; margin-right: 20px; transition: all .3s; padding: 10px; } .sb02 .cbinput:hover { border-color: #333} .sb02 .cbinput:focus { outline: none; border-color: #333} .sb02 .cbinput + a { display: inline-block; border: 1px solid #e5e5e5; color: #3d3d3d; height: 44px; vertical-align: middle; padding: 10px 30px; border-radius: 3px; transition: all .3s } .sb02 .cbinput + a:hover { background-color: #f8f8f8; color: #292929; } .cwwInfo .afterSelect select { width: 100%; height: 50px; padding: 10px; border-radius: 2px; font-size: 0.937rem; line-height: 1.2em; font-weight: 400; color: rgba(0,0,0,.84) } .writeAddress, .writeAddressInfo { font-size: 0.875rem;} .writeAddress .noneInput { border: 1px solid #e5e5e5; border-radius: 3px; } .writeAddress .noneInput input { border: none; height: 44px; width: calc(100% - 44px); } .writeAddress .noneInput input:hover { border: none } .writeAddress .noneInput input:focus { border: none } .writeAddress .noneInput div { width: 44px; height: 44px; border: none; cursor: pointer } .registerWay input[type="radio"] { display: none;} .registerWay input[type="radio"] + label { cursor: pointer; margin-right: 40px;} .registerWay input[type="radio"] + label span { display: inline-block; vertical-align: middle; color: #6d6d6d; } .registerWay input[type="radio"] + label .icon { position: relative; width: 25px; height: 25px; border: 1px solid #e5e5e5; border-radius: 50%; margin-right: 5px; display: inline-block} .registerWay input[type="radio"]:checked + label .icon:after { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 8px; height: 8px; background-color: #f86453; border-radius: 50%; } .registerWay input[type="radio"]:checked + label .icon {border-color: #f86453; } .checkSite { display: none; } .checkSite .checkbox_wrap{padding-top: 20px;} .registerWay input[id="outsiteR"]:checked ~ .cs01 { display: block} .registerWay input[id="insiteR"]:checked ~ .cs02 { display: block} .csBTB { border-top: 1px solid #ededed; border-bottom: 1px solid #ededed; padding: 25px 20px; } .osInfo li:first-child { width: 80px;} .osInfo li:last-child { width: calc(100% - 80px);} .cs02 label { cursor: pointer} .cs02 input[type="checkbox"] { display: none; } .cs02 .csIcon { position: relative; width: 15px; height: 15px; border: 1px solid #ededed; border-radius: 3px; transition: background 0.1s ease; display: inline-block; transform: translateY(2px) } .cs02 .csIcon:after { content: ''; position: absolute; top: -3px; left: 4px; width: 5px; height: 11px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(45deg) scale(0); transition: all .3s ease; transition-delay: 0.15s; opacity: 0;} .cs02 .csTxt { margin-left: 10px;} .cs02 input[type="checkbox"]:checked ~ .csIcon { border-color: transparent; } .cs02 input[type="checkbox"]:checked ~ .csIcon:after { opacity: 1; transform: rotate(45deg) scale(1); border-color: #f86453} .fileGetWay input[type="radio"] { display: none;} .fileGetWay input[type="radio"] + label { cursor: pointer; margin-right: 40px;} .fileGetWay input[type="radio"] + label span { display: inline-block; vertical-align: middle; color: #6d6d6d; } .fileGetWay input[type="radio"] + label .icon { position: relative; width: 25px; height: 25px; border: 1px solid #e5e5e5; border-radius: 50%; margin-right: 5px; display: inline-block} .fileGetWay input[type="radio"]:checked + label .icon:after { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 8px; height: 8px; background-color: #f86453; border-radius: 50%; } .fileGetWay input[type="radio"]:checked + label .icon {border-color: #f86453; } .mosWrap p { font-size: 14px; display: inline-block; margin-right: 40px; color: #878787; position: relative; width: 200px} .mosWrap p:after { content: ''; display: inline-block; position: absolute; right: -20px; top: 50%; transform: translateY(-50%); height: 10px; width: 1px; background-color: #e5e5e5; } .mosWrap label { cursor: pointer} .meetOpenSetting01 { padding: 20px 0; border-bottom: 1px solid #ededed; margin-top: 15px; } .meetOpenSetting02 { padding: 20px 0; } .meetOpenSetting01 input[type="radio"] { display: none;} .meetOpenSetting01 input[type="radio"] + label { cursor: pointer; margin-right: 40px;} .meetOpenSetting01 input[type="radio"] + label span { display: inline-block; vertical-align: middle; color: #6d6d6d; } .meetOpenSetting01 input[type="radio"] + label .icon { position: relative; width: 25px; height: 25px; border: 1px solid #e5e5e5; border-radius: 50%; margin-right: 5px; display: inline-block} .meetOpenSetting01 input[type="radio"]:checked + label .icon:after { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 8px; height: 8px; background-color: #f86453; border-radius: 50%; } .meetOpenSetting01 input[type="radio"]:checked + label .icon {border-color: #f86453; } .meetOpenSetting02 input[type="radio"] { display: none;} .meetOpenSetting02 input[type="radio"] + label { cursor: pointer; margin-right: 40px;} .meetOpenSetting02 input[type="radio"] + label span { display: inline-block; vertical-align: middle; color: #6d6d6d; } .meetOpenSetting02 input[type="radio"] + label .icon { position: relative; width: 25px; height: 25px; border: 1px solid #e5e5e5; border-radius: 50%; margin-right: 5px; display: inline-block} .meetOpenSetting02 input[type="radio"]:checked + label .icon:after { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 8px; height: 8px; background-color: #f86453; border-radius: 50%; } .meetOpenSetting02 input[type="radio"]:checked + label .icon {border-color: #f86453; } .passwordW { display: none; } .meetOpenSetting input[id="passwordLandingO"]:checked ~ .passwordW { display: block} .meetOpenSetting02 input[id="passwordLandingO"]:checked ~ .passwordW { display: block} .writeLeft .checkbox_wrap label input { appearance: none; width: 25px; height: 25px; border: 1px solid #e5e5e5; border-radius: 50%; position: relative; } .writeLeft .checkbox_wrap label input:checked {border: 1px solid #f86453;} .writeLeft .checkbox_wrap label input:checked .icon:after { display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background-color: #f86453; border-radius: 50%;} .fileUploadW input[type="file"] { display: none; } .fileUploadW label { cursor: pointer; border: 1px solid #e5e5e5; color: #3d3d3d; border-radius: 3px; transition: all .3s; display: inline-block; height: 44px; padding: 0 20px; line-height: 44px; } .fileUploadW label:hover { background-color: #f8f8f8; color: #292929;} .fileUploadW label i { margin-right: 8px; font-size: 11px} .fileUploadW section { height: 44px; flex: 1; margin: 0 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border: 1px solid #e5e5e5; line-height: 44px; border-radius: 3px; padding: 0 10px; } .fileUploadW button { width: 44px; height: 44px; border-radius: 3px; border-color: #e5e5e5; transition: all .3s; } .fileUploadW button:hover {background-color: #f8f8f8; color: #292929; } .addFile { padding: 0; margin-top: 25px; border: none; font-size: 0.875rem; color: #3d3d3d; font-weight: 500; transition: all .3s } .addFile span { width: 20px; height: 20px; border: 1px solid #3d3d3d; border-radius: 50%; display: inline-block; position: relative; margin-right: 10px; transition: all .3s} .addFile span:before { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 8px; height: 1px; background-color: #3d3d3d; transition: all .3s } .addFile span:after { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 1px; height: 9px; background-color: #3d3d3d; transition: all .3s } .addFile:hover {color: #f86453;} .addFile:hover span { color: #f86453; border-color: #f86453} .addFile:hover span:before, .addFile:hover span:after { background-color: #f86453} .compaginWriteW .submit_btn { background-color: #3d3d3d; color: #fff; border-color: #3d3d3d; padding: 5px 30px} /* 크라우드 펀딩 오픈 */ .cpBox { border: 1px solid #e5e5e5; border-radius: 4px; padding: 20px !important; } .cpBox span { color :rgba(0,0,0,.84); font-weight: 400 !important; font-size: 0.937rem !important;} .cpBox .medium { } .textareaW { border: 1px solid #e5e5e5; border-radius: 2px; padding: 10px; height: 100px; transition: all .3s } .textareaW textarea { border: none; padding: 0 !important; resize: none; height: 100% !important; font-size: 0.937rem; line-height: 1.4; color: rgba(0,0,0,.84); font-weight: 400 !important; width: 100%} .textareaW:focus-within { outline: 1px solid #333; border-color: #fff; } .textareaW:focus-within:hover { outline: none; border-color: #333; } .textareaW:hover { border-color: #333; } .countingTxt {color: #7d7d7d; margin-top: 10px; } .writeError { border-color :#f66 !important; background-color: rgba(255,155,155,.06); } .targetAmount { position: relative; border: 1px solid #e5e5e5; border-radius: 2px; padding: 10px; height: 50px; transition: all .3s } .targetAmount input { border: none; padding: 0 !important; resize: none; height: 100% !important; font-size: 0.937rem; line-height: 1.2em; color: rgba(0,0,0,.84); font-weight: 400 !important; width: 95%;} .targetAmount:focus-within { outline: 1px solid #333; border-color: #fff; } .targetAmount:focus-within:hover { outline: none; border-color: #333; } .targetAmount:hover { border-color: #333; } .targetAmount:after { content: '원'; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); font-size: 1rem; font-weight: 500; color: #292929; } .targetSchedule { position: relative; border: 1px solid #e5e5e5; border-radius: 2px; padding: 10px; height: 50px; transition: all .3s } .targetSchedule svg { width: 15px; } .targetSchedule input { border: none; padding: 0 !important; resize: none; height: 100% !important; font-size: 0.937rem; line-height: 1.2em; color: rgba(0,0,0,.84); font-weight: 400 !important; width: 95%;} .targetSchedule:focus-within { outline: 1px solid #333; border-color: #fff; } .targetSchedule:focus-within:hover { outline: none; border-color: #333; } .tsDisabled { background-color: #fafafa; } .tsDisabled input:disabled {background-color: transparent} .cwwInfo .hashTag { width: 100%; height: 50px; padding: 10px 20px; } .cwwInfo .hashTag:hover {} .cwwInfo .hashTag ul { height: 100%; } .cwwInfo .hashTag li { height: inherit; } .cwwInfo .hashTag li input { height: inherit !important; border: none !important;} .cwwInfo .hashTag .onTag { padding: 4px 12px !important; border: none; color: rgba(0,0,0,.54); background-color: #e6eaed; border-radius: 12px; } .cwwInfo .hashTag .onTag b { margin-right: 2px; font-weight: 700; } .cwwInfo .hashTag .onTag button { background-color: transparent; margin-left: 10px; transform: translateY(1px); } .cwwInfo .hashTag .onTag button svg { width: 10px} .cwwInfo .select_div { float: none} .saintCheck input[type="checkbox"] { display: none; } .saintCheck span { display: inline-block; vertical-align: middle; cursor: pointer; color: #6d6d6d } .saintCheck .icon { position: relative; width: 20px; height: 20px; border: 1px solid #ededed; border-radius: 50%; transition: background 0.1s ease; } .saintCheck .icon:after { content: ''; position: absolute; top: 0; left: 5px; width: 5px; height: 11px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(45deg) scale(0); transition: all .3s ease; transition-delay: 0.15s; opacity: 0;} .saintCheck .scTxt { margin-left: 5px;} .saintCheck input:checked ~ .icon { border-color: transparent; background: #ff6666; } .saintCheck input:checked ~ .icon:after { opacity: 1; transform: rotate(45deg) scale(1)} .infomationReward { border: 1px solid #e5e5e5; border-radius: 3px; padding: 20px; } .irTxt { font-size: 0.812rem; font-weight: 700; color: rgba(0,0,0,.45);} .irTxt div{ color: rgba(0,0,0,.65); width: 85%; font-weight: 400; font-size: 0.812rem; } .irTxt div b { font-weight: 500} .irTxt div > b { display: inline-block; margin-bottom: 10px;} .irInfo { background-color: #f7f8f9; border-radius: 2px; padding: 12px; margin-top: 15px;} .irExample li { line-height: 1.6} .modalOpenBtnW { width: 60%; } .rewardAddBtn { padding: 0 20px 0 40px; border: 1px solid #f86453; color: #fff; transition-property: background-color,border-color,color,opacity; transition-duration: .2s; background-color: #f86453; position: relative; height: 45px; border-radius: 3px; } .rewardAddBtn:before { content:''; position: absolute; left: 20px; top:50%; transform: translateY(-50%); width: 10px; height: 1px; background-color: #fff; } .rewardAddBtn:after { content:''; position: absolute; left: 20px; top:50%; transform: translateY(-50%) rotate(-90deg); width: 10px; height: 1px; background-color: #fff; } .rewardOrderBtn { height: 45px; padding: 0 20px; border:none} .rewardOrderBtn span { display: inline-block; width: 17px; height: 10px; border-top: 1px solid rgba(0,0,0,.54); border-bottom: 1px solid rgba(0,0,0,.54); position: relative; margin-right: 10px } .rewardOrderBtn span:before { content: ''; position: absolute; left: 0; top:-3px; transform: rotate(-45deg); width: 5px; height: 5px; border-left: 1px solid rgba(0,0,0,.54); border-top: 1px solid rgba(0,0,0,.54);} .rewardOrderBtn span:after { content: ''; position: absolute; right: 0; bottom:-3px; transform: rotate(-45deg); width: 5px; height: 5px; border-right: 1px solid rgba(0,0,0,.54); border-bottom: 1px solid rgba(0,0,0,.54);} .rewardInfoWrap { border: 1px solid #e5e5e5; border-radius: 3px; padding: 20px; width: 60%; box-shadow: 3px 3px 10px rgba(0,0,0,0.03);} .rewardInfoWrap h4 { color: rgba(0,0,0,.87); font-weight: 700; font-size: 1.125rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .rewardInfoWrap .rewardPay { color: rgba(0,0,0,.87); font-size: 0.937rem; font-weight: 400; padding: 15px 0 20px} .rewardInfoWrap .rewardPay > span { background-color: #fff7f7; border-radius: 3px; padding: 5px 8px; font-size: 11px; font-weight: 500; color: #f66} .rewardInfoWrap > span { font-size: 13px; color: rgba(0,0,0,.45); display: inline-block; padding-bottom: 20px;} .rewardInfoWrap > ul {font-size: 13px; } .rewardInfoWrap > ul li:first-child { margin-bottom: 8px} .rewardInfoWrap > ul li span { display: inline-block; width: 80%; color: rgba(0,0,0,.45)} .riBtnW { margin-top: 20px} .riBtnW button { border-color: rgba(0,0,0,0.15); transition-property: background-color,border-color,color,opacity; transition-duration: .2s; background-color: #fff; font-weight: 400; padding: 0 12px; height: 30px; font-size: 13px; color: rgba(0,0,0,.54); border-radius: 14px; margin-right: 10px} .riBtnW button:hover { border-color: rgba(0,0,0,0.3); color: rgba(0,0,0,0.84)} .rewardAddModal { position: fixed; left: 0; top: 0; z-index: 999; background-color: rgba(0,0,0,0.6); width: 100%; height: 100vh; overflow-y: auto; display: none; } .ramTxt { background-color: #fff; position: absolute; top: 0; left: 50%; transform: translate(-50%,0); padding: 60px 2.604%; box-shadow: 0 2px 6px rgba(0,0,0,0.4); max-width: 990px; min-width: 660px;margin: 50px 0} .ramTxt p { line-height: 32px; color: #181818; font-size: 1.5rem; font-weight: bold; margin-bottom: 20px; } .ramTxt ul { margin-bottom: 30px;} .ramTxt li:first-child { max-width: 138px; width: 138px; font-size: 1.062rem; font-weight: 500} .ramTxt li:nth-child(2) { width: calc(100% - 138px)} .ramTxt label { display: block; margin-bottom: 8px; line-height: 24px; font-size: 1rem; color: #414141; font-weight: 400;} .ramTxt input { border: 1px solid #e5e5e5; border-radius: 3px; height: 50px; font-weight: 400; transition: all .3s; width: 100%; padding: 5px 10px; color: #333; font-size: 1rem} .ramTxt input::placeholder { color: #cfcfcf; font-weight: 400} /*.ramTxt input:hover {border-color: #333}*/ /*.ramTxt input:focus { outline: 1px solid rgba(199,32,48,0.8); border-color: #fff }*/ /*.ramTxt input:focus:hover {border-color: #fff;}*/ /*.ramTxt input:focus:after { outline: 1px solid rgba(199,32,48,0.8); border-color: #fff }*/ .ramTxt .targetAmount input { border: none} .ramTxt .afterSelect { height: 50px;} .ramTxt .afterSelect select { height: 100%; color: rgba(0,0,0,.84); font-size: 0.937rem; line-height: 1.4} .checkOptionW { display: none;} .checkOptionW label { font-size: 0.875rem; margin-bottom: 10px; font-weight: 400; color: #878787; } .checkOptionW .textareaW { height: 120px !important;} .personallyOption { display: none;} .personallyOption em { font-style: normal; font-size: 13px; margin-top: 8px; display: inline-block; color: #878787; font-weight: 400;} .rewardTxtInfo li:last-child { font-size: 1rem; font-weight: 400} .limitedQ input {width: 40%; margin-right: 10px } .deliveryWrap {} .deliveryWrap label { display: flex !important; cursor: pointer} .deliveryWrap input[type="radio"] {display: none;} .deliveryWrap input[type="radio"]:checked + label .icon { border-color: #f86453} .deliveryWrap input[type="radio"]:checked + label .icon:before { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 15px; height: 15px; background-color: #f86453; border-radius: 50%; } .deliveryWrap input[class="deliveryY"]:checked ~ .deliveryPay { display: block} .deliveryWrap .icon { width: 25px; height: 25px; border-radius: 50%; border: 1px solid #e5e5e5; display: inline-block; margin-right: 10px; position: relative} .deliveryPay { display: none; } .deliveryPay input { width: 40%; margin-right: 10px } .deliveryPay em { font-style: normal; font-size: 13px; margin-top: 8px; display: block; color: #878787; font-weight: 400;} .ramBtnW { margin-top: 20px; float: right; } .ramBtnW button:nth-child(1) { border-color: #e5e5e5; padding: 15px 30px; color: #e5e5e5; transition: all .3s; border-radius: 3px; font-size: 1rem;} .ramBtnW button:nth-child(1):hover { border-color: #cbcbcb; color: #333;} .ramBtnW button:nth-child(2) { border-color:#f86453; padding: 15px 40px; background-color:#f86453; font-size: 1rem; transition: all .3s; border-radius: 3px; color: #fff; margin-left: 10px} .ramClose { position: absolute; right: 20px; top: 20px; padding: 15px; cursor: pointer; font-size: 16px; border-color: #fff } .ramClose:after { content: ''; display: inline-block; width: 1px; height: 16px; transform: rotate(45deg) translateY(-50%); background-color: #000; position: absolute; top: 45%; left: 9px } .ramClose:before { content: ''; display: inline-block; width: 1px; height: 16px; transform: rotate(-45deg) translateY(-50%); background-color: #000; position: absolute; top: 45%; left: 20px; } .sortOrderModal { position: fixed; left: 0; top: 0; z-index: 999; background-color: rgba(0,0,0,0.6); width: 100%; height: 100vh; display: none} .soTxt { background-color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); padding: 65px 40px 45px; box-shadow: 0 2px 6px rgba(0,0,0,0.4); min-width: 400px; width: 600px; } .soTxt > p { line-height: 32px; color: #181818; font-size: 1.5rem; font-weight: bold; margin-bottom: 20px; } .soTxt span { display: inline-block; margin-bottom: 15px; } .soTxt .addRewardListW { } .soTxt .addRewardListW li { cursor: pointer; padding: 10px 0; } .soTxt .addRewardListW li div { width: calc(100% - 30px);} .soTxt .addRewardListW li div p { font-size: 1rem; width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; margin-bottom: 5px; font-weight: 500; } .soTxt .addRewardListW li button { position: relative; border-top: 1px solid rgba(0,0,0,.54); border-bottom: 1px solid rgba(0,0,0,.54); border-right: none; border-left: none; background-color: #fff; width: 12px; height: 10px } .soTxt .addRewardListW li button:after { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 12px; height: 1px; background: rgba(0,0,0,.54); } .soTxt .addRewardListW .ui-sortable-helper { background-color: #fff; box-shadow: rgba(0,0,0,0.08) 3px 3px 10px; transform: scale3d(1.1, 1.1, 1.1); padding: 20px 10px; border-radius: 3px} .soSave { border-color:#f86453; padding: 15px 40px; background-color:#f86453; font-size: 1rem; color: #fff; border-radius: 3px; float: right; margin-top: 30px; } .soClose { position: absolute; right: 20px; top: 20px; padding: 15px; cursor: pointer; font-size: 16px; border-color: #fff } .soClose:after { content: ''; display: inline-block; width: 1px; height: 16px; transform: rotate(45deg) translateY(-50%); background-color: #000; position: absolute; top: 45%; left: 9px } .soClose:before { content: ''; display: inline-block; width: 1px; height: 16px; transform: rotate(-45deg) translateY(-50%); background-color: #000; position: absolute; top: 45%; left: 20px; } .creatorProfileImg { width: 200px; height: 200px; border-radius: 50%; overflow: hidden; margin: 0 auto; border: 1px solid #e5e5e5 } .creatorProfileImg > img { width: 100%; height: 100%;} .addSNS {} .addSNS .afterSelect { width: 150px; } .addSNS input[type="text"] {flex: 1; margin: 0 10px;} .addSNS .snsDelete { width: 50px; height: 50px;} .addSNS .snsPlus span {width: 25px; height: 25px; border: 1px solid #3d3d3d; } .publicChoose input[type="radio"] { display: none; } .publicChoose input[type="radio"] + label { cursor: pointer; margin-right: 40px;} .publicChoose input[type="radio"] + label span { display: inline-block; vertical-align: middle; color: #6d6d6d; } .publicChoose input[type="radio"] + label .icon { position: relative; width: 25px; height: 25px; transition: background 0.1s ease; border-radius: 50%; border: 1px solid #e5e5e5; margin-right: 10px; } .publicChoose input[type="radio"] + label .icon:after { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 15px; height: 15px; transition: all .3s ease; opacity: 0; border-radius: 50%; } .publicChoose input[type="radio"]:checked + label .icon {border-color: #f86453 ; } .publicChoose input[type="radio"]:checked + label .icon:after { background-color: #f86453; opacity: 1;} .h180px { height: 180px !important;} .asInfoTxtW { height: 420px !important;} .asInfoTxtW textarea { line-height: 2} .fundingPapersW { padding: 20px 0; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5} .fundingPapersW label { display: block} .importantBox { background-color: #fff6f7 !important; } .importantBox h5 { color: #f66; } .importantBox h5 svg { width: 12px; fill: #f66; margin-right: 5px; } .informationReward { background-color: #fff !important; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; } .informationReward .select_div { width: 100% !important; margin: 20px 0 !important; } .optionB { border: 1px solid #e4e4e4; border-radius: 3px; padding: 20px 20px 30px; position: relative; } .checkOptionB { position: relative;} .checkOptionB:before { content: ''; display: inline-block; position: absolute; left: 0; top: 0; width: 5px; height: 100%; background: #fff7f7} .optionB h3 { font-size: 0.937rem; font-weight: 500; } .optionB p { color: rgba(0,0,0,0.54); margin :20px 0 40px; line-height: 1.6; } .optionB input[type="checkbox"] {display: none; } .optionB label span { padding: 10px 20px; border-radius: 3px; cursor: pointer} .notCheck { background: #f9f9f9; cursor: default !important; border: 1px solid #f9f9f9; color: rgba(0,0,0,0.54) } .stillCheck { color: #f86453 !important; border: 1px solid #f86453} .okCheck { background: #ff6665; border: 1px solid #ff6665; color: #fff; display: none; position: relative;} .optionB input[type="checkbox"]:checked ~ .stillCheck { display: none;} .optionB input[type="checkbox"]:checked ~ .okCheck { display: inline-block;} .pointGetTxt { display: none; width: 100%; margin-bottom: 20px} .optionB input[class="pointGet"]:checked ~ .pointGetTxt { display: block} .optionB input[type="checkbox"]:checked ~ .okCheck:before {} .openMycoupon { color: #f86453; text-decoration: underline !important;} .optionB .pointerInfo { background-color: #fff7f7; color: #f66; font-weight: 500; font-size: 12px; font-style: normal ; padding: 15px 10px; margin-top: 15px; border-radius: 3px} .optionB .pointerInfo svg { width: 14px; margin-right: 5px; fill: #f66} .underExamination { color: #292929 !important; font-weight: 700 !important; border: none !important; background: transparent !important; padding: 0 !important; cursor: default !important;} .campaignApplyBtn { float : left; padding: 15px 60px !important; border-radius: 3px; background: #f86453 !important; border-color: #f86453 !important; transition: all .3s; font-weight: 400 !important; } .campaignApplyBtn:hover { background: #e15849 !important; border-color: #e15849 !important; } .saveCBtn { padding: 15px 60px !important; border-radius: 3px; background: #3d3d3d !important; border-color: #3d3d3d !important;} .concreteW { border-bottom: 1px solid #e5e5e5; border-top: 1px solid #e5e5e5; padding: 30px 10px; } .concreteW label { margin-right: 40px;} .concreteW label .csTxt { margin-left: 5px;} .compaginWriteW .innerBg { border-color: #e5e5e5; } .compaginWriteW .visible_wrap { font-size: 0.937rem; float: right; text-decoration: underline;} .compaginWriteW .guest_book_help { padding: 15px; background: #fbfbfb; line-height: 2; font-size: 0.875rem; border-radius: 3px; margin-top: 20px; } .w100P { width: 100% !important;} /*.meetListName li a { padding: 10px 0 !important; margin-right: 40px; font-size: 1rem !important; }*/ /*.meetListName .action a { border-bottom: 2px solid #292929; color: #292929 !important; font-weight: 500 !important;}*/ .meetListName li { width: calc(100%/6); } .meetListName li a { display: block; width: 100%; color: #878787; font-weight: 400; text-align: center} .meetListName .action { border-bottom: 0 !important;} .meetListName .action a { border-bottom: 2px solid #292929; color: #292929 !important; font-weight: 500 !important;} @media screen and (max-width: 1024px) { .topAd{display: none;} .commonMargin.dF.dAc.dJSb.openRegisterPT{padding: 0;margin: -60px 0 80px; display: flex; justify-content: space-between; } .openMainTxt{width: 45%; height: 100vh; padding: 230px 5%;} .openMainVisual{width: 50%; height: 100vh;} .openRegisterPT .openMainVisual li{width: 100%; height: 100%; background-size: auto 100vh;} .openMainVisual li:first-child{background-color: transparent;} } @media screen and (max-width: 768px) { .openWrap p { display: none} .backSite { transform: translateX(-20px)} .openMainVisual {display: none;} .topAd{display: none;} .commonMargin.dF.dAc.dJSb.openRegisterPT{margin: 0; padding:0px; height: 100vh; width: 100%;} .openMainTxt{width:100%; height:100%; padding: 30% 5%;background-image: url("../../images/cam_img/ta_cam_img_02.png"); background-position: 0; background-repeat: no-repeat; background-size: auto 100vh; margin-top: -60px;} } /* new 밋업 리스트 */ .endM { padding: 2px 10px; margin-right: 5px; background: #181818; border-radius: 3px; color: #fff;} .ingM { padding: 2px 10px; margin-right: 5px; color: #e91c1f; border-radius: 3px; background: #fff; border: 1px solid #ededed; } .svgW { width: 20px; height: 20px; } .svgW svg { width: 15px} @media screen and (max-width : 768px) { .meetListW { margin-top: 3px !important;; } } /* 캠페인 공통 */ .compaginTW {} .compaginTW .ctCategory { font-size: 0.9em; font-weight: 500; padding: 5px 10px; color: #757575; background: #fafafa; border: 1px solid rgb(239, 239, 239); border-radius: 2px; display: inline-block} .meetupType { border-radius: 5px; background: #f9fafb; padding: 16px 10px; margin-top: 0; border-left: 0; } .meetupType i { margin-right: 5px;} .compaginTW .detailRight > h5 { margin-bottom: 20px; } .compaginTW .detailRight > h5 > small { font-weight: 400; margin-left: 5px} .compaginTW .detailRight .funding_info { margin-bottom: 0} .compaginTW .detailRight .meetInfo {} .compaginTW .detailRight .meetInfo li:first-child { width: auto; margin-right: 20px; font-weight: 700; color: rgba(0,0,0,.85); } .compaginTW .detailRight .meetInfo li:last-child { flex: 1; } .compaginTW .detailRight .meetInfo li a { cursor: pointer; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; display: inline-block; width: calc(100% - 80px); } .compaginTW .detailRight .meetInfo li a i { font-size: 11px; background: #ededed; padding: 5px; border-radius: 3px;} .compaginTW .detailRight .meetInfo .meetInfoNP { } .compaginTW .detailRight .meetInfo .meetInfoNP p { position: relative; margin-left: 20px; } .compaginTW .detailRight .meetInfo .meetInfoNP p:after { content: ''; display: inline-block; position: absolute; left: -10px; top:50%; transform: translateY(-50%); width: 1px; height: 10px; background: #ededed;} .compaginTW .detailRight .meetInfo .meetInfoNP p u { font-weight: 600; color: rgb(235, 75, 56); text-decoration: none} .compaginWith { border-top: 1px solid rgb(244, 244, 244); padding: 20px 0 10px } .withC { padding: 16px 20px; border-radius: 5px; color: rgba(0,0,0,.5); background: rgb(253, 244, 243) ; font-weight: 400; font-size: 0.812rem; } .withC span { font-weight: 600; color: rgb(235, 75, 56)} .compaginTW .cp_share { margin-top: 20px; } .age_amount{align-items: center; margin-bottom: 10px;} .age_amount input{margin-right: 10px;} .age_amount span{ color: #878787; } /* meetup detail New */ .compaginWith .meetupType { background: transparent; padding: 0; border-left: none; margin-top: 0} .meetAsk { } .meetAsk li:first-child { margin-right: 20px; font-weight: 700; color: #3d3d3d; } /*기획전 */ .exhib_more_wrap{ display: flex; } .exhib_order_list:first-child{ width: calc((100% - 80px)/2); margin-right: 160px; } .exhib_order_list .img_box1{ width: 100%; border: 1px solid #eee; border-top-left-radius: 5px; border-top-right-radius: 5px; } .exhib_order_list .img_box1 img{ width: 100%; border-top-left-radius: 5px; border-top-right-radius: 5px; max-height: 220px; min-height: 220px; } .exhib_order_list .exhib_txt_box{ background: white; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; padding: 20px 10px 10px 10px; } .exhib_order_list .exhib_txt_box h4{ padding: 5px 0px; } .exhib_order_list .exhib_txt_box h3{ padding-bottom: 5px; } .writeLeft .count_person label{vertical-align: middle; margin-right: 10px;} .writeLeft .count_person input{ line-height: 20px; vertical-align: middle;}