@import url(https://fonts.googleapis.com/css?family=Fredoka+One);

.md-perspective,
.md-perspective body{
	height: 100%;
	overflow: hidden;
}

.md-perspective body {
	background: #222;
	-webkit-perspective: 600px;
	-moz-perspective: 600px;
	perspective: 600px;
}

.container{
	min-height: 100%;
}

.md-modal{
	position: fixed;
	top:0;
	left:0;
	width: 240px;
	max-width: 430px;
	min-width: 120px;
	height: 100%;
	z-index: 2000;
	visibility: hidden;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transform: translateX(0) translateY(0);
	-moz-transform: translateX(0) translateY(0);
	-ms-transform: translateX(0) translateY(0);
	transform: translateX(0) translateY(0);
}

.md-show{
	visibility: visible;
}

.md-overlay{
	position: fixed;
	width: 100%;
	height: 100%;
	visibility: hidden;
	top: 0;
	left: 0;
	z-index: 1000;
	opacity: 0;
	background: rgba(0,0,0,0.8);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show ~ .md-overlay{
	opacity: 1;
	visibility: visible;
}

/* Content styles */
.md-content{
	color: #fff;
	background: #fff;
	position: relative;
	border-radius: 3px;
	margin: 0 auto;
	height:100%;
}

.md-content h3{
	margin:0;
	text-align:center;
	font:bold 1.5em/1.6em "malgun gothic"; 
	letter-spacing:-1px;
	background:#fff;
	padding:10px 0 10px;
	color:#153178;
}

.md-content p{
	margin: 0;
	padding: 10px 0;
}


.md-content img{
	width:215px;
}

.md-content ul{
	margin: 0;
	padding:0;
}

.md-content ul li{
	padding:0;
	margin:0;
}

.md-content button{
	display: block;
	margin: 0 auto;
	font-size: 0.8em;
}



/* Effect 8: 3D flip horizontal */
.md-effect-8.md-modal{
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-8 .md-content{
	/* -webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: rotateY(-70deg);
	-moz-transform: rotateY(-70deg);
	-ms-transform: rotateY(-70deg);
	transform: rotateY(-70deg); */
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.3s;
	opacity: 0;
}

.md-show.md-effect-8 .md-content{
	-webkit-transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	transform: rotateY(0deg);
	opacity: 1;
}

@media screen and (max-width: 32em){
	body{ font-size: 75%; }
}

.md-close{position:absolute; right:0; top:0; padding:7px 7px 0 0; text-decoration:none; _font:1em/1em "Fredoka One" !important; }

.md-content li a{display:block;   padding:7% 7%; font: 1.3em/1.3em "NoTo Sans kr" ; color:#333; text-decoration:none; border-bottom:1px solid #e5e5e5;}

.jssora21l, .jssora21r {
                    display:block;
                    position:absolute;
                    /* size of arrow element */
                    width:50px;
                    height:50px;
                    cursor:pointer;
                    background:url(../img/a21.png) center center no-repeat;
                    overflow:hidden;
                }
                .jssora21l { background-position: -3px -33px; }
                .jssora21r { background-position: -63px -33px; }
                .jssora21l:hover { background-position: -123px -33px; }
                .jssora21r:hover { background-position: -183px -33px; }
                .jssora21l.jssora21ldn { background-position: -243px -33px; }
                .jssora21r.jssora21rdn { background-position: -303px -33px; }
				

/*2020.04.17 °úÁ¤¾È³» ½ºÅ¸ÀÏ*/

.new_vibg {  background:url(/vision1/mo_img/Newmo_bg2.jpg); height:32em; width:100%; margin:0; padding:2%; background-size:cover; max-width:100%; box-sizing:border-box; overflow:hidden; position:relative; }

.new_vibg .cont_btn { display:table; position:relative; width:100%; height:24%; line-height:15px; float:right; text-align:center; margin:0.16em 0; box-sizing:border-box; box-shadow:0px 0px 2px 0px #b9b9b9; -webkit-box-shadow:0px 0px 2px 0px #b9b9b9; -moz-box-shadow:0px 0px 2px 0px #b9b9b9; }
.new_vibg .cont_btn .titb { font-size:1.3em; font-weight:bold; width:100%; display:table-cell; position:absolute; bottom:47%; left:5%; top:40%; text-align:left; margin:0 auto; letter-spacing:-1px; line-height:125%; }
.new_vibg .cont_btn .tits { font-size:0.85em; width:100%; display:table-cell; position:absolute; bottom:25%; left:5%; text-align:left; margin:0 auto; letter-spacing:-1px; }

.new_vibg .cont_btn {
  background-color: #4285f4;
}

.new_vibg .cont_btn:nth-child(2):hover,.new_vibg .cont_btn:nth-child(4):hover { background-color:#ddd; }

.new_vibg .cont_btn:nth-child(1):hover,.new_vibg .cont_btn:nth-child(3):hover { background-color:#00438d; }

.new_vibg .cont_btn:nth-child(1) { background:#00336b; background-position:center; }
.new_vibg .cont_btn:nth-child(2) { background:#fafafa; background-position:center; }
.new_vibg .cont_btn:nth-child(3) { background:#0053a6; background-position:center; }
.new_vibg .cont_btn:nth-child(4) { background:#fafafa; background-position:center; }

.right-arrowbtnA { background:#001f42 url(/vision1/mo_img/Msubarrow_btn.png) no-repeat; background-position:center; background-size:8px; width:20%; float:right; height:100%; }
.right-arrowbtnB { background:#ababab url(/vision1/mo_img/Msubarrow_btn.png) no-repeat; background-position:center; background-size:8px; width:20%; float:right; height:100%; }
.right-arrowbtnC { background:#002f5d url(/vision1/mo_img/Msubarrow_btn.png) no-repeat; background-position:center;  background-size:8px; width:20%; float:right; height:100%;}
/*.new_vibg .cont_btn:nth-child(5) { background:#00336b url(/vision1/mo_img/cont_btn06_01.png) no-repeat 13px; background-size:40px; background-position:center;}
.new_vibg .cont_btn:nth-child(6) { background:#fff url(/vision1/mo_img/cont_btn05.png) no-repeat 13px; background-size:40px; background-position:center; }
.new_vibg .cont_btn:nth-child(7) { background:#fff url(/vision1/mo_img/cont_btn07.png) no-repeat 13px; background-size:40px; background-position:center; }
.new_vibg .cont_btn:nth-child(8) { background:#ff4c08 url(/vision1/mo_img/cont_btn08.png) no-repeat 13px; background-size:40px; background-position:center; }
.new_vibg .cont_btn:nth-child(9) { background:#fff url(/vision1/mo_img/cont_btn09.png) no-repeat 13px; background-size:40px; background-position:center; }*/

.left-box { display:block; width:45%; height:100%; float:left; overflow:hidden; padding-right:2%; }
.left-box img { width:45%; float:left; position:absolute; bottom:0; max-width:223px; }
.white { color:#fff; }




.swiper-container ul, li {list-style-type:none;margin:0;padding:0;}
		.swiper-container  .tabs > li { width:33%; }
		.swiper-container  .tabs > li > a { color: #666; padding: 10px 0 10px 0; display: block; background: #fff; text-align: center; text-decoration: none; font-size:14px; line-height: 20px; border-bottom: 2px solid transparent; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }
		.swiper-container  .tabs > li.active  > a { border-bottom: 2px solid #4f6add; color: #4f6add; }
		.swiper-container  .tabs > li > a:acitve { border-bottom: 2px solid #4f6add; color: #4f6add; }
		.swiper-container  .tabs > li > a:hover { border-bottom: 2px solid #4f6add; color: #4f6add; }
		.swiper-container  .tabs > li > a:focus { border-bottom: 2px solid #4f6add; color: #4f6add; }
		
		/* 2016-05-13 ¼öÁ¤ */
		.swiper-container  .swiper-container-2 { padding:0; overflow: hidden; }
		.swiper-container  .swiper-container-2 .swiper-slide { }
		/* //2016-05-13 ¼öÁ¤ */
		
		.swiper-container  .swiper-right-hidden {
			width:15px; height:45px; position:absolute; z-index:10; right:0;
		/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fff7f7+0,ffffff+30&0+0,1+30 */
		background: -moz-linear-gradient(left,  rgba(255,247,247,0) 0%, rgba(255,255,255,1) 30%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left,  rgba(255,247,247,0) 0%,rgba(255,255,255,1) 30%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right,  rgba(255,247,247,0) 0%,rgba(255,255,255,1) 30%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00fff7f7', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */

			}

	 .slide-container {
      width: 100%;
      height: 100%;
      margin-left: auto;
      margin-right: auto;
    }
    .swiper-container .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;

      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
    }