body { padding: 0px !important; }

.wrap { position:relative;width:100%;margin:0px;padding:0px; font-size:13px; letter-spacing:0px; color:#111; min-width: 320px; }

.wrap > header { position:relative;left:0px;top:0px;right:0px;display:block;width:100%;margin:0px;padding:0px; font-size:13px; letter-spacing:0px; color:#111;min-width: 320px; }
.wrap > footer { position:relative; display:block; background: #f8f8f8; border-top:0px solid #ddd; }
.wrap > section { position:relative; }

header > div {  border-bottom:0px solid rgba(0,0,0,0.2);z-index:5;height: 90px;box-sizing: border-box;max-width: 1200px;min-width: 320px;margin: 0 auto;height: 90px;position: absolute;left: 0;top: 0;right: 0; }
header > div > h1 { display: block;width: 125px;height: 90px;background: url(../images/logo_wh.png) no-repeat center center;background-size: contain;font-size: 0;position: absolute;top: 0px; }
header > div > h1.surigo { background: url(../images/logo_surigo_w.png) no-repeat center center;background-size: contain;width:150px; }
header > div > h1.miribom { background: url(../images/logo_miribom_wh.png) no-repeat center center;background-size: contain;width:150px; }
header > div > h1 > a { display: block;width: 100%;height: 100%; }
header > div > nav { display: block;box-sizing:border-box;font-size: 0;overflow: hidden;position: absolute;right: 0px;top: 0px; }
header > div > nav > ul { display: block;height: 90px;box-sizing: border-box;font-size: 0; }
header > div > nav > ul > li { display: inline-block; }
header > div > nav > ul > li > a { display: block;width: auto;height: 90px;line-height: 90px;color: #fff;padding: 0px 30px;font-size: 20px;font-weight: 500; }

header.fixed { background: #fff;position: fixed;left: 0;top: 0;right: 0;height: 90px;z-index: 10;box-shadow: 1px 1px 20px rgba(0,0,0,0.1); }
header.fixed > div { position: absolute;left: 0;top: 0;right: 0;;z-index: 10;transition: all ease 2s 0s; }
header.fixed > div > h1 { background: url(../images/logo.png) no-repeat center center;background-size: contain; }
header.fixed > div > h1.surigo { background: url(../images/logo_surigo.png) no-repeat center center;background-size: contain;width:150px; }
header.fixed > div > h1.miribom { background: url(../images/logo_miribom_wh.png) no-repeat center center;background-size: contain;width:150px; }
header.fixed > div > nav > ul > li > a { color: #111; }

footer > div { display: block;position: absolute;bottom: 30px;left:0;right: 0;font-size: 13.5px;background: transparent;color:rgba(255,255,255,0.7);text-align: center;font-weight: 300; }
footer > div > span { display:inline-block;font-size:13.5px;color:rgba(255,255,255,0.6);vertical-align: bottom;line-height:20px;}
footer > div > span > b { font-weight: 600;color:rgba(255,255,255,0.9);}
footer > div > span + span { margin-left:25px; }


section > .visual { display:block;padding:0px;height:750px;overflow: hidden;background: url(../images/bg_home.jpg) no-repeat center;background-size: cover;position: relative; }
/* section > .visual { display:block;padding:0px;height:700px;overflow: hidden;position: relative; background: linear-gradient(to bottom right, #133fc2, #5785ec);overflow: hidden; }
section > .visual::before { content: '';width: 380px;height: 380px;background: url(../images/visual_patt01.png) no-repeat;position: absolute;right: 62px; top: -50px; }
section > .visual::after { content: '';width: 800px;height: 500px;background: url(../images/visual_patt02.png) no-repeat;position: absolute;left: 280px; bottom: -380px;background-size: contain;} */
section > .visual .slogan { padding-top:170px;z-index: 2;position: relative;max-width: 1200px;margin: 0 auto;box-sizing: border-box;height: 750px; }
section > .visual .slogan h4 { display:block;font-size:65px;color:#111;line-height:85px;letter-spacing: -5px;color: #fff;font-weight: 500; }
section > .visual .slogan p { display:block;font-size:20px;color:#999;line-height:28px;margin-bottom:10px;margin-left:3px;font-weight:400;margin-top: 15px;color: #fff;letter-spacing: -1px; }
section > .visual .slogan .phone { display: block;position: absolute;right: 0;bottom: -6px; }
section > .visual .slogan .phone img:nth-child(1) { width: 330px; }
section > .visual .slogan .phone img:nth-child(2) { width: 380px;margin-left: -30px; }
section > .visual .slogan a { margin-top:50px;width: 250px;height: 60px;display: block;color: #fff;border: 2px solid #fff;border-radius: 100px;line-height: 55px;font-size: 18px;padding-left: 25px;box-sizing: border-box;position: relative; }
section > .visual .slogan a::after { content: '\e93e';display:block;height:20px;font-size:20px;line-height:20px;font-family : 'xeicon' !important; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;text-align: center;color:#fff;position: absolute;right: 20px;top: 18px; }
section > button { position: absolute;bottom: 30px;left: 50%;width: 100px;height: 18px;font-size: 0;margin-left: -50px;z-index: 5; }
section > button::after { content: '\e941';display:block;height:20px;font-size:48px;line-height:20px;font-family : 'xeicon' !important; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;text-align: center;color: rgba(0,0,0,0.3); }

.content { display:block;position: relative;margin:0 auto;font-size:0px; }
.content div h3 { display: block;font-size: 50px;text-align: center;font-weight: 400;letter-spacing: -3px; line-height: 80px;}
.content div h3 > i { display:inline-block;height: 80px;vertical-align: bottom;width:250px;background: url(../images/logo_surigo.png) no-repeat center center;background-size: contain;font-size:0px;margin-right:5px;}
.content div h3 > span { display: inline-block; font-weight: 500; color:#5081eb;}

.about { display: block;margin: 0 auto;max-width: 1200px;min-width:320px;padding-top: 130px}
.about > p { display: block;font-size: 22px;text-align:  center;margin-top: 20px;line-height: 32px; }
.about > p > i { display:inline-block;height: 32px;vertical-align: bottom;width:120px;background: url(../images/logo_surigo.png) no-repeat center center;background-size: contain;font-size:0px;margin-right:5px;}
.about > .advantage { display: block;box-sizing: border-box;font-size: 0;margin: 130px auto auto auto;font-size: 0; }
.about > .advantage > div { display: inline-block;width: calc(25% - 40px);border-radius: 20px;text-align: center;padding: 50px 20px 55px 20px;box-sizing: border-box; box-shadow: 2px 2px 6px rgba(0,0,0,0.3);}
.about > .advantage > div + div { margin-left: 53px; }
.about > .advantage > div:nth-child(1) { background: #333399; }
.about > .advantage > div:nth-child(2) { background: #3366cc; }
.about > .advantage > div:nth-child(3) { background: #3399cc; }
.about > .advantage > div:nth-child(4) { background: #48b08a; }
.about > .advantage > div > p { display: block;color: #fff;font-size: 34px;line-height: 44px;overflow: hidden; font-weight:500;}
.about > .advantage > div > p::before { content: '';display: block;width: 3px;height: 18px;background: #ddd;transform: rotate(30deg);margin: auto auto 20px auto; }
.about > .advantage > div > p::after { content: '';display: block;width: 3px;height: 18px;background: #ddd;transform: rotate(30deg);margin: 20px auto auto auto;  }
.about > .advantage > div > span { display: block;font-size: 16px;color: #fff;margin-top: 25px;line-height: 25px; }

.support { display: block;margin-top: 130px;background: #f4f4f4;padding: 130px 0;height: 1100px;box-sizing: border-box; }
.support > .support_inner { display: block;max-width: 1200px;margin: 0 auto;position: relative;box-sizing: border-box; }
.support > .support_inner > .phone_wrap { display: inline-block;position: relative; }
.support > .support_inner > .phone_wrap > .phone_bg { position: absolute;top: -35px;left: 0px;z-index: 1;overflow: hidden;border-radius: 40px;height: 790px;width: 500px; }
.support > .support_inner > .phone_wrap > .phone_bg > img {  }
.support > .support_inner > .phone_wrap > .phone { display:inline-block;position:  relative;top: 35px;left: 79px;width: 298px;height: 647px;overflow: hidden;}
.support > .support_inner > .phone_wrap > .phone .items { display: inline-block;width: 298px;height: 647px; }
.support > .support_inner > .phone_wrap > .phone .items.bg1 { background: url(../images/slider_01.jpg) no-repeat;background-size: contain; }
.support > .support_inner > .phone_wrap > .phone .items.bg2 { background: url(../images/slider_02.jpg) no-repeat;background-size: contain; }
.support > .support_inner > .phone_wrap > .phone .items.bg3 { background: url(../images/slider_03_re.gif?2) no-repeat;background-size: contain; }
.support > .support_inner > .phone_wrap > .phone .items.bg4 { background: url(../images/slider_04.jpg) no-repeat;background-size: contain; }
.support > .support_inner > .phone_wrap > .phone .items.bg5 { background: url(../images/slider_05.jpg) no-repeat;background-size: contain; }

.support > .support_inner > .mobile { display: block;position: absolute;top: 770px;left: 0;right: 0;z-index: 10; }
.support > .support_inner > .mobile > ul { display: block;box-sizing: border-box;font-size: 0;overflow: hidden;margin-left: -10px;text-align: center; }
.support > .support_inner > .mobile > ul > li { display: inline-block;font-size: 16px;width: 30px;height: 30px;background: #5081eb;color: #fff;border-radius: 50%;text-align: center;line-height: 29px;margin-left: 10px; }

.support > .support_inner > ul { display: inline-block;box-sizing: border-box;font-size: 0;padding: 80px 0px 0px 230px; position:relative; z-index: 1;}
.support > .support_inner > ul > li { display: block;font-size: 24px;color: #353741;padding: 20px 40px 25px 90px; ;position: relative;font-weight: 500;box-sizing: border-box;cursor: pointer;margin-bottom: 5px;font-weight: 500; }
.support > .support_inner > ul > li::before { content: '';display: block;position: absolute;top: 25px;left: 35px;width: 35px;height: 35px;line-height: 35px;background: #aaa;text-align: center;color: #fff;border-radius: 50%;font-size: 20px; }
.support > .support_inner > ul > li.active::before { background: #5081eb; }
.support > .support_inner > ul > li.active { color: #5081eb;background-size: 100% 120px;background: #fff;border-radius: 10px;box-shadow: 1px 1px 20px rgba(0,0,0,0.1); }
.support > .support_inner > ul > li:nth-child(1)::before { content: '1';}
.support > .support_inner > ul > li:nth-child(2)::before { content: '2';}
.support > .support_inner > ul > li:nth-child(3)::before { content: '3';}
.support > .support_inner > ul > li:nth-child(4)::before { content: '4';}
.support > .support_inner > ul > li:nth-child(5)::before { content: '5';}
.support > .support_inner > ul > li > span { display: block;font-size: 17px;line-height: 25px;margin-top: 5px;color: #353741;letter-spacing: -1px;font-weight: 400; }

.download {  display: block;background: url(../images/bg_download.jpg) no-repeat center;background-size: cover;padding: 200px 0px 150px 0px;text-align: center; }
.download > h3 { color: #fff; }
.download > h2 { display: block;background: url(../images/logo_wh.png) no-repeat center;width: 220px;height: 60px;background-size: contain;margin: 25px auto auto auto;font-size: 0; }
.download > h2.surigo { display: block;background: url(../images/logo_surigo_w.png) no-repeat;width: 280px;height: 80px;background-size: contain;margin: 25px auto auto auto;font-size: 0; }
.download > h2.miribom { display: block;background: url(../images/logo_miribom_wh.png) no-repeat;width: 280px;height: 80px;background-size: contain;margin: 25px auto auto auto;font-size: 0; }
.download > p { display: block;font-size: 35px;color: #fff;margin-top: 30px;letter-spacing: -2px; }
.download > p > span { display: inline-block; }
.download .btns { padding:70px 0px 10px 0px;text-align: center;font-size:0px;}
.download .btns > a { display: inline-block;width: auto;color: #fff;border: 2px solid #fff;border-radius: 100px;line-height: 54px;font-size: 20px;padding:0px 50px;box-sizing: border-box;position: relative;margin: 0;text-align: center; font-weight: 600;letter-spacing: -1px;margin:0px 5px;margin-bottom:10px;}
.download .btns > a.cs_btn { color: #5081eb;border: 2px solid #fff;background: #fff;}

.top_btn { display: block;width: 70px;height: 70px;background: rgba(0,0,0,0.5);position: fixed;right: 50px;bottom: 50px;z-index: 999}
.top_btn::after { content: '\e944';display:block;height:20px;font-size:40px;line-height:70px;font-family : 'xeicon' !important; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;text-align: center;color: #fff; }

.app_btn{display:block; margin:70px auto auto auto; position:relative; background:#000; border:2px solid #fff; padding:20px 20px; width:215px; border-radius: 10px;}
.app_btn:last-of-type{margin:30px auto auto auto;}
.app_btn > img{width:60px; height: 60px; position:absolute; left:20px; top:50%; margin-top:-30px;}
.app_btn > .txt{text-align:left; margin-left:70px;}
.app_btn > .txt > div{display:block; color:#fff; line-height: 1.2;}
.app_btn > .txt > div:nth-of-type(1){font-size:13px;}
.app_btn > .txt > div:nth-of-type(2){font-size:23px;}


div.pop { display:none; position: fixed;top:0px;left:0px;right:0px;top:0px;bottom:0px;background: rgba(0,0,0,0.7);z-index: 1000;}
div.pop > .pop_wrap { position: absolute;top:50%;left:50%;transform: translate(-50%, -50%);width:700px;background: #fff;border-radius: 20px;}
div.pop > .pop_wrap > header { padding:20px 30px 20px 30px;border-bottom:1px solid #ccc;position: relative;}
div.pop > .pop_wrap > header > h2 { font-size:28px;line-height: 38px;height: 38px;font-weight: 600;letter-spacing: -1px;}
div.pop > .pop_wrap > header > p { font-size:14px;line-height: 22px;height: auto;font-weight: 400;color:#999;}
div.pop > .pop_wrap > header > a.pop_close { position: absolute;width:50px;height:50px;line-height: 50px;text-align: center;display:block;right:15px;top:10px;font-size:46px;}
div.pop > .pop_wrap > section { padding:25px 30px;}






div.pop > .pop_wrap > section .inputStyle,
div.pop > .pop_wrap > section .textStyle { display: block; height: 48px; line-height: 48px; vertical-align: middle; border: 1px solid #ddd; padding: 0 15px; border-radius: 4px; cursor: pointer; margin-bottom: 15px;background: #f8f8f8;}
div.pop > .pop_wrap > section .inputStyle > input { height: inherit; width: 100%; font-size: 15px; }
div.pop > .pop_wrap > section .selectStyle { margin-bottom: 15px; display: block; position: relative; }
div.pop > .pop_wrap > section .selectStyle > select{ font-size: 15px; }
.selectStyle:after { content: "\e936"; font-family: "xeicon"; color: #808080; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); font-size: 2rem; }

div.pop > .pop_wrap > section .textStyle { padding: 10px 15px; height: 150px; }
div.pop > .pop_wrap > section .textStyle > textarea { font-size: 15px; width: 100%; height: 100%; resize: none;}
div.pop > .pop_wrap > section .doubleInput { display: flex; align-items: center; gap: 15px; }
div.pop > .pop_wrap > section .doubleInput .inputStyle { width: calc((100% - 15px) / 2); box-sizing: border-box; }


div.pop > .pop_wrap > section button { width: auto;padding:0px 50px; line-height: 60px; text-align: center; display: block; background: #5081eb; color: #fff;letter-spacing: -1px;font-weight: 600; font-size: 18px; margin: 0 auto; border-radius: 100px;margin-top:20px; }


/* 미리봄 팝업 추가 250514 css */
.inquiry_pop_wrap{display: none; position: absolute;top: 100px;left: 50%; z-index: 8;width: 450px;border: 1px solid #ddd;transform:translateX(-50%);}
.inquiry_pop_wrap .close_btn02{position: absolute;top: 10px;right: 10px;width: 25px;height: 25px;cursor:pointer;}
.inquiry_pop_wrap .close_btn02 span{position: absolute;top: 50%;left: 50%; display: block; width: 100%;height: 2px;background: #000;transform:translate(-50% , -50%) rotate(45deg) ;}
.inquiry_pop_wrap .close_btn02 span:nth-child(2){transform:translate(-50% , -50%) rotate(-45deg);}
.inquiry_pop_wrap .pop_img img{display: block; width: 100%;}
.inquiry_pop_wrap .pop_img button{display: block;cursor:pointer;} 
.inquiry_pop_wrap .close_box{display: flex;align-items: center;justify-content: flex-end;gap:10px; width: 100%;height: 30px;background: #fff;padding: 0 15px;box-sizing:border-box;}
.inquiry_pop_wrap .close_box .i_box{display: flex;align-items: center;gap:5px;}
.inquiry_pop_wrap .close_box .i_box label{font-size: 13px;font-weight: 500;color: #000;margin-right: 0;padding: 0;}
.inquiry_pop_wrap .close_box .i_box input[type="checkbox"]{width: 15px;height: 15px;appearance: auto;}
.inquiry_pop_wrap .close_box button{border: 0;background: transparent;padding: 0;cursor: pointer;}












