/* 메인베너영역 */
#vr_mwrap {background:#fff url('/layouts/default_re_kr/image/main_view_bg.jpg') no-repeat center; width:100%; height:100vh;}
.pm_view {width:100%; height:100vh; overflow:hidden; position: relative;overflow:hidden}
.scr_ps {position:absolute; bottom:8rem; left:50%; transform: translate(-50%, 0); z-index:10;}
.scr_wrap {position: relative; width: 24px; height: 24px;}
.chevron {position: absolute; width: 28px; height: 8px; opacity: 0; transform: scale3d(0.5, 0.5, 0.5); animation: move 3s ease-out infinite;}
.chevron:first-child {animation: move 3s ease-out 1s infinite;}
.chevron:nth-child(2) {animation: move 3s ease-out 2s infinite;}
.chevron:before,
.chevron:after {content: ' '; position: absolute; top: 0; height: 100%; width: 51%; background: #fff;}
.chevron:before {left: 0; transform: skew(0deg, 30deg);}
.chevron:after {right: 0; width: 50%; transform: skew(0deg, -30deg);}
@keyframes move {
  25% {
    opacity: 1;

  }
  33% {
    opacity: 1;
    transform: translateY(30px);
  }
  67% {
    opacity: 1;
    transform: translateY(40px);
  }
  100% {
    opacity: 0;
    transform: translateY(55px) scale3d(0.5, 0.5, 0.5);
  }
}
.text {display: block; margin-left: -3.2rem; font-family: var(--entype1); font-size: 1.2rem; color: #fff; text-transform: uppercase; white-space: nowrap; opacity: .25; animation: pulse 2s linear alternate infinite;}
@keyframes pulse {
  to {
    opacity: 1;
  }
}

.video_wrap {height:100vh; position:relative; z-index:0;}
.video_wrap > .bg-video {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; z-index:-1;}

.fullvideo {position:absolute; top:0; left:0; padding:0;}
.fullvideo video {position:absolute; left:0; right:0; width:100%; height:100%; padding:0;}

@keyframes typing {
  from {
    width: 0
  }
}
    
@keyframes blink {
  50% {
    border-color: transparent
  }
}

/* 확대 모션 */
.section {width: 100%; height: 100%; transition: all ease 0.5s; min-width:320px; background-attachment: fixed;
	animation-name: bgmt1;
	animation-duration:10s;
	animation-iteration-count:infinite;
	animation-direction:alternate;
	animation-fill-mode: forwards;
}
.section2 {width: 100%; height: 100%; transition: all ease 0.5s; min-width:320px; background-attachment: fixed;
	animation-name: bgmt1;
	animation-duration:20s;
	animation-iteration-count:infinite;
	animation-direction:alternate;
	animation-fill-mode: forwards;
}

@-webkit-keyframes bgmt1 {
  0% {    
	background-size:100%;
  }
  100% {
	background-size:120%;
  }
}

/* 이미지 흐르는 모션 */
@keyframes loop1 {
    0% {
      transform: translateX(0);
    }
    100% {
      transform: translateX(-50%);
    }
  }

/* 이미지 확대 모션이 있을경우 사용 .mstep01 {background:url(/layouts/default_re_kr/image/m_step01.jpg) no-repeat center center; background-size:cover; padding:13.2rem 0;}*/
.mstep01 {background:#fff; padding:13.2rem 0;}
.mtitle01 {font-size:4.2rem; color:#272727; font-weight:700; text-align:center; margin-bottom:8rem;}
.mtitle01 p {font-family:var(--entype1); font-weight:800; color:var(--point-color-1);}
.mst1con {display:flex; justify-content:center; align-items:center; gap:5rem;}
.mst1con a {width:44rem; height:48rem; position:relative; border-radius:1rem; box-shadow:0  10px 30px rgba(0, 0, 0, 0.2); font-size:1.8rem; color:#666666; padding:5rem; display:inline-block; background-size:cover;}
.mst1con a span {width:100%; max-width:44rem; height:48rem; position:absolute; left:0; top:0; z-index:1; border-radius:1rem; border:0 solid var(--point-color-1);  transition:all .3s ease;}
.mst1con a:hover span {border:2rem solid var(--point-color-1); opacity:0.6;}
.mst1con a p {font-size:3.2rem; color:#272727; font-weight:700;}
.ms1bn {background:url(/layouts/default_re_kr/image/step01_bn01.jpg) no-repeat center center;}
.ms2bn {background:url(/layouts/default_re_kr/image/step01_bn02.jpg) no-repeat center center;}
.ms3bn {background:url(/layouts/default_re_kr/image/step01_bn03.jpg) no-repeat center center;}

.mstep02 {height:90rem; background:url(/layouts/default_re_kr/image/m_step02.jpg) no-repeat center center; background-size:cover; display:flex; justify-content:center; align-items:center; overflow: hidden; position: relative;}
.mst2con {width:95rem; font-size:4.2rem; color:#fff; font-weight:700; text-align:center; z-index:2;}
.mstep02in {position:absolute; left:0; top:0; z-index:1; width: 5120px; height: 100%; display: flex; flex-wrap: nowrap; animation: loop1 100s linear infinite; background:url(/layouts/default_re_kr/image/m_step02_1.jpg) repeat-x; opacity:0.5;}

#vr_mwrap2 {background:#fff url('/layouts/default_re_kr/image/main_view_bg2.jpg') no-repeat center; width:100%; height:100vh;}
.pm_view2 {width:100%; height:100%; overflow:hidden; position: relative;overflow:hidden}
.scr_bt {position:absolute; left:65%; top:50%; transform: translate(-35%, -50%); z-index:10; display:flex; flex-direction: column; gap:8rem;}
.scr_box {display:flex; flex-direction: column; gap:1rem;}
.scr_box span {font-size:3.2rem; font-weight:700; color:#fff;}
.scr_box p {font-size:2rem; font-weight:500; color:#fff; margin-bottom:3rem;}

/* button css */
.mbtn1 {width:23.2rem; height:6rem; border:2px solid #fff; background:rgba(255, 255, 255, 0); color:#ffffff; border-radius:3rem; transition:all .3s ease; font-family: var(--entype1); font-size:1.8rem; font-weight:500; display:flex; justify-content:center; align-items:center;}
.mbtn1:hover {background:var(--point-color-1); color:#ffffff;}
.cbh {clear:both;}


@media (max-width: 1500px) {
	.mtitle01 {font-size:3.2rem; margin-bottom:5rem;}
	.mst1con {gap:2rem; padding:0 2rem;}
	.mst1con a {font-size:1.8rem;}
	.mst1con a p {font-size:2.8rem;}

	.mst2con {width:70rem; font-size:3.2rem;}

	@-webkit-keyframes bgmt1 {
	  0% {    
		background-size:auto 100%;
	  }
	  100% {
		background-size:auto 120%;
	  }
	}
}

@media (max-width: 1000px) {
	.mst1con {flex-direction: column;}
	.mst1con a {width:100%; height:24rem;}
	.mst1con a span {max-width:100%; height:24rem;}	
	.scr_box {text-align:center;}
	.scr_bt {left:50%; top:50%; transform: translate(-50%, -50%);}
	.mbtn1 {margin:0 auto;}
}

@media (max-width: 640px) {
	.mtitle01 {font-size:2.4rem; margin-bottom:5rem;}
	.mst1con a {padding:3.5rem;}
	.mst1con a p {font-size:2rem;}
	.mst2con {width:80%; font-size:2rem;}
	.scr_box span {font-size:2.4rem;}
	.scr_bt {width:80%; gap:4rem;}
	.scr_box p {font-size:1.8rem; margin-bottom: 1rem;}

	.mbtn1 {width: 20rem; height: 5rem; font-size: 1.6rem;}
}




















#content .gtheme {}
#content .aside {float:left;width:200px;margin-right:20px;padding-bottom:20px;}
#content .center {}
#content .m_side {float:left;width:740px;}
#content .bside {float:right;width:200px;margin-left:20px;padding-bottom:20px;}
#content .mainbox {margin:10px 0 30px 0;border-right:#DEDEDE solid 1px;border-bottom:#DEDEDE solid 1px;}
#content .mainbox .post {float:left;width:158px;height:300px;border-top:#DEDEDE solid 1px;border-left:#DEDEDE solid 1px;}
#content .mainbox .post0,#content .mainbox .post17 {width:477px;background:#f7f7f7;}
#content .mainbox .post8,#content .mainbox .post10,#content .mainbox .post18,#content .mainbox .post26 {width:318px;background:#f7f7f7;}
#content .mainbox .post .box1 {padding:10px 15px 15px 10px;}
#content .mainbox .post .box1 .title {height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#content .mainbox .post .box1 .title a {font-weight:bold;font-size:20px;color:#05447A;}
#content .mainbox .post .box1 .title a:hover {}
#content .mainbox .post .box1 .date {display:inline-block;padding:4px 0 5px 0;color:#2F3437;border-bottom:#DDDDDD solid 3px;}
#content .mainbox .post .box1 .cont {margin-top:15px;height:180px;line-height:170%;font-weight:normal;font-size:15px;color:#35343C;white-space:;overflow:hidden;text-overflow:ellipsis;}
#content .mainbox .post .box1 .cont img {float:left;height:135px;padding-top:7px;margin-right:10px;}
#content .mainbox .post .box2 {padding:10px 15px 15px 10px;}
#content .mainbox .post .box2 .title {height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#content .mainbox .post .box2 .title a {font-weight:bold;font-size:20px;color:#05447A;}
#content .mainbox .post .box2 .title a:hover {}
#content .mainbox .post .box2 .date {padding-top:1px;color:#074075;}
#content .mainbox .post .box2 .cont {margin-top:15px;height:205px;line-height:170%;font-weight:normal;font-size:15px;color:#35343C;white-space:;overflow:hidden;text-overflow:ellipsis;}
#content .mainbox .post .box2 .cont img {float:left;height:100px;padding-top:7px;margin-right:10px;}
#content .mainbox .post .box3 {padding:10px;height:257px;overflow:hidden;text-overflow:ellipsis;}
#content .mainbox .post .box3 .title {line-height:190%;}
#content .mainbox .post .box3 .title a {font-weight:bold;font-size:17px;color:#074075;}
#content .mainbox .post .box3 .title a:hover {}
#content .mainbox .post .box3 .date {padding-top:10px;color:#074075;}
#content .mainbox .post .box3 .cont {margin-top:10px;line-height:140%;font-weight:normal;font-size:13px;color:#35343C;}
#content .mainbox .post .box3 .cont img {width:135px;margin:0 0 10px 0;}
#content .mainbox .noline {border-left:#ffffff solid 1px;}
#content .mbrinfo {border:#dfdfdf solid 1px;margin-bottom:15px;background:#F4F4F4;padding:8px 7px 8px 12px;}
#content .mbrinfo .symbol {float:left;}
#content .mbrinfo .symbol img {width:37px;height:37px;}
#content .mbrinfo .name {float:left;margin:0 0 0 10px;}
#content .mbrinfo .name .namel {height:12px;font-weight:bold;color:#454545;padding:2px 0 0 0;}
#content .mbrinfo .name .namer {padding-top:6px;}
#content .mbrinfo .score,#content .mbrinfo .score a {font-size:11px;color:#636363;padding:10px 0 0 0;margin:5px 0 0 0;border-top:#dfdfdf solid 1px;}
#content .mbrinfo .score a:hover {text-decoration:underline;}
#content .logout {border:#dfdfdf solid 1px;margin-bottom:15px;}
#content .logout .tabbox .np {padding:10px 0 10px 10px;background:#F4F4F4;border-bottom:#D4D4D4 solid 1px;font-weight:bold;color:#9E9E9E;}
#content .logout .tabbox .tp {float:left;width:98px;height:22px;background:#F4F4F4;border-bottom:#D4D4D4 solid 1px;text-align:center;font-weight:bold;color:#9E9E9E;padding-top:12px;cursor:pointer;}
#content .logout .tabbox .vline {border-right:#D4D4D4 solid 1px;}
#content .logout .tabbox .on {background:#ffffff;border-bottom:#ffffff solid 1px;color:#676767;}
#content .logout .nlog {padding:15px 0 15px 12px;}
#content .logout .i1 {font-size:11px;color:#67686A;letter-spacing:-1px;padding-bottom:3px;}
#content .logout .i1 .input {float:left;width:105px;height:17px;border:#BEBEBE solid 1px;}
#content .logout .i1 .input:focus {border:#BEBEBE solid 2px;}
#content .logout .i1 .checkbox {margin-left:2px;}
#content .logout .i1 .submit {float:left;margin-left:5px;}
#content .logout .rbtm {font-size:11px;color:#67686A;letter-spacing:-1px;padding:10px 0 0 3px;}
#content .logout .rbtm .ipc {color:#67686A}
#content .logout .rbtm a {color:#313946;}
#content .logout .rbtm span {padding:0 5px 0 5px;}
#content .logout .slog {padding:15px 12px 15px 12px;}
#content .logout .slog .icon {padding:10px;background:#efefef;text-align:center;}
#content .logout .slog .icon img {cursor:pointer;margin:8px;}
#content .logout .slog .guide {line-height:140%;font-size:11px;color:#999;letter-spacing:-1px;padding:10px 0 0 0;}
#content .submenu {list-style-type:none;border:#dfdfdf solid 3px;padding:5px;margin:0 0 15px 0;border-radius:5px 5px 5px 5px;}
#content .submenu li {background:url('./image/arr_plus.gif') 8px 9px no-repeat;padding:7px 0 7px 25px;line-height:140%;border-bottom:#efefef solid 1px;}
#content .submenu li a {color:#707070;}
#content .submenu li a:hover {color:#3B82BA;}
#content .submenu li ul {padding:10px 0 0 0;margin:0;list-style-type:none;}
#content .submenu li ul li {background:none;padding:2px 0 2px 0;border-bottom:0;}
#content .submenu li ul li a {font-weight:normal;}
#content .submenu li ul li a:hover {color:#3B82BA;}
#content .submenu .open {background:url('./image/arr_minus.gif') 8px 9px no-repeat;}
#content .submenu .on {font-weight:bold;color:#3B82BA;}
#content .submenu ._last {border-bottom:0;}
#content .submenu .none {color:#c0c0c0;}
#content .banner {margin-bottom:15px;}
#content .banner span {display:block;font-size:11px;color:#c0c0c0;padding:70px 0 70px 0;margin:0;border:#dfdfdf solid 1px;background:#efefef;text-align:center;}
#content .hotbox {border:#dfdfdf solid 1px;margin-bottom:15px;}
#content .hotbox .tabbox {}
#content .hotbox .tabbox .tp {float:left;width:98px;height:20px;padding-top:10px;background:#F4F4F4;border-top:#ffffff solid 1px;border-bottom:#D4D4D4 solid 1px;text-align:center;font-weight:bold;color:#9E9E9E;cursor:pointer;}
#content .hotbox .tabbox .vline {border-right:#D4D4D4 solid 1px;}
#content .hotbox .tabbox .on {background:#ffffff;border-top:#ffffff solid 1px;border-bottom:#ffffff solid 1px;color:#424242;}
#content .hotbox .hbody {padding:10px 5px 10px 8px;}
#content .hotbox .hbody ul {padding:0;margin:0;list-style-type:none;}
#content .hotbox .hbody li {height:14px;margin:10px 0 10px 0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
#content .hotbox .hbody li i {display:inline-block;width:11px;margin-right:7px;hieght:11px;font-style:normal;font-size:10px;font-family:arial;color:#ffffff;letter-spacing:-px;text-align:center;background:#C0C0C0;border:#B6B6B6 solid 1px;border-radius:2px 2px 2px 2px;}
#content .hotbox .hbody li span {font-family:arial;font-size:11px;color:#E75801;padding-left:3px;}
#content .hotbox .hbody li a {}
#content .hotbox .hbody li .emp {background:#95A6FE;border:#7186FB solid 1px;}