#intro {height:100%;display:table;table-layout:fixed;width:100%; }
#intro > div {display:table-cell;vertical-align:middle;}
#intro .bg {width:100%;height:100%;position:relative;}
#intro .bg:before,
#intro .bg:after {content:"";display:block;position:absolute;left:0;top:0;width:100%;height:100%;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;}
#intro .bg:after {opacity:0;transition:1s;z-index:10;}
#intro .bg:hover:after, #intro .bg:focus:after, #intro .bg:active:after, #intro .bg:target:after  {opacity:1;}
#intro .bg.on:after {opacity:1;}
#intro .lef .bg:before {background-image:url(/assets/images/intro-lef.png);}
#intro .lef .bg:after {background-image:url(/assets/images/intro-lef-ov.png);}
#intro .rig .bg:before {background-image:url(/assets/images/intro-rig.png);}
#intro .rig .bg:after {background-image:url(/assets/images/intro-rig-ov.png);}
#intro .mid {background:#e60917;width:480px;text-align:center; position:relative; padding-bottom:280px;}
#intro .mid .txt {font-family: 'Noto Sans Korean', sans-serif; color:#fff; margin-top:20px; font-size:24px; line-height:36px; letter-spacing:-0.05em; font-weight:350; position:relative;}
#intro .mid .txt:before {content:"“"; font-family: 'Noto Sans Korean', sans-serif; font-weight:100; font-size:100px; position:absolute; left:30px; top:15px;}
#intro .mid .txt:after {content:"”"; font-family: 'Noto Sans Korean', sans-serif; font-weight:100; font-size:100px; position:absolute; right:15px; bottom:-35px;}
#intro .mid .txt strong {font-weight:normal;font-size:24px;}
#intro .mid .txt span {font-size:18px;font-weight:bold;}
#intro .mid .btns {margin-top:50px;}
#intro .mid .btns .bt {display: inline-block; color:#fff; padding:23px 0 18px; width:390px; position:relative; z-index:1; border:1px solid #fff;}
#intro .mid .btns .bt + .bt {margin-top:15px;}
#intro .mid .btns .bt .t1 {font-weight:500; font-size:29px; letter-spacing:-0.05em;}
#intro .mid .btns .bt .t2 {opacity:0.75; font-size:16px; letter-spacing:-0.01em; margin-top:8px;}
#intro .mid .btns .bt .t3 {font-size:16px; letter-spacing:-0.01em; font-size:20px; /*display:flex; justify-content: space-between;*/ width:165px; margin:10px auto 0; position:relative; text-align:left;}
#intro .mid .btns .bt .t3 span {cursor:pointer; position:relative; z-index:15;}
#intro .mid .btns .bt .t3 span + span {float:right;}
#intro .mid .btns .bt .t3 .bar {height:15px; width:1px; background:#fff; position:absolute; left:70px; top:3px;}
#intro .mid .btns .bt .t3:before {content:""; height:15px; width:1px; background:#fff; position:absolute; left:70px; top:3px;}
#intro .mid .btns .bt a {z-index:10; position:absolute; left:0; top:0; width:100%; height:100%; display: inline-block; cursor:default;}
#intro .mid .btns .bt:hover {color:#e60917; background:#fff;}
#intro .mid .btns .bt:hover .t3:before {background:#e60917;}
#intro .mid .btns a + a {margin-top:23px;}
/*#intro .mid .btns a:before {content:""; background:url("/assets/images/intro-arrow-l.png") no-repeat; width:10px; height:21px; display: inline-block; position:absolute; left:25px; top:33px;}*/
/*#intro .mid .btns a:hover:before {background:url("/assets/images/intro-arrow-l-ov.png") no-repeat;}*/
/*#intro .mid .btns a + a:before {content:none;}*/
/*#intro .mid .btns a + a:after {content:""; background:url("/assets/images/intro-arrow-r.png") no-repeat;width:10px; height:21px; display: inline-block; position:absolute; right:25px; top:33px;}*/
/*#intro .mid .btns a + a:hover:after {background:url("/assets/images/intro-arrow-r-ov.png") no-repeat;}*/
/*#intro .mid .btns a:hover {background:#fff;color:#e60917;}*/
#intro .mid .caution {margin-top:200px;font-size:14px;line-height:1.5em;color:#feb2e3;}
#intro .foot {background:#424242; height:280px; position:absolute; left:0; bottom:0; width:100%; padding-top:35px;}
#intro .foot .f1 {}
#intro .foot .f2 {margin-top:25px;}
#intro .foot h4 {font-weight:700; font-size:18px; line-height:24px; color:#cbcbcb;}
#intro .foot p {font-weight:300; font-size:15px; line-height:24px; color:#cbcbcb;}
#intro .foot .copyright {font-weight:100; font-size:14px; color:#cbcbcb; margin-top:35px;}


@media all and (max-width:1000px){
	#intro {display:block;}
	#intro > div {display:block;}
	#intro .lef,
	#intro .rig {height:25%; height:calc((100% - 218px) / 2);}
	#intro .bg:before,
	#intro .bg:after  {background-position:100% 0;}
	#intro .mid {height:50%; height:218px; width:auto;font-size:0;box-sizing:border-box;padding:0 20px;}
	#intro .mid br {display:none;}
	#intro .mid:after {content:"";display:inline-block;width:0;height:100%;vertical-align:middle;white-space:nowrap;}
	#intro .mid .ver {display:inline-block;vertical-align:middle;max-width:100%;white-space:normal; width:100%;}
	#intro .mid h1 img {width:150px;}
	#intro .mid .txt {margin-top:15px;font-size:12px;line-height:1.4em; width:80%; margin:15px auto 0; padding:0 30px; display:none;}
	#intro .mid .txt:after, #intro .mid .txt:before {font-size:60px;}
	#intro .mid .txt:before {left:0; top:11px;}
	#intro .mid .txt:after {right:0; bottom:-20px;}
	#intro .mid .txt strong {font-size:16px;}
	#intro .mid .txt span {font-size:15px;}
	#intro .mid .btns {margin-top:10px; width:100%;}
	#intro .mid .btns .bt {width:45%; margin-top:0; padding:12px 0;}
	#intro .mid .btns .bt + .bt {margin-left:4%;}
	#intro .mid .btns .bt .t1 {font-size:18px;}
	#intro .mid .btns .bt .t2 {font-size:10px;}
	#intro .mid .btns .bt .t3 {font-size:14px; width: 115px;}
	#intro .mid .btns .bt .t3:before {content:""; left:49px; top:2px; height:11px; width:1px;}
/*	#intro .mid .btns a {width:200px;height:40px;line-height:38px;font-size:12px;}*/
/*	#intro .mid .btns a + a {margin-top:5px;}*/
/*	#intro .mid .btns a:before {left:10px; top:9px;}*/
/*	#intro .mid .btns a + a:after {right:10px; top:9px;}*/
	#intro .mid .caution {margin-top:20px;font-size:11px;line-height:1.4em;}
	#intro .foot {display:none;}
	#intro .lef .bg:before {background-image:url(/assets/images/mo-intro-lef.png);}
#intro .lef .bg:after {background-image:url(/assets/images/mo-intro-lef-ov.png);}
#intro .rig .bg:before {background-image:url(/assets/images/mo-intro-rig.png);}
#intro .rig .bg:after {background-image:url(/assets/images/mo-intro-rig-ov.png);}
}