@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);

/*font*/
@font-face {font-family: 'SBAggroL';src: url('//cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SBAggroL.woff') format('woff');font-weight: normal;font-style: normal;}
@font-face {font-family: 'SBAggroM';src: url('//cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SBAggroM.woff') format('woff');font-weight: normal;font-style: normal;}
@font-face {font-family: 'SBAggroB';src: url('//cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SBAggroB.woff') format('woff');font-weight: normal;font-style: normal;}
@font-face {font-family: 'Cafe24Ohsquare';src: url('//cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/Cafe24Ohsquare.woff') format('woff'); font-weight: normal;font-style: normal;}

/*--------------------
---------------------*/


.vr_wrap{font-family: 'Noto Sans KR', sans-serif;width:100%; height:100%; min-width:320px; max-width:2500px; margin: -110px auto -50px auto; padding:0; box-sizing:border-box; word-break:keep-all}

.vr_floatingbtn{ position:fixed; top:215px; right:50px;width:180px; padding-top:130px; background:url(images_visionroad/vr_floatingbtn_bg1.png) left top no-repeat; background-size:180px 150px; z-index:1000 }
.vr_floatingbtn > a{ display:block;width:100%; padding:28px 0 28px 24px; border-radius:0 23px 0 0; background-color:#b2ae0f; box-sizing:border-box;}
.vr_floatingbtn > a > span{ display:block;}
.vr_floatingbtn > a > span.txt1{ font-size:15px; font-weight:500;line-height:20px; letter-spacing:-0.04em; color:#4e4c0d;word-break:keep-all}
.vr_floatingbtn > a > span.txt2{ display:inline-block; margin-top:10px; padding-right:26px; font-family: 'SBAggroM'; font-size:22px; font-weight:500; background:url(images_visionroad/floating_arrow1.png) right 1px no-repeat; background-size:23px 23px;line-height:29px; letter-spacing:-0.05em; color:#fff;word-break:keep-all}
.vr_floatingbtn > a:hover{ background-color:#000}
.vr_floatingbtn > a:hover > span.txt1{ color:#666}
.vr_floatingbtn_bt{ top:inherit; bottom:50px;}

@media only screen and (max-width:1400px) {
.vr_wrap{margin: -110px auto -100px auto;}
}
@media only screen and (max-width:1300px) {
.vr_floatingbtn{ right:15px;}
.vr_wrap{margin: -110px auto -130px auto;}
}
@media only screen and (max-width:1200px) {
.vr_wrap {margin: 0 auto -130px auto;}
}
@media only screen and (max-width:900px) {
.vr_floatingbtn{ top:inherit; bottom:0px; right:0px;width:100%; padding-top:0px; background:none;}
.vr_floatingbtn > a{padding:15px 0 15px 0px;  border-radius:0 0px 0 0; background-color:#ff6e24;text-align:center}
.vr_floatingbtn > a > span.txt1{ display:none}
.vr_wrap {margin: 0 auto;}
}

/*vr_header*/
.vr_header{ position:absolute; left:0; top:0; height: 109px; z-index:30}
@media only screen and (max-width:1200px) {
.vr_header{ height: 100px;}
}

.vr_footer{ position:relative; left:0; top:0; height:500px; z-index:30}
.sub_footer_wrap {background: #fff !important;z-index: 30;position: relative;}
#pu21700 {background: #fff !important;}

/*vr_top*/
.vr_top{ position:fixed; width:100%; min-width:320px; height:100%; margin-top:-0px; background-color:#d4edfb; background-image:url(images_visionroad/vr_cloud1.png); background-position: center 218px; background-repeat:no-repeat; background-size:1950px 340px; z-index:0}
.vr_top > .vr_title{ width:570px; margin:0 auto; padding:232px 0 187px 0;text-align:center}
.vr_top > .vr_title > h1{ width:504px; height:260px; margin:0 auto; background:url(images_visionroad/title1.png) center no-repeat; background-size:100% 100%; text-indent:-999999px}
.vr_top > .vr_title > p{font-family: 'Noto Sans KR', sans-serif;padding:0; margin:0; font-size:20px; line-height:30px; letter-spacing:-0.03em; text-align:center}
.vr_top > .vr_title > p.vr_txt1{font-family: 'Noto Sans KR', sans-serif;margin-top:22px; font-weight:500; color:#100f0f}
@media only screen and (max-width:900px) {
.vr_top{ background-position: center 218px; background-size:1600px 279px;}
.vr_top > .vr_title{ width:570px; margin:0 auto; padding:200px 0 187px 0;text-align:center}
.vr_top > .vr_title > h1{ width:400px; height:200px}
.vr_top > .vr_title > p{ font-size:18px; line-height:25px;}
.vr_top > .vr_title > p.vr_txt1{ margin-top:20px;}	
}
@media only screen and (max-width:700px) {
.vr_top{ background-position: center 150px; background-size:820px 143px;}
.vr_top > .vr_title{ width:100%; padding:160px 0 187px 0;}
.vr_top > .vr_title > h1{ width:270px; height:139px; background-image:url(images_visionroad/title1_m.png)}
.vr_top > .vr_title > p{ font-size:14px; line-height:20px; letter-spacing:-0.05em}
.vr_top > .vr_title > p.vr_txt1{ margin-top:12px;}	
}
@media only screen and (max-width:400px) {
.vr_top > .vr_title{ padding:150px 0 187px 0;}
.vr_top > .vr_title > h1{ width:260px; height:134px}
.vr_top > .vr_title > p{ font-size:13px; line-height:19px; letter-spacing:-0.07em}
}

/*vr_dept1 미션브이로그 대공개*/
.vr_dept1{ position:relative; width:100%; padding-top:1060px; background:url(images_visionroad/dept1_bg11.png) center 584px no-repeat; background-size:2500px 1900px; z-index:10}
.vr_dept1 > .cont{ position:relative; width:100%; padding:0 0px 0px 0px; background-image:url(images_visionroad/n_dept2_bg.png), url(images_visionroad/dept1_bg21.png), url(images_visionroad/n_dept1_bg1.png); background-position:center 960px, center 243px, center 105px; background-repeat:no-repeat, no-repeat, no-repeat; background-size:100% auto, 2500px 2000px, 1420px 909px; box-sizing:border-box}
.vr_dept1 > .cont > h2{ width:680px; height:230px; margin:-20px auto 0 auto; background:url(images_visionroad/n_dept_tit.png) center no-repeat; background-size:100% 100%; text-indent:-999999px }
.vr_dept1 > .cont  > .vr_d1_cont{ position:relative; width:100%; max-width:900px; margin:0 auto; padding:360px 30px 0 30px; z-index:1800 ; box-sizing:border-box; word-break:keep-all}
.vr_dept1 > .cont  > .vr_d1_cont > .video{ position:relative; width:100%; padding-top:56.222%; box-shadow: 5px 10px 15px 3px rgba(0, 0, 0, 0.3)}
.vr_dept1 > .cont  > .vr_d1_cont > .video > .visionroad_iframe{ position:absolute; left:0; top:0; width:100%; height:100%; border:0; background-color:#333 ; box-sizing:border-box; z-index:1750}
@media only screen and (max-width:1150px) {
.vr_dept1{ padding-top:960px; background-position: center 600px; background-size:1908px 1450px; }
}
@media only screen and (max-width:900px) {
.vr_dept1{ padding-top:860px; background-position: center 530px; background-size:1700px 1292px; }
.vr_dept1 > .cont > h2{ width:400px; height:135px;}
.vr_dept1 > .cont{ position:relative; width:100%; padding:0 0px 0px 0px; background-position:center 660px, center 0px, center 65px; background-size:1300px auto, 2500px auto, 850px auto}
.vr_dept1 > .cont  > .vr_d1_cont{ padding:220px 30px 0 30px;}
}
@media only screen and (max-width:700px) {
.vr_dept1{ padding-top:620px; background-position: center 430px; background-size:190% auto; }
}
@media only screen and (max-width:540px) {
.vr_dept1 > .cont  > .vr_d1_cont{ padding:220px 10px 0 10px;}
}
@media only screen and (max-width:510px) {
.vr_dept1 > .cont > h2{ width:300px; height:120px; background:url(images_visionroad/sian_131_m.png) left top no-repeat; background-size:100% 100%}
.vr_dept1 > .cont{ background-position:center 660px, center -100px, center 65px; background-size:900 auto, 2500px auto, 650px auto}
.vr_dept1 > .cont  > .vr_d1_cont{ padding:180px 10px 0 10px;}
}
@media only screen and (max-width:400px) {
.vr_dept1 > .cont{  background-position:center 460px, center -200px, center 65px; background-size:700px auto, 2500px auto, 500px auto}
.vr_dept1 > .cont  > .vr_d1_cont{ padding:150px 10px 0 10px;}
}

/*img_cont 미션수행 정보*/
.sns{ width:100%; max-width:1230px; margin:0 auto; padding:107px 10px 90px 10px; }
.sns > .snstxt{ position:relative; width:100%; height:0;}
.sns > .snstxt > li{ position:absolute; top:0; padding:16px 21px 0 21px; border:2px solid #e5eff3; border-radius:16px; background-color:#fff;box-shadow: 3px 3px 0px 0px rgba(255, 255, 255, 0.3); z-index:100}
.sns > .snstxt > li > span{ display:block; font-family: 'Noto Sans KR', sans-serif; }
.sns > .snstxt > li > span.txt1{ font-size:20px; line-height:25px; color:#2c2c2c; letter-spacing:-0.06em}
.sns > .snstxt > li > span.txt2{ padding-bottom:14px; font-size:19px; line-height:25px; color:#2c2c2c; letter-spacing:-0.03em}
.sns > .snstxt > li > span.bg_box{ position:relative; width:100%; height:0; z-index:100}
.sns > .snstxt > li > span.bg_box > span{ display:block; position:absolute; top:0; width:25px; height:25px; background-position:center center; background-repeat:no-repeat; background-size:100% 100%}
.sns > .snstxt > li.right > span.bg_box > span.bg{ left:-2px; background-image:url(images_visionroad/snstxt_Bg1.png)}
.sns > .snstxt > li.left > span.bg_box > span.bg{ right:-2px; background-image:url(images_visionroad/snstxt_Bg2.png)}
.sns > .snstxt > li.left1{ padding:18px 20px;}
.sns > .snstxt > li.left1 > span.txt1{ padding-left:40px;  font-size:22px; font-weight:500; background:url(images_visionroad/txt_icon1.png) left center no-repeat; background-size:30px 30px; line-height:30px; color:#131313;}
.sns > .snstxt > li.left1 > span.txt1 > strong{font-family: 'Noto Sans KR', sans-serif; padding-left:10px; font-weight:800}
.sns > .snstxt > li.left1 > span.bg_box > span{ top:18px}
.sns > .snstxt > li.right1{ right:0; top:110px}
.sns > .snstxt > li.right2{right:3%; top:255px}
.sns > .snstxt > li.left1{left:9%; top:160px}
.sns > .snstxt > li.left2{left:0; top:320px}

.sns > .sns_box{ width:380px; height:585px; margin:0 auto; border-radius:20px; background-color:#fff;box-shadow: 5px 10px 15px 3px rgba(0, 0, 0, 0.3)}
.sns > .sns_box > .top{ border-radius:20px; background:url(images_visionroad/sns_top_2.jpg) right center no-repeat ; background-size:64px 64px}
.sns > .sns_box > .top > img{ border-radius:20px}
.sns > .sns_box > .txt_box{ position:relative; width:380px; height:380px; padding:40px 35px 0 35px; font-family: 'Cafe24Ohsquare'; letter-spacing:-0.05em;background:url(images_visionroad/sns_box_bg.png) left top no-repeat; background-size:100% 100%; box-sizing:border-box}
.sns > .sns_box > .txt_box > p.txt{ font-size:26px; line-height:30px; color:#4d4e4e;}
.sns > .sns_box > .txt_box > p.txt > strong{ display:block; font-family: 'Cafe24Ohsquare'; font-size:45px; line-height:51px; color:#fa6d1d; }
.sns > .sns_box > .txt_box > p.txt1{ padding-top:14px; font-size:89px; line-height:92px; letter-spacing:-0.05em; color:#eb9610;}
.sns > .sns_box > .txt_box > .h_bg{ display:block; position:absolute; left:-8px; bottom:0px; width:397px; height:166px; background:url(images_visionroad/h_bg1.png) left top no-repeat; background-size:100% 100%}
.sns > .sns_box > .bottom > .b_t{ width:100%; height:48px; background-image:url(images_visionroad/sns_btm_1.jpg), url(images_visionroad/sns_btm_1-05.jpg), url(images_visionroad/sns_btm_3.jpg); background-position:left top, right top, center top; background-repeat:no-repeat, no-repeat, no-repeat; background-size:auto 100%, auto 100%, auto 100% }
.sns > .sns_box > .bottom > .txt { padding:0 18px 14px 18px;}
.sns > .sns_box > .bottom > .txt > ul:after{display:block;content:"";clear:both;}
.sns > .sns_box > .bottom > .txt > ul > li{ float:left; padding-left:5px; font-family: 'Noto Sans KR', sans-serif; font-size:14px; font-weight:700; line-height:23px; letter-spacing:-0.05em; color:#2c2c2c;}
.sns > .sns_box > .bottom > .txt > ul > li.icon{ width:42px; height:23px; margin-right:3px; background:url(images_visionroad/sns_icon.png) center top no-repeat; background-size:100% 100%;}
.sns > .sns_box > .bottom > .txt > ul.tag{ margin-top:6px;}
.sns > .sns_box > .bottom > .txt > ul.tag > li{ color:#123053}
.sns > .sns_box > .bottom > .txt > ul.tag > li:first-child{ font-weight:500; color:#2c2c2c;}
.sns > .sns_box > .h_bg{ position:relative; width:100%; height:0}
.sns > .sns_box > .h_bg > li{ position:absolute; background-position:center center; background-repeat:no-repeat; background-size:100% 100%}
.sns > .sns_box > .h_bg > li.bg1{ left:-118px; bottom:250px; width:75px; height:75px; background-image:url(images_visionroad/h_bg_l1.png)}
.sns > .sns_box > .h_bg > li.bg2{ left:-100px; bottom:117px; width:65px; height:65px; background-image:url(images_visionroad/h_bg_l2.png)}
.sns > .sns_box > .h_bg > li.bg3{ right:-90px; bottom:135px; width:65px; height:65px; background-image:url(images_visionroad/h_bg_r1.png)}
.sns > .sns_box > .h_bg > li.bg4{ right:-87px; bottom:15px; width:32px; height:32px; background-image:url(images_visionroad/h_bg_r2.png)}
@media only screen and (max-width:1180px) {
.sns > .snstxt > li.right1{ width:32.203%}
.sns > .snstxt > li.right2{right:4%; top:255px}
.sns > .snstxt > li.left1{left:4.5%; top:160px}
}
@media only screen and (max-width:1080px) {
.sns > .snstxt > li.right2{right:1%; top:255px}
.sns > .snstxt > li.left1{left:1%; top:160px}
}
@media only screen and (max-width:900px) {
.sns{ padding:55px 10px 40px 10px;max-width:760px; }

.sns > .snstxt > li{ padding:10px 11px 0 11px; border-radius:8px; }
.sns > .snstxt > li > span.txt1{ font-size:13px; line-height:18px; }
.sns > .snstxt > li > span.txt2{ padding-bottom:8px; font-size:11px; line-height:18px; }

.sns > .snstxt > li > span.bg_box > span{ width:15px; height:15px;}
.sns > .snstxt > li.right > span.bg_box > span.bg{ left:-1px;}
.sns > .snstxt > li.left > span.bg_box > span.bg{ right:-1px;}
.sns > .snstxt > li.left1{ padding:10px 11px;}
.sns > .snstxt > li.left1 > span.txt1{ padding-left:22px;  font-size:13px; background-size:18px 18px; line-height:20px;}
.sns > .snstxt > li.left1 > span.txt1 > strong{padding-left:5px;}
.sns > .snstxt > li.left1 > span.bg_box > span{ top:11px}

.sns > .snstxt > li.right1{ width:auto; right:0; top:55px}
.sns > .snstxt > li.right2{right:5%; top:180px}
.sns > .snstxt > li.left1{left:10%; top:60px}
.sns > .snstxt > li.left2{left:0; top:160px}

.sns > .sns_box{ width:200px; height:auto; border-radius:12px;box-shadow: 3px 8px 10px 3px rgba(0, 0, 0, 0.3)}
.sns > .sns_box > .top{ border-radius:12px; background:url(images_visionroad/sns_top_2.jpg) right center no-repeat ; background-size:40px 40px}
.sns > .sns_box > .top > img{ border-radius:12px; width:auto; height:40px}
.sns > .sns_box > .txt_box{width:200px; height:200px; padding:15px 10px 0 10px; }
.sns > .sns_box > .txt_box > p.txt{ font-size:15px; line-height:16px;}
.sns > .sns_box > .txt_box > p.txt > strong{ font-size:22px; line-height:28px; }
.sns > .sns_box > .txt_box > p.txt1{ padding-top:8px; font-size:45px; line-height:50px;}
.sns > .sns_box > .txt_box > .h_bg{ width:220px; height:92px; }
.sns > .sns_box > .bottom > .b_t{ height:25px;}
.sns > .sns_box > .bottom > .txt { padding:0 5px 10px 5px;}
.sns > .sns_box > .bottom > .txt > ul > li{ padding-left:3px; font-size:11px; line-height:16px; }
.sns > .sns_box > .bottom > .txt > ul > li.icon{ width:29px; height:16px; margin-right:2px;}
.sns > .sns_box > .bottom > .txt > ul.tag{ margin-top:3px;}
.sns > .sns_box > .h_bg > li.bg1{left:-60px; bottom:125px; width:40px; height:40px; }
.sns > .sns_box > .h_bg > li.bg2{left:-50px; bottom:55px; width:30px; height:30px;}
.sns > .sns_box > .h_bg > li.bg3{ right:-45px; bottom:67px; width:30px; height:30px;}
.sns > .sns_box > .h_bg > li.bg4{ right:-42px; bottom:7px; width:16px; height:16px; }
}

@media only screen and (max-width:710px) {
.sns > .snstxt > li.right1{ width:auto; right:0; top:55px}
.sns > .snstxt > li.right2{right:0%; top:180px}
.sns > .snstxt > li.left1{left:3%; top:60px}
.sns > .snstxt > li.left2{left:0; top:160px}
}
@media only screen and (max-width:600px) {
.sns > .snstxt{ height:150px;}
.sns > .snstxt > li.right1{ width:auto; right:0%; top:0px}
.sns > .snstxt > li.right2{right:0%; top:180px}
.sns > .snstxt > li.left1{left:2%; top:330px}
.sns > .snstxt > li.left2{left:0; top:80px}
}
@media only screen and (max-width:485px) {
.sns > .snstxt > li.right2{ width:140px;right:0%; top:160px}
}
@media only screen and (max-width:390px) {
.sns > .snstxt{height:180px;}
.sns > .snstxt > li.right2{right:0%; top:190px}
.sns > .snstxt > li.left1{left:2%; top:340px}
.sns > .snstxt > li.left2{ width:210px}
}

/*img_cont 미션수행 이미지*/
.img_cont{position:relative; overflow:hidden; padding-bottom:10px;  text-align:center; background:url(images_visionroad/img_cont_Bg.png) center 200px no-repeat; background-size:100% auto}
.img_cont > .list{overflow:hidden;position:relative;left:50%;width:1902px;min-height:600px; margin-left:-951px;}
.img_cont > .list > ul:after{display:block;content:"";clear:both;}
.img_cont > .list > ul { position:absolute; width:1902px; height:600px; top:50px;}
.img_cont > .list > ul > li{ float:left; width:521px; height:391px; margin:60px 25px 167px 25px; background-color:#000; cursor:pointer}
.img_cont > .list > ul > li.on { width:710px; height:533px; margin:0 25px; box-shadow: 5px 10px 15px 3px rgba(0, 0, 0, 0.3)}
.img_cont > .list > ul > li > img{ width:100%; height:100%; opacity: 0.4; filter: alpha(opacity=40);}
.img_cont > .list > ul > li.on > img{ opacity: 1; filter: alpha(opacity=100)}
.img_cont  .pr{ position:relative; width:710px; height:0; margin:0 auto}
.img_cont  .pr a{display:block;position:absolute;top:260px; text-indent:-9999px;width:70px; height:70px; z-index:900}
.img_cont  .pr a.prev{  background:url(images_visionroad/img_btn1.png) left center no-repeat;background-size:100% 100%;left:-80px; }
.img_cont  .pr a.next{  background:url(images_visionroad/img_btn2.png) right center no-repeat;background-size:100% 100%;right:-80px; }
.img_cont  .pr a:hover.prev{ background-position:-10px center}
.img_cont  .pr a:hover.next{ background-position:10px center}
.img_cont  p{ padding:50px 0 32px 0; text-align:center; font-family: 'Noto Sans KR', sans-serif; font-size:20px; font-weight:400; line-height:35px; letter-spacing:-0.05em; color:#686868;}
.img_cont  .btn_more{ display:block; width:316px; height:82px; margin:0 auto; padding-top:2px; border-radius:14px; font-family: 'SBAggroM'; font-size:30px; letter-spacing:-0.05em; line-height:80px; color:#000;text-align:center; background-color:#eec000; box-shadow: 5px 5px 0px 0px rgba(0, 0, 0, 1); box-sizing:border-box}
.img_cont  .btn_more:hover{ background-color:#000; color:#fff; box-shadow:none;}
@media only screen and (max-width:1300px) {
.img_cont{ background-size:1300px auto}
}
@media only screen and (max-width:900px) {
.img_cont{ background-position: center 100px}
.img_cont > .list{overflow:hidden; width:1010px; margin-left:-505px; min-height:330px}
.img_cont > .list > ul { width:1010px; top:25px; }
.img_cont > .list > ul > li{ width:260px; height:195px; margin:60px 15px 0 15px;}
.img_cont > .list > ul > li.on { width:400px; height:300px; margin:0 15px; }

.img_cont  .pr{width:420px; }
.img_cont  .pr a{top:160px; width:40px; height:40px; }
.img_cont  .pr a.prev{  left:-30px; }
.img_cont  .pr a.next{  right:-30px; }
.img_cont  .pr a:hover.prev{ background-position:-10px center}
.img_cont  .pr a:hover.next{ background-position:10px center}
	
.img_cont  p{ padding:25px 15px 16px 15px;  font-size:14px;line-height:20px; box-sizing:border-box}
.img_cont  .btn_more{width:180px; height:50px; border-radius:10px; font-size:18px; line-height:50px;box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 1); }
.img_cont  .btn_more:hover{ background-color:#000; color:#fff; box-shadow:none;}
}
@media only screen and (max-width:540px) {
.img_cont{ background-position: center 10px}
.img_cont > .list{ width:760px; margin-left:-380px; min-height:280px}
.img_cont > .list > ul { width:760px; }
.img_cont > .list > ul > li{ width:200px; height:150px; margin:40px 10px 0 10px;}
.img_cont > .list > ul > li.on { width:300px; height:250px; margin:0 10px; }
.img_cont  .pr{width:330px; }
.img_cont  .pr a{top:130px;}
}
@media only screen and (max-width:410px) {
.img_cont  .pr{width:80%}
}

/*vr_dept2 이벤트 댓글참여*/
.vr_dept2{ position:relative; width:100%; padding:320px 10px 185px 10px; background:url(images_visionroad/n_dept3bg.jpg) center top no-repeat; background-size:100% auto; box-sizing:border-box; z-index:10}
.vr_dept2 > .cont{ width:100%; max-width:600px; margin:0 auto;}
.vr_dept2  h2{font-family: 'SBAggroM'; font-size:65px; letter-spacing:-0.08em; line-height:78px; color:#eb6877;text-align:center;}
.vr_dept2  h2 > strong{ font-family: 'SBAggroB'; color:#252525}
.vr_dept2  .txt1{ padding:15px 0 20px 0;font-family: 'Noto Sans KR', sans-serif; font-size:20px; font-weight:400; line-height:30px; letter-spacing:-0.05em; color:#653b3c; text-align:center}
.vr_dept2  .txt2{ padding:30px 0 0px 0;font-family: 'Noto Sans KR', sans-serif; font-size:18px; font-weight:400; line-height:30px; letter-spacing:-0.05em; color:#815557; text-align:center}
.vr_dept2  .txt_box{ width:100%; padding:32px 32px 70px 32px; border-radius:10px; background-color:#f3bdbe; box-sizing:border-box}
.vr_dept2  .txt_box:after{display:block;content:"";clear:both;}
.vr_dept2  .txt_box p{ position:relative; text-indent:-999999px}
.vr_dept2  .txt_box p > span{ position:absolute; display:block; width:290px; height:290px; background-position:center center; background-repeat:no-repeat; background-size:100% 100%;}
.vr_dept2  .txt_box p.tb1{ float:left; width:100%; height:82px; background:url(images_visionroad/vr_dept2_txt1.png) left top no-repeat; background-size:auto 100%;}
.vr_dept2  .txt_box p.tb2{ float:right; width:238px; height:95px; margin-right:43px; background:url(images_visionroad/vr_dept2_txt2.png) right top no-repeat; background-size:auto 100%;}
.vr_dept2  .txt_box p.tb1 > span{ left:-209px; top:25px; background-image:url(images_visionroad/tb1_img.png)}
.vr_dept2  .txt_box p.tb2 > span{ right:-290px; top:-14px;background-image:url(images_visionroad/tb2_img.png)}
.vr_dept2  .txt_box dl{ float:left; margin:27px 0 0 85px;font-family: 'Noto Sans KR', sans-serif;}
.vr_dept2  .txt_box dl > dt{ display:inline-block; height:40px; padding:0 12px; border-radius:5px; font-size:20px; background-color:#98282b; line-height:40px; letter-spacing:-0.03em; color:#fff}
.vr_dept2  .txt_box dl > dd{ padding:13px 0 49px 3px; font-size:22px; line-height:28px; letter-spacing:-0.08em; color:#5a1416;}
.vr_dept2  .btn{ display:block; width:316px; height:82px; margin:37px auto 0 auto; padding-top:2px; border-radius:14px; font-family: 'SBAggroM'; font-size:30px; letter-spacing:-0.05em; line-height:80px; color:#000;text-align:center; background-color:#eec000; box-shadow: 5px 5px 0px 0px rgba(0, 0, 0, 1); box-sizing:border-box}
.vr_dept2  .btn:hover{ background-color:#000; color:#fff; box-shadow:none;}
@media only screen and (max-width:1300px) {
.vr_dept2{ background-size:1300px auto}
}
@media only screen and (max-width:900px) {
.vr_dept2{ width:100%; padding:180px 10px 90px 10px;}
.vr_dept2 > .cont{ max-width:400px;}
.vr_dept2  h2{font-size:32px; line-height:40px; }
.vr_dept2  .txt1{ padding:7px 15px 10px 15px;font-size:14px;line-height:20px; box-sizing:border-box}
.vr_dept2  .txt2{ padding:15px 10px 0px 10px;font-size:12px;line-height:20px; box-sizing:border-box}
.vr_dept2  .txt_box{ padding:16px 16px 35px 16px; }
.vr_dept2  .txt_box p > span{ width:150px; height:150px;}
.vr_dept2  .txt_box p.tb1{ height:45px;}
.vr_dept2  .txt_box p.tb2{width:168px; height:50px; margin-right:22px;}
.vr_dept2  .txt_box p.tb1 > span{ left:-109px; top:20px; }
.vr_dept2  .txt_box p.tb2 > span{ right:-150px; top:-10px;}

.vr_dept2  .txt_box dl{ margin:15px 0 0 43px;}
.vr_dept2  .txt_box dl > dt{ height:30px; padding:0 10px; border-radius:3px; font-size:12px; line-height:30px;}
.vr_dept2  .txt_box dl > dd{ padding:8px 0 25px 1px; font-size:14px; line-height:20px;}
.vr_dept2  .btn{width:180px; height:50px; margin-top:25px; border-radius:10px; font-size:18px; line-height:50px;box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 1); }
.vr_dept2  .btn:hover{ background-color:#000; color:#fff; box-shadow:none;}
}
@media only screen and (max-width:550px) {
.vr_dept2  .txt_box p.tb1 > span{ left:-110px; top:20px; }
.vr_dept2  .txt_box p.tb2 > span{ right:-160px; }
.vr_dept2  .txt_box p.tb1{ width:110px; margin-left:90px}
.vr_dept2  .txt_box p.tb2{ margin-right:110px}
.vr_dept2  .txt_box dl{ margin:15px 0 0 120px}

}