header,footer,section,article,aside,nav,hgroup,details,menu,figure,figcaption{display:block;}
html,body,div,span,applet,object,iframe,video,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,address{margin:0; padding:0; border:0; outline:0; vertical-align:baseline; background:transparent; list-style:none;}
span,a{display:inline-block;}a{text-decoration:none;font-style:normal;}
html,body{font-family: 'Noto Sans KR'; font-weight:100;margin:0; width:100%; height:100%; line-height:normal; -webkit-overflow-scrolling:touch;}
body{color:#000;letter-spacing:-1px;-webkit-text-size-adjust:none;/*아이폰가로 폰트확대 방지*/vertical-align:top;}img{border:0;max-width:100%;vertical-align:top;}form{display:inline;}fieldset{border:0;}legend{display:none;}input,select,radio,div{vertical-align:top;}input[type=submit],button{cursor:pointer;}input[type=radio]{padding:0;margin:0;vertical-align:middle;}input[type=checkbox]{margin:0; vertical-align:middle;}h1,h2,h3,h4,h5,h6{font-weight:normal;}

/* guide */
.inner{width:90%; margin:0 auto;}

/* font */
html{ font-size:62.5%;word-break: keep-all;}

p{display:block;}p.error{font-size:;margin-left:0;color:;}
.control-group{position:relative; display:inline-block;zoom:1;*display:inline;}
.control-group.warning>p,.control-group.warning .help-block,.control-group.warning .help-inline{color:#c33434;}
.control-group.warning input,.control-group.warning select,.control-group.warning textarea{color:#a11929;border-color:#c33434;}
.control-group.warning input:focus,.control-group.warning select:focus,.control-group.warning textarea:focus{border-color:#c33434;}
.control-group.warning .input-prepend .add-on,.control-group.warning .input-append .add-on{color:#c33434;background-color:#c33434;border-color:#c33434;}
.control-group.error>p,.control-group.error .help-block,.control-group.error .help-inline{position:absolute; left: 15px; bottom: 2px; padding:4px 8px 0 24%; font-size:0.8rem; color:#999;}
.agree.control-group.error>p,.agree.control-group.error .help-block,.agree.control-group.error .help-inline{position:absolute; left: 3px; bottom: -1rem; padding:0.4rem 0.8rem 0 0;}
.control-group.error input,.control-group.error select,.control-group.error textarea{color:#c33434; background:#f9dad7;}
.control-group.error input:focus,.control-group.error select:focus,.control-group.error textarea:focus{border-color:#fc9489;}
.control-group.error .input-prepend .add-on,.control-group.error .input-append .add-on{color:#c33434;background-color:#c33434;border-color:#c33434;}
.time .error { margin-bottom: 1.8rem; }
.time p{ position: absolute; left: 0px; bottom: -20px; font-size:0.8rem;}
.area p.error{position: absolute; left: 28%; bottom: 0; font-size:0.8rem; color:#999;}
.gender p.error{position: absolute; left: 24%; bottom: 0; font-size:0.8rem; color:#ffe5e6;}
.agree p.error{position: absolute; left: 2px; top: 10px; font-size:0.8rem; color:#ffe5e6;}
/* browser placeholder */
::-webkit-input-placeholder {color:#666;}:-moz-placeholder {color:#666;opacity:1;}::-moz-placeholder {color:#999;opacity:1;}:-ms-input-placeholder{color:#999;}
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder { /* WebKit browsers */ color:transparent; }
input:focus:-moz-placeholder, textarea:focus:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color:transparent; }
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder { /* Mozilla Firefox 19+ */ color:transparent; }
input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder { /* Internet Explorer 10+ */ color:transparent; }
/* form setting */
.hope, .name, .brand, .model, .age, .phone, .email, .time, .money, .job, .area, .memo{background:#ffffff; border:2px solid #e85e80; width:100%; height:52px; overflow:hidden; vertical-align:top;
 -webkit-border-radius:5px;-moz-border-radius:5px;border-radius:0px;font-family: 'S-CoreDream-3Light'}
.hope input:focus, .name input:focus,.brand input:focus,.model input:focus,.age input:focus,.phone input:focus,.email input:focus,.memo textarea:focus,.money input:focus{background:#f5f5f5; outline:none;}
.memo{height:85px;}
.hope input, .name input,.brand input,.model input,.age input,.phone input,.email input,.money input,.memo textarea{
    outline:none; overflow:hidden; float:right; color:#666; font-size:1.6rem; padding:1.6rem 1.5rem 1.8rem; margin-top:-0.2rem; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;font-family: 'S-CoreDream-3Light'}
.money span{float:right; font-size:1.6rem; color:#666; padding:1.6rem 2rem 1.6rem 0.5rem; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.time_select_wrap,.money_select_wrap,.job_select_wrap,.area_select_wrap{outline:none; overflow:hidden; float:right; padding:1.5rem 1.5rem 1.8rem 0; margin-top:-0.2rem; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.time select, .money_select, .job_select, .area_select{color:#666; font-size:1.6rem; width:100%; background:transparent;font-family: 'S-CoreDream-3Light'}
div.formLabel{font-size:1.6rem; color:#000; position:relative; vertical-align:top; float:left; padding:1.8rem 0 1.6rem 1.2rem; margin-top:-0.2rem; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.gender label{display:inline-block; font-size:1.6rem; padding:1.5rem;}
.gender label span{cursor:pointer;}
.gender label input{display:inline-block; -webkit-border-radius:50%;-moz-border-radius:30px;border-radius:50%;}
.gender label span{display:inline-block; margin-left:3%;}
#user_name{background-position:13px 22px !important}
#user_name02{background-position:13px 22px !important}
#user_name03{background-position:13px 22px !important}
#user_age{background-position:13px -30px !important}
#user_age02{background-position:13px -30px !important}
#user_age03{background-position:13px -30px !important}
#user_phone{background-position:13px -78px !important}
#user_phone02{background-position:13px -78px !important}
#user_phone03{background-position:13px -78px !important}
#user_email{background-position:13px -328px !important}
#user_comment{background-position:13px -428px !important}
#user_hope{background-position:13px -378px !important}
#user_money{background-position:13px -228px !important}
.time_select_wrap{background-position:13px -178px !important}
input,select,textarea,button{font-family: 'Noto Sans KR'; font-weight:100; border:0; -webkit-border-radius:0;/*-webkit-appearance:none;*/}
.form_button{position:relative; text-align:center;}
.form_button button{outline:none; font-family: 'Noto Sans KR'; font-weight:300; /*-webkit-border-radius:50px;-moz-border-radius:50px;border-radius:50px;*/}
.agree{width:100%; font-size:1.4rem; cursor:pointer; color:#000; border-top:px solid #433830; margin:0; padding-top:;font-family: 'S-CoreDream-3Light'}
.agree a{margin:0 0 0 3px; color:#fff; padding:3px 7px; background:#444; font-size:1.2rem; display:inline-block;}
.agree a:link{color:#fff;}.agree a:visited,.agree a:active{color:#fff;}.agree a:hover{color:#fff; text-decoration:none;}
.agree input{width:16px; height:16px; margin-right:2px;}

/* footer */
.footerBg{width:100%; padding:7.5rem 0;}
.footerText{font-style:normal; font-size:1.2rem; line-height:1.8rem;}

@media screen and (min-width:412px){ /*galaxy note9*/
.br412{display:block;}.br320,.br640,.br1200{display:none;}
    
/* form validator */
.control-group.error>p,.control-group.error .help-block,.control-group.error .help-inline{position:absolute; left: 23px; bottom: 2px; padding:4px 8px 0 24%; font-size:1.0rem;}
.time .error { margin-bottom: 1.0rem; }
.time p{ position: absolute; left: 0px; bottom: -20px; font-size:1.0rem;}
.area p.error{position: absolute; left: 28%; bottom: 0; font-size:1.0rem;}
.gender p.error{position: absolute; left: 24%; bottom: 0; font-size:1.0rem;}
.agree p.error{position: absolute; left: 2px; top: 10px; font-size:1.0rem;}
}



.header{width: 100%; height: 60px; transition: 0.3s; position: fixed; z-index:999999;background-color: white;border: 1px solid #ddd}
.header .inner{width:100%;}
.header .inner .logo{padding-top:1.6rem; padding-left:5%;width: 150px}
.header .inner .logo a{cursor:pointer;}
.header .inner nav{width: 150px; height: 100%; background: white; position: fixed; right:0px; top:0px; z-index: 999; box-shadow: -5px 0px 5px 0px rgba(0, 0, 0, .3); display:none;}
#gnb{position: absolute; top:100px; right:10%; width:90%;}
#gnb li{margin: 0px 0 1.5rem; text-align:right;}
#gnb li:nth-of-type(1)::after{display: none;}
#gnb li:nth-of-type(5){margin-right: 0;}
#gnb li a{display: block;color: #000;transition: 0.3s; cursor:pointer;font: 1.7rem 'S-CoreDream-6bold'}
#gnb li a:hover{color: #c22e53}
.header .inner .toggle{display:block;position:absolute;top:20px;right:5%;z-index:9999999;font-size:2rem;cursor:pointer;transition:.5s}
.header .inner .toggle i{color: #000;}

#fixed_round{position: fixed; bottom: 20px; right: 20px;z-index: 99}
#fixed_round li{margin: 10px}
#fixed_round .top{width: 40px; height: 40px; border: 2px solid #e72967;border-radius: 50%;text-align: center;font-size: 2rem;line-height: 37px;color: #e72967;transition: 0.3s;background: white;cursor: pointer}
#fixed_round .tel_icon{display: block}
#fixed_round li a{display: block;width: 40px; height: 40px; border: 2px solid #e72967;border-radius: 50%;text-align: center;font-size: 2rem;line-height: 40px;color: #e72967;transition: 0.3s;background: white }
#fixed_round li:nth-of-type(2) a{background: #e4d83a; border: 2px solid #e4d83a}
#fixed_round li:nth-of-type(2) a img{width: 70%; margin: 0 auto;padding-top: 8px} 
#fixed_round .blog_icon a{background: #19ce60; border: 2px solid #19ce60}
#fixed_round .blog_icon a img{width: 70%;margin: 0 auto;padding-top: 8px}
#fixed_round .insta_icon a{background: linear-gradient(45deg,#832796,#e94e32); width: 45px; height: 45px;border: 0}
#fixed_round .insta_icon a i{color: white;font-size: 2rem;line-height: 2.25em}


#wrap{width: 100%;background: #242424; padding-bottom:10rem; opacity: 0;position: relative;}
#wrap .bg1{width: 100%; height: 60%; background:url('../img/review_bg.jpg') 50% bottom no-repeat;position: relative;overflow: hidden;margin-bottom:40px;padding:10rem 0 11rem;}
#wrap .bg1 h3{float: none;font: 1.7rem 'S-CoreDream-6Bold';background: #e72967;width: 200px;text-align: center;border-radius: 50px;color: white;padding: 5px 0px;margin: 0 auto}
#wrap .bg1 h1{text-align: center;padding: 2rem 0 0;font:3.2rem 'S-CoreDream-8Heavy';color: white;}
#wrap .bg1 h1 span{color: #fff}
#wrap .bg1 h2{font: 1.7rem 'S-CoreDream-4Regular';text-align: center;color: white;margin-top: 20px}

#wrap .bg1 .firework{width: 90%;margin: 0 auto;
                animation-name: big;
                animation-duration: 0.7s;
                animation-timing-function: linear;
                animation-iteration-count: infinite;
                animation-direction: alternate;
                animation-fill-mode: none;
                animation-play-state: running;}
#wrap .bg1 .firework img{width: 100%}


@keyframes big {
                from {
transform: scale(1)
                }
                to {
transform: scale(1)
                }
            }




#wrap .phone_img{width:100%; text-align:center; position:absolute; top:300px; left:; z-index:9;}
#wrap .phone_img img{width:90%; margin-left:5%;}


#content{width: 90%;margin: 0 auto;background: white;position: relative;bottom: -10%;box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.29); z-index:10;}
#content .frame{width: 100%;height: 700px;overflow: hidden}
#content .frame h3{width: 100%; text-align: center;background: #e72967;padding: 30px 0 0;color: white; font:1.6rem 'S-CoreDream-4Regular';}
#content .frame h2{width: 100%; text-align: center;background: #e72967;padding:0 0 30px;color: white;font:3rem 'S-CoreDream-8Heavy';}
#content .frame h2 span{display: block;font-size: 1.7rem}
#content .frame iframe{width: 100%;height: 100vh;}

    #formWrap{padding-bottom: 5rem;width: 100%}
    #formWrap h1{text-align: center;font: 4rem 'S-CoreDream-8Heavy';letter-spacing: 2.5px;margin-bottom: 10px}
    #formWrap h1::before{content: '';display: block;width: 30px; height: 9px; border-right: 30px solid #000;background: #e72967;margin: 40px auto 30px}
    #formWrap h3{text-align: center;font: 1.7rem 'S-CoreDream-4Regular';}
    
    #form_title{width: 86%;margin: 50px auto 0px;padding: 20px;background: #e72967}  
    #form_title h4{color: white; text-align: center;font: 1.7rem 'S-CoreDream-4Regular'}
    #form_title ul{width: 100%;margin: 10px auto 0;}
    #form_title ul::after{content: '';display: block;clear: both}
    #form_title ul li{float: none;text-align: center}
    #form_title ul li:nth-of-type(2){margin: 5px 0px}
    #form_title ul li::after{content: ''; display: inline-block;clear: both}
    #form_title ul li a{display: inline-block;color: white;font: 1.4rem 'S-CoreDream-4Regular';}
    #form_title ul li div{float: left}
    #form_title ul li .icon{margin-right: 10px;}


.formBox{margin:0 auto;padding: 10px;background: }
/*form*/
#formBg{width:100%; background:#fff;padding: 7rem 0 5rem}
#formBg h1{margin-top:0; margin-bottom:3rem;}
div.formLabel{width:28%;}
.asterisk_name{position:absolute; top:4px; right:7%; color:#fa6969; font-size:1.8rem; z-index:1;}
.asterisk_phone{position:absolute; top:4px; right:7%; color:#fa6969; font-size:1.8rem; z-index:1;}
.asterisk_area{position:absolute; top:4px; right:7%; color:#fa6969; font-size:1.8rem; z-index:1;}
.name, .phone, .job, .area, .memo{position:relative; margin-bottom:15px;}
.name input{display:inline-block;width:72%;}
.phone input{display:inline-block; width:72%;}
.job_select_wrap{display:inline-block; width:72%;}
.memo textarea{display:inline-block; width:72%; height:85px;}
.form_button{margin-top:3rem;}
.form_button button{background:#e72967; color:#fff; font: 1.8rem 'S-CoreDream-3Light'; padding:1rem 5rem; display:inline-block; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);}
.form_button button:hover{box-shadow: inset 2px 2px 2px rgba(0, 0, 0, 0.2)}

/*footer*/

#footer{width: 100%; ;background: #2d2d2d;padding: 50px 0}
#footer .footerlogo{width: 150px; margin: 0 auto}
#footer p{padding: 10px 10px 0;color: #666; font: 1rem 'S-CoreDream-5Medium';text-align: center}



.active{color:#fa6969; border-bottom:3px solid #fa6969;}




@media screen and (min-width:375px){
    #wrap .bg1 h1{font:4rem;}
    #wrap .phone_img{}
    #content{width: 90%;margin: 0 auto;background: white;position: relative;bottom: 10%;box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.29)}
#content .frame{width: 100%;height: 800px;overflow: hidden}
    #form_title ul{width: 84.5%;margin: 10px auto 0;}
    
}
@media screen and (min-width:412px){
#wrap .bg1{;margin-bottom:80px;}
    #content .frame{width: 100%;height: 900px;overflow: hidden}
    #form_title ul{width: 77%;margin: 10px auto 0;}
}
@media screen and (min-width:1200px){
    
.header{width: 100%; height: 100px;transition: 0.3s; position: fixed; z-index:999;}
.header .inner{width:auto; padding:0 8rem; position:relative;}
.header .inner .logo{position:absolute; left:80px; top:32px; padding:0;width: 200px}
.header .inner .logo a{display:block; }
.header .inner nav{background:none; box-shadow:none; right:0px; top:38px; width: 100%; height:auto; display:block;}
#gnb{width:auto; overflow:hidden; position:absolute; right:80px; top:0;}
#gnb li{ margin: 0px 5rem; text-align:left; float:left;}
.header .inner .toggle{display: none;}
#fixed_round{position: fixed; bottom: 20px; right: 20px;z-index: 99}
#fixed_round li{margin: 10px}
#fixed_round .top{width: 50px; height: 50px; border: 4px solid #c22e53;border-radius: 50%;text-align: center;font-size: 1.5rem;line-height: 48px;color: #c22e53;transition: 0.3s;background: white}
#fixed_round .tel_icon{display: none}
#fixed_round li a{display: block;width: 50px; height: 50px; border: 4px solid #c22e53;border-radius: 50%;text-align: center;font-size: 1.5rem;line-height: 48px;color: #c22e53;transition: 0.3s;background: white }
 #fixed_round li:nth-of-type(2) a img{padding-top: 9px} 
#fixed_round .blog_icon a img{padding-top: 10px} 
 #fixed_round .insta_icon a{width: 55px; height: 55px;border: 0}
#fixed_round .insta_icon a i{color: white;font-size: 2.4rem;line-height: 2.3em}      
    
#wrap{width: 100%; padding-bottom:10rem;}
#wrap .bg1{width: 100%; height: 40%; position: relative;overflow: hidden; padding:17rem 0 8rem; margin-bottom:300px;}
#wrap .bg1 h1{text-align: center;padding:3rem 0 0;font-size:7.8rem; line-height:1.2em;}
#wrap .bg1 h2{font: 3rem 'S-CoreDream-4Regular';text-align: center;color: white;margin-top: 20px}

    
#wrap .bg1 .firework{width: 1200px;display: block;
                animation-name: big;
                animation-duration: 0.7s;
                animation-timing-function: linear;
                animation-iteration-count: infinite;
                animation-direction: alternate;
                animation-fill-mode: none;
                animation-play-state: running;}
#wrap .bg1 .firework img{width: 100%}


@keyframes big {
                from {
transform: scale(1)
                }
                to {
transform: scale(1.03) 
                }
            }




#wrap .phone_img{width:;position: absolute;left: 0;top:0;display: block;padding-top: 50rem}
#wrap .phone_img img{margin-left:7%; width:auto;}


#content{width: 1000px;margin: 0 auto;background: white;}
#content .frame{width: 100%;height: 1100px}
#content .frame h3{padding: 30px 0 0;font-size:2.8rem;} 
#content .frame h2{padding:0  0 30px;font-size:7.8rem;} 
    #content .frame h2 span{display: inline-block;font-size: 3.4rem}
#content .frame iframe{width: 100%;}


    #formWrap{padding-bottom: 10rem}
    #formWrap h1{text-align: center;font: 6rem 'S-CoreDream-8Heavy';letter-spacing: 2.5px;margin-bottom: 10px}
    #formWrap h1::before{content: '';display: block;width: 30px; height: 9px; border-right: 30px solid #000;background: #e72967;margin: 40px auto 30px}
    #formWrap h3{text-align: center;font: 2.4rem 'S-CoreDream-4Regular';}
    
    #form_title{width: 620px;margin: 50px auto 0px;padding: 20px 40px;background: #e72967}  
    #form_title h4{color: white; text-align: center;font: 2.4rem 'S-CoreDream-4Regular'}
    #form_title ul{width: 465px;margin: 10px auto 0}
    #form_title ul::after{content: '';display: block;clear: both}
    #form_title ul li{float: left;}
    #form_title ul li:nth-of-type(2){margin: 0px 20px}
    #form_title ul li::after{content: ''; display: block;clear: both}
    #form_title ul li a{display: block;color: white;font: 1.7rem ''}
    #form_title ul li div{float: left}
    #form_title ul li .icon{margin-right: 10px}
    
/*con01*/    
.formBox{width:500px; margin:0 auto;padding: 40px 10rem;background: #eee}
div.formLabel{width:27%;}
.name, .phone, .job, .area, .memo{margin-bottom:1.5rem;}
.name{width:47%; margin-right:4%;}
.name input{width:72%;}
.phone{width:47%;}
.phone input{width:72%;}
.job{width:99%;}
.job_select_wrap{width:72%;}
.memo{width:99%;}
.memo textarea{width:72%;}
.form_button button{width:50%;}
    
    #footer p{font-size: 1.4rem}
    
}