@charset "utf-8";

body{
    letter-spacing: -1px;
}
#hd {position: absolute; width: 100%; min-width: 1000px; background-color: #ffffff00;}

#contents	{min-width:1275px;padding-top:175px}

/* Main Slide */

.main #vis.swiper-container .swiper-button-next{
    width: 71px;
    height: 140px;
    background-image: url(../../img/main/main_next.png);
    background-size: auto;
}
.main #vis.swiper-container .swiper-button-prev{
    width: 71px;
    height: 140px;
    background-image: url(../../img/main/main_prev.png);
    background-size: auto;
}
.main #vis {height: 644px;}
.main #vis .swiper-slide {overflow: hidden}

.main #vis .wrap {position: relative;width: 1210px;margin: 0 auto}
.main #vis .sw_a {position: absolute}

.main #vis .sw3 {background: url('../../img/main/visual/v3/bg.jpg') no-repeat center;background-size:cover;height: 644px}
.main #vis .sw3 .sw_a1 {top:92px;right: -360px; opacity: 0;animation:none}
.main #vis .sw3 .sw_a2 {top:95px;left:0; opacity: 0;animation:none}
/*.main #vis .sw3 .sw_a3 {top:169px;left:0; opacity: 0;animation:none}*/
.main #vis .sw3 .sw_a3_fix01 {top:179px;left:9px; opacity: 0;animation:none}
.main #vis .sw3 .sw_a3_fix02 {top:179px;left:127px; opacity: 0;animation:none}
.main #vis .sw3 .sw_a3_fix03 {top:179px;left:244px; opacity: 0;animation:none}
.main #vis .sw3 .sw_a3_fix04 {top:179px;left:364px; opacity: 0;animation:none}
.main #vis .sw3 .sw_a4 {top:65px;left:235px; opacity: 0;animation:none}
.main #vis .sw3 .sw_a5 {top:65px;left:293px; opacity: 0;animation:none}
.main #vis .sw3 .sw_a6 {top:65px;left:350px; opacity: 0;animation:none}
/*.main #vis .sw3 .sw_a6_2 {top:318px;left:0; opacity: 0;animation:none}*/
.main #vis .sw3 .sw_a6_2_fix01 {
	top:312px;
	left:0;; 
	width: 367px;
	height: 93px;
	opacity: 0;
	animation:none
}
.main #vis .sw3 .sw_a6_2_fix01 > div {
	width: inherit;
	height: inherit;
	background: url('../../img/main/visual/v3/vis_text3_deleteBackwardWord.png') no-repeat;
}
.main #vis .sw3 .sw_a7 {top:80px;left:-500px;opacity: 0;animation:none}
.main #vis .sw3 .sw_a8 {top:425px;left:0px;opacity: 0;animation:none}
.main #vis .sw3 .sw_a8_2 {top:425px;left:0px;opacity: 0;animation:none}
.main #vis .sw3 .text-loop {
	position: absolute;
	top: 471px;
    left: 72px;
	width: 293px;
	height: 61px;
	overflow: hidden;
	opacity: 0;
	animation:none;
}
.main #vis .sw3 .text-loop > div {
	width: 293px;
	height: 61px;
	background: url('../../img/main/visual/v3/vis_textLoop.png') no-repeat;
}

.main #vis .sw3.on .sw_a1 {-webkit-animation: vis_ani1 .5s .3s 1 ease forwards;animation: vis_ani1 .5s .3s 1 ease forwards;}
.main #vis .sw3.on .sw_a2 {-webkit-animation: vis_ani2 .5s .6s 1 ease forwards;animation: vis_ani2 .5s .6s 1 ease forwards;}
/*.main #vis .sw3.on .sw_a3 {-webkit-animation: vis_ani2 .5s .8s 1 ease forwards;animation: vis_ani2 .5s .8s 1 ease forwards;}*/
.main #vis .sw3.on .sw_a3_fix01 {
	-webkit-animation: fade-in-left 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000).8s both;
	        animation: fade-in-left 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000).8s both;
}
.main #vis .sw3.on .sw_a3_fix02 {
	-webkit-animation: fade-in-left 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.1s both;
	        animation: fade-in-left 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.1s both;
}
.main #vis .sw3.on .sw_a3_fix03 {
	-webkit-animation: fade-in-left 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.4s both;
	        animation: fade-in-left 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.4s both;
}
.main #vis .sw3.on .sw_a3_fix04 {
	-webkit-animation: fade-in-left 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.7s both;
	        animation: fade-in-left 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.7s both;
}
.main #vis .sw3.on .sw_a4 {-webkit-animation: vis_ani3 .5s 1s 1 ease forwards;animation: vis_ani3 .5s 1s 1 ease forwards;}
.main #vis .sw3.on .sw_a5 {-webkit-animation: vis_ani3 .5s 1.1s 1 ease forwards;animation: vis_ani3 .5s 1.1s 1 ease forwards;}
.main #vis .sw3.on .sw_a6 {-webkit-animation: vis_ani3 .5s 1.2s 1 ease forwards;animation: vis_ani3 .5s 1.2s 1 ease forwards;}
/*.main #vis .sw3.on .sw_a6_2 {-webkit-animation: vis_ani3_2 .5s 1.8s 1 ease forwards;animation: vis_ani3_2 .5s 1.8s 1 ease forwards;}*/
.main #vis .sw3.on .sw_a6_2_fix01 {
	-webkit-animation: vis_ani3_2 .5s 1.8s 1 ease forwards;
	animation: vis_ani3_2 .5s 1.8s 1 ease forwards;
}
.main #vis .sw3.on .sw_a6_2_fix01 > div > p {
	color: #448aff;
	font-size: 28px;
    font-weight: 500;
    letter-spacing: -2px;
	padding-top: 6px;
	margin-left: 203px;
}
.main #vis .sw3.on .sw_a6_2_fix01 > div > p:nth-child(2) {
    padding-top: 0px;
    margin-left: 282px;
}
.main #vis .sw3.on .sw_a6_2_fix01 > div > p {
	-webkit-animation: flicker .3s 1.8s infinite alternate;
	animation: flicker .3s 1.8s infinite alternate;
}
.main #vis .sw3.on .sw_a7 {-webkit-animation: vis_ani4 1.2s 1.8s 1 ease forwards;animation: vis_ani4 1.2s 1.5s 1 ease forwards;}
.main #vis .sw3.on .sw_a8 {-webkit-animation: vis_ani5 .5s 2.5s 1 ease forwards, vis_ani5_2 1.5s 2.8s infinite ease-in-out;animation: vis_ani5 .5s 2.5s 1 ease forwards, vis_ani5_2 1.2s 2.8s infinite ease-in-out;}
/*.main #vis .sw3.on .sw_a8_2 {-webkit-animation: vis_ani6 .5s 3s 1 ease forwards; animation: vis_ani6 .5s 3s 1  ease forwards}*/
.main #vis .sw3.on .text-loop {
    -webkit-animation: fade-in-left 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)3s both;
	        animation: fade-in-left 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)3s both;
}
.main #vis .sw3.on .text-loop > div{
    -webkit-animation: text-loop 3s 4s both;
	        animation: text-loop 3s 4s both;
}

@keyframes vis_ani1 {
    0% {opacity:0}
    100% {opacity:1}
}
@keyframes vis_ani2 {
    0% {left:-100px;opacity:0}
    100% {left:0;opacity:1}
}
@keyframes vis_ani3 {
    0% {top:40px;opacity:0}
    50% {top:75px;opacity:1}
    100% {top:65px;opacity:1}
}
@keyframes vis_ani3_2 {
    0% {left:-100px;opacity:0}
    100% {left:10px;opacity:1}
}
@keyframes vis_ani4 {
    0% {-webkit-transform: rotate(-90deg);transform: rotate(-90deg);;opacity:0}
    100% {-webkit-transform: rotate(0);transform: rotate(0);opacity:1}
}
@keyframes vis_ani5 {
    0% {left:-50px;opacity:0}
    100% {left:0;opacity:1}
}
@keyframes vis_ani5_2 {
    0%,100% {opacity:0.7}
    50% {opacity:1}
}
@keyframes vis_ani6 {
    0% {left:-50px;opacity:0}
    100% {left:0;opacity:1}
}

@-webkit-keyframes flicker {
  0% {
  	color: #448aff:
  }
  100% {
  	color: #f3574a;
  }
}
@keyframes flicker {
  0% {
  	color: #448aff:
  }
  100% {
  	color: #f3574a;
  }
}

@-webkit-keyframes text-loop {
  0% {
    background-position-y: 1px;
  }
  5%{
  	background-position-y: 1px;
  }
  45% {
  	background-position-y: -60px;
  }
  50% {
  	background-position-y: -60px;
  }
  95% {
    background-position-y: -120px;
  }
  100% {
    background-position-y: -120px;
  }
}
@keyframes text-loop {
  0% {
    background-position-y: 1px;
  }
  5%{
  	background-position-y: 1px;
  }
  45% {
  	background-position-y: -60px;
  }
  50% {
  	background-position-y: -60px;
  }
  95% {
    background-position-y: -120px;
  }
  100% {
    background-position-y: -120px;
  }
}

.main #vis .sw4 {background: url('../../img/main/visual/v4/bg.jpg') no-repeat center;background-size:cover;height: 644px}
.main #vis .sw4 .sw_a0 {
    top: -11px;
    right: -242px;
    opacity: 0;
    animation:none
}
/*.main #vis .sw4 .sw_a1 {top: 60px; left: 100px; opacity: 0;animation:none}*/
.main #vis .sw4 .sw_a1_fix01,
.main #vis .sw4 .sw_a1_fix02,
.main #vis .sw4 .sw_a1_fix03,
.main #vis .sw4 .sw_a1_fix04,
.main #vis .sw4 .sw_a1_fix05,
.main #vis .sw4 .sw_a1_fix06,
.main #vis .sw4 .sw_a1_fix07,
.main #vis .sw4 .sw_a1_fix08,
.main #vis .sw4 .sw_a1_fix09,
.main #vis .sw4 .sw_a1_fix10{
	top: 56px;
	color: white;
	font-size: 42px;
	font-weight: 100;
	opacity: 0;
	animation:none
}
.main #vis .sw4 .sw_a1_fix11,
.main #vis .sw4 .sw_a1_fix12,
.main #vis .sw4 .sw_a1_fix13,
.main #vis .sw4 .sw_a1_fix14,
.main #vis .sw4 .sw_a1_fix15,
.main #vis .sw4 .sw_a1_fix16,
.main #vis .sw4 .sw_a1_fix17,
.main #vis .sw4 .sw_a1_fix18,
.main #vis .sw4 .sw_a1_fix19,
.main #vis .sw4 .sw_a1_fix20,
.main #vis .sw4 .sw_a1_fix21,
.main #vis .sw4 .sw_a1_fix22,
.main #vis .sw4 .sw_a1_fix23,
.main #vis .sw4 .sw_a1_fix24,
.main #vis .sw4 .sw_a1_fix25{
	top: 114px;
	color: white;
	font-size: 52px;
	font-weight: 500;
	opacity: 0;
	animation:none
}

.main #vis .sw4 .sw_a1_fix26{
	top: 205px;
	left: 100px;
	opacity: 0;
	animation:none
}

.main #vis .sw4 .color1{
	color: #00ffcb;
}
/* Words Line 1 */
.main #vis .sw4 .sw_a1_fix01{top: 30px; left: 263px;}
.main #vis .sw4 .sw_a1_fix02{left: 282px;}
.main #vis .sw4 .sw_a1_fix03{left: 319px;}
.main #vis .sw4 .sw_a1_fix04{left: 356px;}
.main #vis .sw4 .sw_a1_fix05{left: 393px;}
.main #vis .sw4 .sw_a1_fix06{left: 437px;}
.main #vis .sw4 .sw_a1_fix07{left: 475px;}
.main #vis .sw4 .sw_a1_fix08{left: 512px;}
.main #vis .sw4 .sw_a1_fix09{left: 549px;}
.main #vis .sw4 .sw_a1_fix10{top: 30px; left: 573px;}

/* Words Line 2 */
.main #vis .sw4 .sw_a1_fix11{left: 98px;}
.main #vis .sw4 .sw_a1_fix12{left: 147px;}
.main #vis .sw4 .sw_a1_fix13{left: 194px;}
.main #vis .sw4 .sw_a1_fix14{left: 242px;}
.main #vis .sw4 .sw_a1_fix15{left: 289px;}
.main #vis .sw4 .sw_a1_fix16{left: 335px;}
.main #vis .sw4 .sw_a1_fix17{left: 362px;}
.main #vis .sw4 .sw_a1_fix18{left: 409px;}
.main #vis .sw4 .sw_a1_fix19{left: 458px;}
.main #vis .sw4 .sw_a1_fix20{left: 505px;}
.main #vis .sw4 .sw_a1_fix21{left: 552px;}
.main #vis .sw4 .sw_a1_fix22{left: 600px;}
.main #vis .sw4 .sw_a1_fix23{left: 648px;}
.main #vis .sw4 .sw_a1_fix24{left: 696px;}
.main #vis .sw4 .sw_a1_fix25{left: 741px;}


.main #vis .sw4 .sw_a2 {top: 372px; left: 3px; opacity: 0;animation:none}
.main #vis .sw4 .sw_a2_1 {top: 390px; left:974px; opacity: 0;animation:none}
.main #vis .sw4 .sw_a3,
.main #vis .sw4 .sw_a3-1,
.main #vis .sw4 .sw_a3-2,
.main #vis .sw4 .sw_a3-3,
.main #vis .sw4 .sw_a3-4,
.main #vis .sw4 .sw_a3-5 {top: 305px; left: 118px; opacity: 0;animation:none}

.main #vis .sw4.on .sw_a0 {
    -webkit-animation: fade-in-right 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000).1s both;
	        animation: fade-in-right 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000).1s both;
}
/*.main #vis .sw4.on .sw_a1 {
    -webkit-animation: fade-in-left 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000).1s both;
	        animation: fade-in-left 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000).1s both;
}*/
/* Words Line 1 */
.main #vis .sw4.on .sw_a1_fix01{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1s both;
}
.main #vis .sw4.on .sw_a1_fix02{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.2s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.2s both;
}
.main #vis .sw4.on .sw_a1_fix03{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.3s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.3s both;
}
.main #vis .sw4.on .sw_a1_fix04{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.4s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.4s both;
}
.main #vis .sw4.on .sw_a1_fix05{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.5s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.5s both;
}
.main #vis .sw4.on .sw_a1_fix06{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.6s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.6s both;
}
.main #vis .sw4.on .sw_a1_fix07{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.7s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.7s both;
}
.main #vis .sw4.on .sw_a1_fix08{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.8s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.8s both;
}
.main #vis .sw4.on .sw_a1_fix09{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.9s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.9s both;
}
.main #vis .sw4.on .sw_a1_fix10{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2s both;
}

/* Words Line 2 */
.main #vis .sw4.on .sw_a1_fix11{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.1s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.1s both;
}
.main #vis .sw4.on .sw_a1_fix12{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.2s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.2s both;
}
.main #vis .sw4.on .sw_a1_fix13{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.2s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.2s both;
}
.main #vis .sw4.on .sw_a1_fix14{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.3s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.3s both;
}
.main #vis .sw4.on .sw_a1_fix15{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.4s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.4s both;
}
.main #vis .sw4.on .sw_a1_fix16{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.5s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.5s both;
}
.main #vis .sw4.on .sw_a1_fix17{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.6s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.6s both;
}
.main #vis .sw4.on .sw_a1_fix18{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.7s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.7s both;
}
.main #vis .sw4.on .sw_a1_fix19{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.8s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.8s both;
}
.main #vis .sw4.on .sw_a1_fix20{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.9s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)2.9s both;
}
.main #vis .sw4.on .sw_a1_fix21{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)3s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)3s both;
}
.main #vis .sw4.on .sw_a1_fix22{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)3.1s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)3.1s both;
}
.main #vis .sw4.on .sw_a1_fix23{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)3.2s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)3.2s both;
}
.main #vis .sw4.on .sw_a1_fix24{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)3.3s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)3.3s both;
}
.main #vis .sw4.on .sw_a1_fix25{
	-webkit-animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)3.4s both;
	        animation: fade-in-left 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)3.4s both;
}
.main #vis .sw4.on .sw_a1_fix26{
	-webkit-animation: fade-in-top 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)3.5s both;
	        animation: fade-in-top 0.2s cubic-bezier(0.390, 0.575, 0.565, 1.000)3.5s both;
}


.main #vis .sw4.on .sw_a2 {
    -webkit-animation: fade-in-right 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)1s both;
	        animation: fade-in-right 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)1s both;
}
.main #vis .sw4.on .sw_a2_1 {
    -webkit-animation: vis_star 5s 1s both;
	        animation: vis_star 5s 1s both;
}
/*.main #vis .sw4.on .sw_a3 {
    -webkit-animation: fade-in-left 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.5s both;
	        animation: fade-in-left 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.5s both;
}*/
.main #vis .sw4.on .sw_a3-5 {
    -webkit-animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.3s both;
	        animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.3s both;
}
.main #vis .sw4.on .sw_a3-4 {
    -webkit-animation: fade-in-bottom 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.7s both;
	        animation: fade-in-bottom 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)1.7s both;
}
.main #vis .sw4.on .sw_a3-3 {
    -webkit-animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)3.1s both;
	        animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)3.1s both;
}
.main #vis .sw4.on .sw_a3-2 {
    -webkit-animation: fade-in-bottom 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)3.9s both;
	        animation: fade-in-bottom 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)3.9s both;
}

.main #vis .sw4.on .sw_a3-1 {
    -webkit-animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)4.7s both;
	        animation: fade-in-top 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000)4.7s both;
}


@keyframes vis_star {
    0% {top:390px;left:974px;opacity:0}
    10% {top:390px;left:633px;opacity:1}
    14.2% {top:368px;left:615px;opacity:1}
    18.5% {top:435px;left:581px;opacity:1}
    22.7% {top:390px;left:560px;opacity:1}
    27% {top:390px;left:530px;opacity:1}
    31.2% {top:499px;left:511px;opacity:1}
    35.5% {top:338px;left:480px;opacity:1}
    39.8% {top:424px;left:457px;opacity:1}
    44% {top:390px;left:450px;opacity:1}
    48.2% {top:390px;left:429px;opacity:1}
    52.5% {top:378px;left:407px;opacity:1}
    56.7% {top:390px;left:383px;opacity:1}
    61% {top:390px;left:276px;opacity:1}
    65.2% {top:366px;left:256px;opacity:1}
    69.5% {top:435px;left:220px;opacity:1}
    73.7% {top:390px;left:198px;opacity:1}
    78% {top:390px;left:170px;opacity:1}
    82.2% {top:475px;left:153px;opacity:1}
    86.5% {top:346px;left:121px;opacity:1}
    91.7% {top:390px;left:100px;opacity:1}
    100% {top:390px;left:-30px;opacity:1}
}

/* Slide Control */
.main > #vis .controlWrap{
    position: absolute;
    left: 50%;
    bottom: 50px;
    width: 1210px;
    height: 34px;
    transform: translateX(-50%);
    z-index: 605;
}
.main > #vis .control{
    text-align: center;
}
.main > #vis .control img{
    cursor: pointer;
}
.main > #vis .control img.control-button-play{
    display: none;
}
.main > #vis .control img.control-button-play,
.main > #vis .control img.control-button-stop{
    margin: 0 10px;
}

@-webkit-keyframes fade-in-top {
  0% {
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-in-top {
  0% {
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

@-webkit-keyframes fade-in-left {
  0% {
    -webkit-transform: translateX(-50px);
            transform: translateX(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fade-in-left {
  0% {
    -webkit-transform: translateX(-50px);
            transform: translateX(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}


@-webkit-keyframes fade-in-right {
  0% {
    -webkit-transform: translateX(50px);
            transform: translateX(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fade-in-right {
  0% {
    -webkit-transform: translateX(50px);
            transform: translateX(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}

@-webkit-keyframes slide-in-top {
  0% {
    -webkit-transform: translateY(-1000px);
            transform: translateY(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slide-in-top {
  0% {
    -webkit-transform: translateY(-1000px);
            transform: translateY(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

@-webkit-keyframes fade-in-bottom {
  0% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-in-bottom {
  0% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}


@-webkit-keyframes slide-in-left {
  0% {
    -webkit-transform: translateX(-1000px);
            transform: translateX(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes slide-in-left {
  0% {
    -webkit-transform: translateX(-1000px);
            transform: translateX(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}

@-webkit-keyframes slide-in-bottom {
  0% {
    -webkit-transform: translateY(1000px);
            transform: translateY(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slide-in-bottom {
  0% {
    -webkit-transform: translateY(1000px);
            transform: translateY(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

@-webkit-keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
@keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}

@-webkit-keyframes swing-in-top-fwd {
  0% {
    -webkit-transform: rotateX(-100deg);
            transform: rotateX(-100deg);
    -webkit-transform-origin: top;
            transform-origin: top;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0deg);
            transform: rotateX(0deg);
    -webkit-transform-origin: top;
            transform-origin: top;
    opacity: 1;
  }
}
@keyframes swing-in-top-fwd {
  0% {
    -webkit-transform: rotateX(-100deg);
            transform: rotateX(-100deg);
    -webkit-transform-origin: top;
            transform-origin: top;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0deg);
            transform: rotateX(0deg);
    -webkit-transform-origin: top;
            transform-origin: top;
    opacity: 1;
  }
}

@-webkit-keyframes bounce-in-top {
  0% {
    -webkit-transform: translateY(-500px);
            transform: translateY(-500px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }
  38% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(-65px);
            transform: translateY(-65px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  72% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  81% {
    -webkit-transform: translateY(-28px);
            transform: translateY(-28px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  90% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  95% {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
}
@keyframes bounce-in-top {
  0% {
    -webkit-transform: translateY(-500px);
            transform: translateY(-500px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }
  38% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(-65px);
            transform: translateY(-65px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  72% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  81% {
    -webkit-transform: translateY(-28px);
            transform: translateY(-28px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  90% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  95% {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
}

@-webkit-keyframes roll-in-left {
  0% {
    -webkit-transform: translateX(-800px) rotate(-540deg);
            transform: translateX(-800px) rotate(-540deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotate(0deg);
            transform: translateX(0) rotate(0deg);
    opacity: 1;
  }
}
@keyframes roll-in-left {
  0% {
    -webkit-transform: translateX(-800px) rotate(-540deg);
            transform: translateX(-800px) rotate(-540deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotate(0deg);
            transform: translateX(0) rotate(0deg);
    opacity: 1;
  }
}

@-webkit-keyframes flicker-in-1 {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 0;
  }
  10.1% {
    opacity: 1;
  }
  10.2% {
    opacity: 0;
  }
  20% {
    opacity: 0;
  }
  20.1% {
    opacity: 1;
  }
  20.6% {
    opacity: 0;
  }
  30% {
    opacity: 0;
  }
  30.1% {
    opacity: 1;
  }
  30.5% {
    opacity: 1;
  }
  30.6% {
    opacity: 0;
  }
  45% {
    opacity: 0;
  }
  45.1% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  55% {
    opacity: 1;
  }
  55.1% {
    opacity: 0;
  }
  57% {
    opacity: 0;
  }
  57.1% {
    opacity: 1;
  }
  60% {
    opacity: 1;
  }
  60.1% {
    opacity: 0;
  }
  65% {
    opacity: 0;
  }
  65.1% {
    opacity: 1;
  }
  75% {
    opacity: 1;
  }
  75.1% {
    opacity: 0;
  }
  77% {
    opacity: 0;
  }
  77.1% {
    opacity: 1;
  }
  85% {
    opacity: 1;
  }
  85.1% {
    opacity: 0;
  }
  86% {
    opacity: 0;
  }
  86.1% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes flicker-in-1 {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 0;
  }
  10.1% {
    opacity: 1;
  }
  10.2% {
    opacity: 0;
  }
  20% {
    opacity: 0;
  }
  20.1% {
    opacity: 1;
  }
  20.6% {
    opacity: 0;
  }
  30% {
    opacity: 0;
  }
  30.1% {
    opacity: 1;
  }
  30.5% {
    opacity: 1;
  }
  30.6% {
    opacity: 0;
  }
  45% {
    opacity: 0;
  }
  45.1% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  55% {
    opacity: 1;
  }
  55.1% {
    opacity: 0;
  }
  57% {
    opacity: 0;
  }
  57.1% {
    opacity: 1;
  }
  60% {
    opacity: 1;
  }
  60.1% {
    opacity: 0;
  }
  65% {
    opacity: 0;
  }
  65.1% {
    opacity: 1;
  }
  75% {
    opacity: 1;
  }
  75.1% {
    opacity: 0;
  }
  77% {
    opacity: 0;
  }
  77.1% {
    opacity: 1;
  }
  85% {
    opacity: 1;
  }
  85.1% {
    opacity: 0;
  }
  86% {
    opacity: 0;
  }
  86.1% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes slide-in-elliptic-left-fwd {
  0% {
    -webkit-transform: translateX(-800px) rotateY(30deg) scale(0);
            transform: translateX(-800px) rotateY(30deg) scale(0);
    -webkit-transform-origin: -100% 50%;
            transform-origin: -100% 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
            transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: 1800px 50%;
            transform-origin: 1800px 50%;
    opacity: 1;
  }
}
@keyframes slide-in-elliptic-left-fwd {
  0% {
    -webkit-transform: translateX(-800px) rotateY(30deg) scale(0);
            transform: translateX(-800px) rotateY(30deg) scale(0);
    -webkit-transform-origin: -100% 50%;
            transform-origin: -100% 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
            transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: 1800px 50%;
            transform-origin: 1800px 50%;
    opacity: 1;
  }
}

@-webkit-keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
    opacity: 1;
  }
}
@keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
    opacity: 1;
  }
}

@-webkit-keyframes gradient {
    0%{
      background-position:0% 50%;
      opacity: 1;
    }
    50%{
      background-position:100% 50%;
      opacity: 1;
    }
    100%{
      background-position:0% 50%;
      opacity: 1;
    }
}
@keyframes gradient { 
    0%{
      background-position:0% 50%;
      opacity: 1;
    }
    50%{
      background-position:100% 50%;
      opacity: 1;
    }
    100%{
      background-position:0% 50%;
      opacity: 1;
    }
}
@-webkit-keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transform-origin: center center;
            transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  10% {
    -webkit-transform: scale(0.91);
            transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  17% {
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  33% {
    -webkit-transform: scale(0.87);
            transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  45% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}
@keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transform-origin: center center;
            transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  10% {
    -webkit-transform: scale(0.91);
            transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  17% {
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  33% {
    -webkit-transform: scale(0.87);
            transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  45% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}


@-webkit-keyframes wobble-hor-top {
  0%,
  100% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
  }
  15% {
    -webkit-transform: translateX(-30px) rotate(6deg);
            transform: translateX(-30px) rotate(6deg);
  }
  30% {
    -webkit-transform: translateX(15px) rotate(-6deg);
            transform: translateX(15px) rotate(-6deg);
  }
  45% {
    -webkit-transform: translateX(-15px) rotate(3.6deg);
            transform: translateX(-15px) rotate(3.6deg);
  }
  60% {
    -webkit-transform: translateX(9px) rotate(-2.4deg);
            transform: translateX(9px) rotate(-2.4deg);
  }
  75% {
    -webkit-transform: translateX(-6px) rotate(1.2deg);
            transform: translateX(-6px) rotate(1.2deg);
  }
}
@keyframes wobble-hor-top {
  0%,
  100% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
  }
  15% {
    -webkit-transform: translateX(-30px) rotate(6deg);
            transform: translateX(-30px) rotate(6deg);
  }
  30% {
    -webkit-transform: translateX(15px) rotate(-6deg);
            transform: translateX(15px) rotate(-6deg);
  }
  45% {
    -webkit-transform: translateX(-15px) rotate(3.6deg);
            transform: translateX(-15px) rotate(3.6deg);
  }
  60% {
    -webkit-transform: translateX(9px) rotate(-2.4deg);
            transform: translateX(9px) rotate(-2.4deg);
  }
  75% {
    -webkit-transform: translateX(-6px) rotate(1.2deg);
            transform: translateX(-6px) rotate(1.2deg);
  }
}

@keyframes wobble-hor-top-little {
  0%,
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  15% {
    -webkit-transform: translateX(-1px) rotate(2deg);
            transform: translateX(-1px) rotate(2deg);
  }
  30% {
    -webkit-transform: translateX(1px) rotate(-2deg);
            transform: translateX(1px) rotate(-2deg);
  }
  45% {
    -webkit-transform: translateX(-1px) rotate(2.6deg);
            transform: translateX(-1px) rotate(2.6deg);
  }
  60% {
    -webkit-transform: translateX(1px) rotate(-2.4deg);
            transform: translateX(1px) rotate(-2.4deg);
  }
  75% {
    -webkit-transform: translateX(-1px) rotate(1.2deg);
            transform: translateX(-1px) rotate(1.2deg);
  }
}


/*

    Intro Area

*/
#contents.main section.introArea {margin: 80px auto;}
#contents.main section.introArea h2 {font-size:44px;color:#333;text-align:center;letter-spacing: 0.5px;}
#contents.main section.introArea .w1210 > p {font-size:20px;color:#333;text-align:center; font-weight:400;letter-spacing: 0.5px;}
#contents.main section.introArea .w1210 > p span {color:#f2575e}
#contents.main section.introArea #slideAreaSlide {padding-bottom: 52px; margin:50px auto 0}
#contents.main section.introArea #slideAreaSlide .innerContents img {margin-bottom:15px}
#contents.main section.introArea #slideAreaSlide .innerContents p {font-size:30px;margin-bottom:5px;font-weight:500}
#contents.main section.introArea #slideAreaSlide .innerContents span {font-size:18px;display:block;margin-bottom:24px;font-weight:500;position:relative;}
#contents.main section.introArea #slideAreaSlide .innerContents span .fa-angle-right {color: #f3574a;font-size:20px;margin-left: 5px;position:Absolute;top:8px;right:8px}
#contents.main section.introArea #slideAreaSlide .innerContents .slideBtn {position:relative;float:left;width:195px;display:inline-block;border: 1px solid #f3574a;height: 40px;line-height: 40px;padding-left: 10px;font-size: 18px;color: #f3574a;box-sizing:border-box}
#contents.main section.introArea #slideAreaSlide .innerContents .slideBtn1 {border-right:0}
#contents.main section.introArea #slideAreaSlide .innerContents img.over {opacity:0;position: absolute;top: 0;left: 0;}
#contents.main section.introArea #slideAreaSlide .innerContents:hover img.over {opacity:1}
/*#contents.main section.introArea .swiper-container-horizontal > .swiper-scrollbar {bottom:-30px;width:100%;left:0}*/

#contents.main section.introArea #slideAreaSlide .innerContents .slideBtn:after {content:"";position:absolute;display:block;left:0;top:0px;width:0;transition:all .4s;z-index:1;height:100%;background:#f3574a}
#contents.main section.introArea #slideAreaSlide .innerContents .slideBtn:after {}
#contents.main section.introArea #slideAreaSlide .innerContents .slideBtn:hover {color:#fff}
#contents.main section.introArea #slideAreaSlide .innerContents .slideBtn:hover:after {width:100%;color:#fff}
#contents.main section.introArea #slideAreaSlide .innerContents .slideBtn:hover span {position:relative;z-index:99}
#contents.main section.introArea #slideAreaSlide .innerContents .slideBtn:hover span .fa-angle-right {color:#fff}

#contents.main section.introArea #slideAreaSlide .swiper-pagination {
	top: auto;
	bottom: 0px;
}
#contents.main section.introArea #slideAreaSlide .swiper-pagination > .swiper-pagination-progressbar-fill{
	background: #000000;
}


/* 

    Slide Area 

*/

#contents.main section.introArea .innerContents{
    position: relative;
    width: 404px !important;
    height: 610px !important;
}
#contents.main section.introArea .innerContents > img.bg{
    width: 100%;
    height: 100%;
    transition: .3s;
}
#contents.main section.introArea .innerContents > ul.linkList{
    position: absolute;
    display: inline-flex;
    bottom: 95px;
    left: 49px;
    width: 260px;
    height: 80px;
}
#contents.main section.introArea .innerContents > ul.linkList > li{
    position: relative;
    width: 80px;
    height: 80px;
    border-radius: 50px;
    text-align: center;
    background-color: rgba(48, 46, 46, 0.9);;
}
#contents.main section.introArea .innerContents > ul.linkList > li:hover{
    background-color: /*rgba(25, 89, 199, 0.9);*/#1c64e3;
    opacity:0.85
}
#contents.main section.introArea .innerContents > ul.linkList > li > div.balloon {
    display: none;
    position: absolute;
    top: -40px;
    left: 20px;
    width: 45px;
    height: 25px;
    color: #1959c7;
    line-height: 22px;
    border: solid #1959c7 1px;
    border-radius: 5px;
    background-color: transparent;
    animation: none;
}
#contents.main section.introArea .innerContents > ul.linkList > li > div.balloon:after {
    content: '';
    position: absolute;
    border-top: 10px solid #1959c7;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    bottom: -11px;
    left: 14px;
}
#contents.main section.introArea .innerContents > ul.linkList > li:hover > div.balloon{
    display: inline-block;
    animation: Twinkle 1s .5s infinite ease alternate;
}
#contents.main section.introArea .innerContents > ul.linkList > li:hover > div.balloon:after{
    display: inline-block;
    animation: Twinkle2 1s .5s infinite ease alternate;
}
@-webkit-keyframes Twinkle {
    0% {border: solid #302e2e 1px; color:#302e2e}
    100% {border: solid #1959c7 1px; color:#1959c7}
}
@keyframes Twinkle {
    0% {border: solid #302e2e 1px; color:#302e2e}
    100% {border: solid #1959c7 1px; color:#1959c7}
}
@-webkit-keyframes Twinkle2 {
    0% {border-top: 10px solid #302e2e}
    100% {border-top: 10px solid #1959c7}
}
@keyframes Twinkle2 {
    0% {border-top: 10px solid #302e2e}
    100% {border-top: 10px solid #1959c7}
}
#contents.main section.introArea .innerContents > ul.linkList > li > a{
    display: block;
    width: inherit;
    height: inherit;
}
#contents.main section.introArea .innerContents > ul.linkList > li > a > img{
    width: 58px;
    height: 32px;
    margin-top: 15px;
}
#contents.main section.introArea .innerContents > ul.linkList > li > a > h3{
    font-size: 14px;
    color: white;
    font-weight: 500;
}
#contents.main section.introArea .innerContents > ul.linkList > li:nth-child(2){
    margin: 0 10px;
}





/* Strength Area */
.strengthFixArea {background-color:#f6f5f3;padding:80px 0}
.strengthFixArea h2 {font-size:44px;color:#333;text-align:center;letter-spacing: 0.5px;}
.strengthFixArea .w1210 > p {font-size:20px;color:#333;text-align:center; font-weight:400;letter-spacing: 0.5px;}
.strengthFixArea .w1210 > p span {color:#f2575e}

#strengthFixAreaInnerWrap {margin:50px auto 0}
#strengthFixAreaInnerWrap .strengthArea_title {position:absolute;top:50px;left:0}
#strengthFixAreaInnerWrap .swiper-pagination {position: absolute;top: 163px;left: 410px;width: auto;}
#strengthFixAreaInnerWrap .swiper-pagination span {font-size:13px;color:#000;background:none;margin:0 8px;opacity:1}
#strengthFixAreaInnerWrap .swiper-pagination span:hover {color:#f6685c;}
#strengthFixAreaInnerWrap .swiper-pagination a {margin:0 8px;font-size:12px;color:#000}


#contents.main section.strengthArea div.innerWrap{
    position: relative;
    width:0%;
    height:472px;
    background: url('../../img/main/strengthAreaImgBg.png') no-repeat;
    background-size: cover;
    
    -webkit-transition: width 1.0s;
    -moz-transition: width 1.0s;
    -o-transition: width 1.0s;
    -ms-transition: width 1.0s;
    transition: width 1.0s;
    
    opacity: 0;
    filter: Alpha(opacity=0);
    visibility: hidden;
    -ms-transform: scale(0.9,0.9);
    -webkit-transform: scale(0.9,0.9);
    -moz-transform: scale(0.9,0.9);
    -o-transform: scale(0.9,0.9);
    transform: scale(0.9,0.9);
    -webkit-transition: all 0.6s 0.4s;
    -moz-transition: all 0.6s 0.4s;
    -o-transition: all 0.6s 0.4s;
    -ms-transition: all 0.6s 0.4s;
    transition: all 0.6s 0.4s;
}
#contents.main section.strengthArea div.innerWrap.bg2{
    background: url('../../img/main/strengthAreaImgBg2.png') no-repeat;
    background-size: cover;
}
#contents.main section.strengthArea div.innerWrap.bg3{
    background: url('../../img/main/strengthAreaImgBg3.png') no-repeat;
    background-size: cover;
}
#contents.main section.strengthArea.action div.innerWrap{
    width:100%;
    opacity:1;
    visibility: visible;
    filter:Alpha(opacity=100);
    -ms-transform:scale(1.0,1.0); 
    -webkit-transform:scale(1.0,1.0); 
    -moz-transform:scale(1.0,1.0); 
    -o-transform:scale(1.0,1.0); 
    transform:scale(1.0,1.0);
}
#contents.main section.strengthArea div.innerWrap > a > img.text{
    position: absolute;
    top:130px;
    right:1090px;
    width: 552px;
    height: 442px;
    z-index:600;
}
#contents.main section.strengthFixArea div.innerWrap > a.more{
    opacity: 0;
    position: absolute;
    bottom:0;
    left:0;
    width: 125px;
    height: 30px;
    font-size: 14px;
    letter-spacing: 0px;
    color: #ffffff;
    background-color: #333333;
    padding-top: 5px;
    padding-left: 12px;
    z-index:500;
}

#contents.main section.strengthFixArea div.innerWrap > a.more > span.arrow{
    position: absolute;
    top:17px;
    right:12px;
    width: 20px;
    height: 1px;
    display: block;
    background: white;
    -webkit-transition:.5s;
    transition:.5s;
}
#contents.main section.strengthFixArea div.innerWrap > a.more > span.arrow::before{
    content: '';
    display: block;
    height: 1px;
    background: white;
}
#contents.main section.strengthFixArea div.innerWrap > a.more > span.arrow::after{
    content: '';
    display: block;
    position: absolute;
    top: -3px;
    right: 0;
    width: 8px;
    height: 1px;
    background: white;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
#contents.main section.strengthFixArea div.innerWrap a.more:hover{
    background-color:#f6685c;
    color:#fff
}
#contents.main section.strengthFixArea div.innerWrap a.more:hover > span.arrow,
#contents.main section.strengthFixArea div.innerWrap a.more:hover > span.arrow::before,
#contents.main section.strengthFixArea div.innerWrap a.more:hover > span.arrow::after{
    background: #fff;
}

#contents.main section.strengthFixArea.active div.innerWrap > a.more{
    opacity: 1;
}


#contents.main section.strengthArea div.innerWrap > img.cover{
    opacity: 0;
    filter: Alpha(opacity=0);
    visibility: hidden;
    -ms-transform:scale(0.7); 
    -webkit-transform:scale(0.7); 
    -moz-transform:scale(0.7); 
    -o-transform:scale(0.7); 
    transform:scale(0.7);
    
    position: absolute;
    top:50px;
    right:0px;
    width:990px;
    height: 660px;
}
#contents.main section.strengthArea.action div.innerWrap > img.cover {animation: strengthAreaCoverAction 1s 1s 1 ease forwards;}

@keyframes strengthAreaCoverAction {
    0% {
        transform: translateY(-40px);
        opacity: 0;
        filter: Alpha(opacity=0);
        visibility: hidden;
        -ms-transform:scale(0.7); 
        -webkit-transform:scale(0.7); 
        -moz-transform:scale(0.7); 
        -o-transform:scale(0.7); 
        transform:scale(0.7);
    }
    100% {
        transform: translateY(0px);
        opacity: 1;
        filter: Alpha(opacity=100);
        visibility: visible;
        -ms-transform:scale(1); 
        -webkit-transform:scale(1); 
        -moz-transform:scale(1); 
        -o-transform:scale(1); 
        transform:scale(1);
    }
}
#contents.main section.strengthArea .strengthAreaInnerWrap-pagination{
    opacity: 0;
    position: absolute;
    z-index: 2;
    bottom: 135px;
    font-size: 16px;
    font-weight: 500;
    color: #ffffff00;
    text-align: right;
    padding-right: 1090px;
}
#contents.main section.strengthArea .strengthAreaInnerWrap-control{
    opacity: 0;
    position: absolute;
    z-index: 2;
    right: 0;
    bottom: 120px;
    padding-right: 1090px;
}
#contents.main section.strengthArea .strengthAreaInnerWrap-control img{
    cursor: pointer;
}
#contents.main section.strengthArea .strengthAreaInnerWrap-control img.strengthAreaInnerWrap-control-button-play{
    display: none;
}
#contents.main section.strengthArea .strengthAreaInnerWrap-control img.strengthAreaInnerWrap-control-button-play,
#contents.main section.strengthArea .strengthAreaInnerWrap-control img.strengthAreaInnerWrap-control-button-stop{
    margin: 0 10px;
}
#contents.main section.strengthArea.action .strengthAreaInnerWrap-pagination{
    opacity: 1;
    color: gray;
}
#contents.main section.strengthArea.action .strengthAreaInnerWrap-control{
    opacity: 1;
}
#contents.main section.strengthArea .strengthAreaInnerWrap-pagination-bullet{
    padding-right: 20px;
    cursor: pointer;
}
#contents.main section.strengthArea .strengthAreaInnerWrap-pagination-bullet:last-child{
    padding-right: 0px;
}
#contents.main section.strengthArea .strengthAreaInnerWrap-pagination-bullet.strengthAreaInnerWrap-pagination-bullet-active{
    color:white;
}

/* 

    Strengt Fix Area 

*/

#contents.main section.strengthFixArea div.innerWrap{
    position: relative;
    width:100%;
    height:472px;
    margin: 0 auto;
}
#contents.main section.strengthFixArea div.innerWrap > a > img.text{
    position: absolute;
    top:206px;
    left:0;
    /*width:234px;
    height: 257px;*/
    z-index:600;
    
    opacity: 0;
}
#contents.main section.strengthFixArea div.innerWrap > a > img.text2 {
    position: absolute;
    top:301px;
    left:0;
    /*width: 382px;
    height: 257px;*/
    z-index:600;
    
    opacity: 0;
}
#contents.main section.strengthFixArea div.innerWrap > a > img.text3 {
    position: absolute;
    top:0;
    right:0;
    /*width: 382px;
    height: 257px;*/
    z-index:600;
    
    opacity: 0;
}
#contents.main section.strengthFixArea div.innerWrap > div.lineWidth,
#contents.main section.strengthFixArea div.innerWrap > div.lineHeight{
    position: absolute;
    background-color: rgba(255, 255, 255, 0.3137254901960784); 
    opacity: 0;
}
#contents.main section.strengthFixArea div.innerWrap > div.lineWidth{
    top: 163px;
    height: 6px;
}
#contents.main section.strengthFixArea div.innerWrap > div.lineHeight{
    left: 546px;
    width: 6px;
}

#contents.main section.strengthFixArea div.innerWrap > div.line1{
    left: 141px;
    width: 20px;
}
#contents.main section.strengthFixArea div.innerWrap > div.line1.number02{
    left: 193px;
    width: 20px;
}
#contents.main section.strengthFixArea div.innerWrap > div.line1.number03{
    left: 166px;
    width: 20px;
}
#contents.main section.strengthFixArea div.innerWrap > div.line2{
    left: 168px;
    width: 6px;
}
#contents.main section.strengthFixArea div.innerWrap > div.line2.number02{
    left: 221px;
    width: 6px;
}
#contents.main section.strengthFixArea div.innerWrap > div.line2.number03{
    left: 195px;
    width: 6px;
}
#contents.main section.strengthFixArea div.innerWrap > div.line3{
    left: 181px;
    width: 6px;
}
#contents.main section.strengthFixArea div.innerWrap > div.line3.number02{
    left: 233px;
    width: 6px;
}
#contents.main section.strengthFixArea div.innerWrap > div.line3.number03{
    left: 210px;
    width: 6px;
}
#contents.main section.strengthFixArea div.innerWrap > div.line4{
    left: 194px;
    width: 352px;
}
#contents.main section.strengthFixArea div.innerWrap > div.line4.number02{
    left: 246px;
    width: 300px;
}
#contents.main section.strengthFixArea div.innerWrap > div.line4.number03{
    left: 223px;
    width: 323px;
}
#contents.main section.strengthFixArea div.innerWrap > div.line5{
    top: 163px;
    height: 325px;
}
#contents.main section.strengthFixArea div.innerWrap > div.line6{
    top: 495px;
    height: 6px;
}
#contents.main section.strengthFixArea div.innerWrap > div.line7{
    top: 507px;
    height: 6px;
}
#contents.main section.strengthFixArea div.innerWrap > div.line8{
    top: 520px;
    height: 20px;
}
#contents.main section.strengthFixArea div.innerWrap > span.more{
    position: absolute;
    top:307px;
    left:40px;
    width: 125px;
    height: 30px;
    line-height:24px;
    color:white;
    font-size: 14px;
    border:solid white 1px;
    padding-top: 2px;
    padding-left: 12px;
    z-index:500;
    opacity: 0;
}
#contents.main section.strengthFixArea div.innerWrap > span.more > span.arrow{
    position: absolute;
    top:13px;
    right:12px;
    width: 20px;
    height: 1px;
    display: block;
    background: white;
    -webkit-transition:.5s;
    transition:.5s;
}
#contents.main section.strengthFixArea div.innerWrap > span.more > span.arrow::before{
    content: '';
    display: block;
    height: 1px;
    background: white;
}
#contents.main section.strengthFixArea div.innerWrap > span.more > span.arrow::after{
    content: '';
    display: block;
    position: absolute;
    top: -3px;
    right: 0;
    width: 8px;
    height: 1px;
    background: white;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
#contents.main section.strengthFixArea div.innerWrap a:hover + span.more{
    color:#31343b;
    border:solid #31343b 1px;
    background-color: white;
}
#contents.main section.strengthFixArea div.innerWrap a:hover + span.more > span.arrow,
#contents.main section.strengthFixArea div.innerWrap a:hover + span.more > span.arrow::before,
#contents.main section.strengthFixArea div.innerWrap a:hover + span.more > span.arrow::after{
    background: #31343b;
}

#contents.main section.strengthFixArea div.innerWrap > img.cover{
    opacity: 0;
    filter: Alpha(opacity=0);
    /*visibility: hidden;*/
    /*-ms-transform:scale(0.7); 
    -webkit-transform:scale(0.7); 
    -moz-transform:scale(0.7); 
    -o-transform:scale(0.7); 
    transform:scale(0.7);*/
    
    position: absolute;
    top:50px;
    right:-17.5%;
    /*width:990px;
    height: 660px;*/
}
#contents.main section.strengthFixArea div.innerWrap.on > a > img.text{
    -webkit-animation: slide-in-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940).1s both;
            animation: slide-in-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940).1s both;
}
#contents.main section.strengthFixArea div.innerWrap.on > img.cover {-webkit-animation:strengthFixAreaCoverInit2 0.5s .1s both;animation: strengthFixAreaCoverInit2 0.5s .1s both}
@-webkit-keyframes strengthFixAreaCoverInit2 {
    0% {
        right:-30%;
        opacity: 0;
    }
    100% {
        right:-17.5%;
        opacity: 1;
    }
}
@keyframes strengthFixAreaCoverInit2 {
    0% {
        right:-30%;
        opacity: 0;
    }
    100% {
        right:-17.5%;
        opacity: 1;
    }
}


#contents.main section.strengthFixArea div.innerWrap.on > a > img.text2{
    -webkit-animation: slide-in-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940)0.6s both;
            animation: slide-in-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940)0.6s both;
}
#contents.main section.strengthFixArea div.innerWrap.on > a > img.text3{
    -webkit-animation: fade-in-right 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940)0.9s both;
            animation: fade-in-right 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940)0.9s both;
}
#contents.main section.strengthFixArea div.innerWrap.on > a.more{
    -webkit-animation: slide-in-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940)0.9s both;
            animation: slide-in-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940)0.9s both;
}

@-webkit-keyframes slide-in-left {
  0% {
    -webkit-transform: translateX(-1000px);
            transform: translateX(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes slide-in-left {
  0% {
    -webkit-transform: translateX(-1000px);
            transform: translateX(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}

@-webkit-keyframes fade-in-right {
  0% {
    -webkit-transform: translateX(50px);
            transform: translateX(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fade-in-right {
  0% {
    -webkit-transform: translateX(50px);
            transform: translateX(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}

#contents.main section.strengthFixArea .strengthFixAreaInnerWrap-controlWrap{
    position: absolute;
    left: 50%;
    bottom: 120px;
    width: 1210px;
    height: 34px;
    transform: translateX(-50%);
    z-index: 605;
}
#contents.main section.strengthFixArea .strengthFixAreaInnerWrap-control{
    position: absolute;
    left: 335px;
}
#contents.main section.strengthFixArea .strengthFixAreaInnerWrap-control img{
    cursor: pointer;
}
#contents.main section.strengthFixArea .strengthFixAreaInnerWrap-control img.strengthAreaInnerWrap-control-button-play{
    display: none;
}
#contents.main section.strengthFixArea .strengthFixAreaInnerWrap-control img.strengthAreaInnerWrap-control-button-play,
#contents.main section.strengthFixArea .strengthFixAreaInnerWrap-control img.strengthAreaInnerWrap-control-button-stop{
    margin: 0 10px;
}


/* story Area */
.storyArea {padding:80px 0}
.storyArea h2 {font-size:44px;color:#333;text-align:center;letter-spacing: 0.5px;}
.storyArea .w1210 > p {font-size:20px;color:#333;text-align:center; font-weight: 400;letter-spacing: 0.5px;}
.storyArea .w1210 > p span {color:#f2575e}

.storyArea .story_inner {position:relative;padding:50px 0 0}
.storyArea .story_img {position:absolute;top:-119px;left:0;z-index:99}
.storyArea .story_ico {
	position:absolute;
	top:100px;
	left:500px;
	z-index:99;
	-webkit-animation: story_ico 1s 1s infinite both;
			animation: story_ico 1s 1s infinite both;
}

@-webkit-keyframes story_ico {
  0%,100% {
	transform: rotateZ(-10deg);
  }
  50% {
	transform: rotateZ(10deg);
  }
}

@keyframes story_ico {
  0%,100% {
	transform: rotateZ(-10deg);
  }
  50% {
	transform: rotateZ(10deg);
  }
}
.storyArea .story_text {position:absolute;top:50px;left:287px;font-size:18px;color:#333;letter-spacing: -0.5px;}
.storyArea .story_text span {color:#f2575e}
.storyArea .bx-wrapper {width:594px;float:left;padding-top:132px}
.storyArea .bx-wrapper .bx-controls {position: absolute;top: 115px;left: 287px;z-index:99;width:72px;height:20px}
.storyArea .bx-wrapper .bx-controls div {display:inline-block}
.storyArea .bx-wrapper .bx-controls div a {display:block;width:20px;height:20px;font-size:0}
.storyArea .bx-wrapper .bx-controls .bx-prev {background:url('../../img/main/story_slidePrev.png') no-repeat center center;position:absolute;left:0;top:0}
.storyArea .bx-wrapper .bx-controls .bx-next {background:url('../../img/main/story_slideNext.png') no-repeat center center;position:absolute;right:0;top:0}
.storyArea .bx-wrapper .bx-controls .bx-stop {background:url('../../img/main/story_slideStop.png') no-repeat center center;position: absolute;top: 0;left: 26px;}
.storyArea .bx-wrapper .bx-controls .bx-start {background:url('../../img/main/story_slideStart.png') no-repeat center center;position: absolute;top: 0;left: 26px;}


.storyArea .story_btn {float:right;width:595px}
.storyArea .story_btn > a {display:inline-block;float:left;width:287px;height:250px;}
.storyArea .story_btn .story_btn1, .storyArea .story_btn .story_btn3 {margin-right:20px}
.storyArea .story_btn .story_btn1, .storyArea .story_btn .story_btn2 {margin-bottom:20px}
.storyArea .story_btn .story_btn1, .storyArea .story_btn .story_btn4 {background-color:#f6685c;color:#fff;text-align:center;padding-top:50px}
.storyArea .story_btn .story_btn1 img, .storyArea .story_btn .story_btn4 img {margin-bottom:8px}
.storyArea .story_btn .story_btn1 span, .storyArea .story_btn .story_btn4 span {display:block;font-size:16px;margin-bottom: 20px;letter-spacing: 0;}
.storyArea .story_btn .story_btn1 h3, .storyArea .story_btn .story_btn4 h3 {font-size:24px;font-weight: 300;letter-spacing: -1.5px;}
.storyArea .story_btn .story_btn1 h2, .storyArea .story_btn .story_btn4 h2 {font-size:32px;color:#fff}
.storyArea .story_btn .story_btn4 h2 {font-weight:400;letter-spacing: -1px;}
.storyArea .story_btn .story_btn1:hover, .storyArea .story_btn .story_btn4:hover {background-color:#026f96}

.storyArea .story_btn .story_btn2 {background:url('../../img/main/story_btn2.jpg') no-repeat center center;background-size:cover}
.storyArea .story_btn .story_btn3 {background:url('../../img/main/story_btn3.jpg') no-repeat center center;background-size:cover}
.storyArea .story_btn .story_btn2, .storyArea .story_btn .story_btn3 {padding:50px 30px;text-align:left;color:#333}
.storyArea .story_btn .story_btn2 span, .storyArea .story_btn .story_btn3 span {font-size:16px;letter-spacing:0px}
.storyArea .story_btn .story_btn2 h2, .storyArea .story_btn .story_btn3 h2 {font-size:32px;text-align: left;}
.storyArea .story_btn .story_btn2 p, .storyArea .story_btn .story_btn3 p {font-size:14px;line-height: 1.3;}
.storyArea .story_btn .story_btn2:hover, .storyArea .story_btn .story_btn3:hover {color:#f6685c}
.storyArea .story_btn .story_btn2:hover h2, .storyArea .story_btn .story_btn3:hover h2 {color:#f6685c}

/* cm Area */
.cmArea {padding:80px 0;background:#e9eef1}
.cmArea h2 {font-size:44px;color:#333;text-align:center;letter-spacing: 0.5px;}
.cmArea .w1210 > p {font-size:20px;color:#333;text-align:center; font-weight: 300;letter-spacing: 0.5px;}
.cmArea .w1210 > p span {color:#f2575e}
#contents.main .storyArea div.innerWrap {margin-top:30px}
#contents.main .storyArea div.innerWrap > ul{width:1210px;height:100px;font-size:0px;border-bottom: solid 1px #bbbbbb;margin-bottom: 20px;}
#contents.main .storyArea div.innerWrap > ul:last-child{margin-bottom: 0px;}
#contents.main .storyArea div.innerWrap > ul >li{width:595px;height:inherit;display: inline-block;font-size:11px;overflow: hidden;}
#contents.main .storyArea div.innerWrap > ul >li:first-child{margin-right:20px;}
#contents.main .storyArea div.innerWrap > ul li > ul.info,
#contents.main .storyArea div.innerWrap > ul li > ul.link{display: flex;height: inherit;}
#contents.main .storyArea div.innerWrap > ul li > ul.info > li,
#contents.main .storyArea div.innerWrap > ul li > ul.link > li{position: relative;flex: 0 1 auto;height: inherit;overflow: hidden;}
#contents.main .storyArea div.innerWrap > ul li > ul.info > li:first-child{width:355px;margin-right: 15px;}
#contents.main .storyArea div.innerWrap > ul li > ul.info li > ul{font-size: 16px;font-weight: 600;color: #333333;letter-spacing: 0px;padding: 2px 0 20px 90px;}
#contents.main .storyArea div.innerWrap > ul li > ul.info li > ul > li{margin-bottom: 5px;}
#contents.main .storyArea div.innerWrap > ul li > ul.info li > h4{font-size: 30px;font-weight: 600;color: #333333;letter-spacing: 0px;line-height: 35px;padding: 10px 0 0px 90px;}
#contents.main .storyArea div.innerWrap > ul li > ul.info li > ul li > h3{display: inline-block;width: 75px;letter-spacing: 0px;font-weight: 600;text-align: justify;text-align-last: justify;margin-right: 15px;}
#contents.main .storyArea div.innerWrap > ul li > ul.info li div.header{position: absolute;top:0;left:0;width: 75px;text-align: center;}
#contents.main .storyArea div.innerWrap > ul li > ul.info li div.header > h3{font-size: 20px;font-weight: 400;color: #333333;opacity: 1;}
#contents.main .storyArea div.innerWrap > ul li > ul.info li div.header > h3,
#contents.main .storyArea div.innerWrap > ul li > ul.info li div.header > img{transition: .3s;}
#contents.main .storyArea div.innerWrap > ul li > ul.info li div.header > img{margin-bottom: 7px;}
#contents.main .storyArea div.innerWrap > ul li > ul.info li:hover div.header > img{margin-top: 15px;}
#contents.main .storyArea div.innerWrap > ul li > ul.info li:hover div.header > h3{margin-top: -15px;opacity: 0;}

#contents.main .storyArea div.innerWrap > ul li > ul.link li{display: flex;flex-direction: column;justify-content: center;align-items: center;width: 100%;}
#contents.main .storyArea div.innerWrap > ul li > ul.link li > a{width: 100%;height: 50px;text-align: center;border-left: solid 1px #bbbbbb;overflow: visible;}
#contents.main .storyArea div.innerWrap > ul li > ul.link li > a > img,
#contents.main .storyArea div.innerWrap > ul li > ul.link li > a > h3{transition: .3s;}
#contents.main .storyArea div.innerWrap > ul li > ul.link li > a > img{margin-top: -15px;}
#contents.main .storyArea div.innerWrap > ul li > ul.link li > a > h3{font-size: 20px;color: #333333;font-weight: 500;opacity: 1;}
#contents.main .storyArea div.innerWrap > ul li > ul.link li > a:hover > img{margin-top: 0px;}
#contents.main .storyArea div.innerWrap > ul li > ul.link li > a:hover > h3{margin-top: -15px;opacity: 0;}


/* 

    CommunicationhArea Area 

*/
#contents.main section.communicationhArea{background-color: #e9eef1;padding-top:80px;padding-bottom: 80px;}
#contents.main section.communicationhArea h2 {font-size:44px;color:#333;text-align:center;letter-spacing: 0.5px;}
#contents.main section.communicationhArea .w1210 > p {font-size:20px;color:#333;text-align:center; font-weight:400;letter-spacing: 0.5px;}
#contents.main section.communicationhArea .w1210 > p span {color:#f2575e}
#contents.main section.communicationhArea div.innerWrap{
    flex-direction: column;
}
#contents.main .communicationhArea div.innerWrap > ul{
    width:1210px;
    height:403px;
    font-size:0px;
    margin-bottom:50px;
}
#contents.main .communicationhArea .columnTitle {display:inline-block;float:left;margin-right:10px}
#contents.main .communicationhArea div.innerWrap > ul >li{
    position: relative;
    width:/*390px;*/295px;
    height:inherit;
    display: inline-block;
    font-size:11px;
    background-color: #4169e1;
    overflow: hidden;
    margin:0 5px
}
#contents.main .communicationhArea div.innerWrap > ul >li:last-child {margin-right:0}
#contents.main .communicationhArea div.innerWrap ul.type2{
    height:80px;
    /*float:right;*/
    width:905px;
    margin-bottom:50px
}
#contents.main .communicationhArea div.innerWrap ul.type2 >li{
    position: relative;
    width:295px !important;
    height:inherit;
    display: inline-block;
    font-size:11px;
    background-color: #4169e1;
    overflow: hidden;
    margin:0 10px 0 0;
    float:left
}
/*#contents.main .communicationhArea div.innerWrap ul.type2 >li:nth-of-type(3) {margin-right:0}*/
/*#contents.main .communicationhArea div.innerWrap > ul.type2 >li:nth-child(2){
    margin: 0 20px;
}*/

#contents.main .communicationhArea div.innerWrap > ul.type3{
    height:370px;
}

#contents.main .communicationhArea div.innerWrap > ul.type3 >li{
    width:595px;
    background-color:  rgba(255, 255, 255, 0);
    overflow: visible;
    margin-left:0
}
#contents.main .communicationhArea div.innerWrap > ul.type3 > li:first-child{
    margin-right:20px;
}

/* type 1 text inner */
/* 
    text cover top을 줄여서 재사용 하면 되지만... 내부 내용이 바뀔 수 있기에 분리.

*/
#contents.main .communicationhArea div.innerWrap ul.type1 >li div.innerText{
    position: absolute;
    top: 0;
    left: 0;
    z-index:2;
    background-color: white;
    padding: 0 30px;
}
#contents.main .communicationhArea div.innerWrap ul.type1 >li div.innerText > h3 > img{
    position: absolute;
    top: 15px;
    left: 0px;
}
#contents.main .communicationhArea div.innerWrap ul.type1 >li div.innerText > h3{
    font-size: 27px;
    padding-left: 40px;
}
#contents.main .communicationhArea div.innerWrap ul.type1 >li div.innerText > h4{
    font-size: 17px;
}
#contents.main .communicationhArea div.innerWrap ul.type1 >li div.innerText > h3,
#contents.main .communicationhArea div.innerWrap ul.type1 >li div.innerText > h4{
    position: relative;
    font-weight: initial;
    padding-top: 7px;
    padding-bottom: 0px;
}

/* type 1 text cover */
#contents.main .communicationhArea div.innerWrap ul.type1 >li div.cover{
    position: absolute;
    top: 0;
    left: 0;
    z-index:2;
    width: 390px;
    height: 403px;
    background-color: white;
    transition:all 1s;
}
#contents.main .communicationhArea div.innerWrap ul.type1 >li div.cover > img{
    width:inherit;
    height: 306px;
}
#contents.main .communicationhArea div.innerWrap ul.type1 >li div.cover > div.coverText{
    position: absolute;
    bottom: 0;
    left: 0;
    width:inherit;
    height: 97px;
    padding: 0 30px;
}
#contents.main .communicationhArea div.innerWrap ul.type1 >li div.cover > .coverText > h3{
    font-size: 27px;
    padding-left: 40px;
}
#contents.main .communicationhArea div.innerWrap ul.type1 >li div.cover > .coverText > h3 > img{
    position: absolute;
    top: 15px;
    left: 0px;
}
#contents.main .communicationhArea div.innerWrap ul.type1 >li div.cover > .coverText > h4{
    font-size: 17px;
}
#contents.main .communicationhArea div.innerWrap ul.type1 >li div.cover > .coverText > h3,
#contents.main .communicationhArea div.innerWrap ul.type1 >li div.cover > .coverText > h4{
    position: relative;
    font-weight: initial;
    padding-top: 7px;
    padding-bottom: 0px;
}
/* img inner and cover */
#contents.main .communicationhArea div.innerWrap ul.type1 >li img.header, 
#contents.main .communicationhArea div.innerWrap ul.type1 >li img.cover{
    position: absolute;
    top: 0;
    left: 0;
    z-index:2;
    transition:all 0.5s;
}
/* text cover */
#contents.main .communicationhArea div.innerWrap ul.type1 >li:hover div.cover{
    top:-403px;
}
/* img cover */
#contents.main .communicationhArea div.innerWrap ul.type1 >li:hover img.cover{
    top:-403px;
}
#contents.main .communicationhArea div.innerWrap ul.type1 > li:nth-child(2){
    margin:0 20px;
}

/* type 2 */
#contents.main .communicationhArea div.innerWrap ul.type2 li > img{
    position: absolute;
    top:0;
    left:0;
    width: 80px;
    height: 80px;
}
#contents.main .communicationhArea div.innerWrap ul.type2 li{
    font-size: 18px;
    border: solid #4169e1 1px;
    background-color: white;

}
#contents.main .communicationhArea div.innerWrap ul.type2 li a{
    display: inline-block;
    width:100%;
    height: inherit;
    padding-top: 12px;
    padding-left: 20px;
}
#contents.main .communicationhArea div.innerWrap ul.type2 li a span {display:block;color:#4169e1;font-size:14px;margin-bottom:5px}
#contents.main .communicationhArea div.innerWrap ul.type2 li a > span.more{
    display: block;
    position: absolute;
    width: 25px;
    height: 25px;
    line-height: 0;
    font-size:25px;
    border: 1px solid #333333;
    padding-left: 8px;
    transition: .5s;
}
#contents.main .communicationhArea div.innerWrap .columnWrap {margin:50px 0}
#contents.main .communicationhArea div.innerWrap .columnTitle {position:relative;width:295px}
#contents.main .communicationhArea div.innerWrap .columnTitle a {display:block}
#contents.main .communicationhArea div.innerWrap .columnWrap .bx-wrapper {width:905px;float:right}
#contents.main .communicationhArea div.innerWrap .columnWrap .column_new {position:absolute;top:5px;right:5px;background:url('../../skin/latest/basic_indexCommunicationType2/img/new.gif') no-repeat center center;width:34px;height:30px;}

/* type 3 */
#contents.main .communicationhArea div.innerWrap > ul.type3 li > div.header{
    width: 595px;
    height: 280px;
    text-align: center;
    color: white;
    background: url('../../img/main/communicationhAreaBg1.jpg') center 100% no-repeat;
    padding-top: 30px;
    box-shadow: 5px 5px 5px -3px gray;
    z-index: 10;
}
#contents.main .communicationhArea div.innerWrap > ul.type3 li:nth-child(2) > div.header{
    background: url('../../img/main/communicationhAreaBg2.jpg') center 100% no-repeat;
}
#contents.main .communicationhArea div.innerWrap > ul.type3 li > div.header h3{
    font-size: 27px;
}
#contents.main .communicationhArea div.innerWrap > ul.type3 li > div.header h4{
    font-size: 18px;font-weight:300
}
#contents.main .communicationhArea div.innerWrap > ul.type3 li > div.cover{
    position: absolute;
    top: 120px;
    left: 30px;
    width: 535px;
    height: 250px;
    background-color: white;
    box-shadow: 5px 5px 5px -3px gray;
    z-index: 20;
}

/* Etc... Area */

#contents.main section.etcArea{
    background-color: #f4f4f4;
    background: url('../../img/main/etcAreaBg.jpg') center no-repeat;
    background-size: cover;
    padding-top:70px;
    padding-bottom: 80px;
}
#contents.main section.etcArea div.innerHeader-1, 
#contents.main section.etcArea div.innerHeader-2{
    width: 585px;
    display: inline-block;
}
#contents.main section.etcArea .innerHeader-1 > h3, 
#contents.main section.etcArea .innerHeader-2 > h3{
    color:white;
}
#contents.main section.etcArea div.innerWrap{
    flex-direction: column;
}
#contents.main .etcArea div.innerWrap > ul{
    width:1210px;
    height:285px;
    font-size:0px;
    margin-bottom: 20px;
}
#contents.main .etcArea div.innerWrap > ul >li{
    width:585px;
    height:inherit;
    display: inline-block;
    font-size:11px;
    overflow: hidden;
}
#contents.main .etcArea div.innerWrap > ul > li:first-child{
    margin-right:20px;
}



/*커뮤니티 탭메뉴*/
.cmTap {}
.cmTap > div {float:left}
.cmTap .cmLeftBtn {width:220px;}
.cmTap .cmLeftBtn a {position:relative;display:block;width:100%;background-color:#fff;box-sizing:border-box;padding:30px 25px;height:130px;cursor:pointer;border-bottom:1px solid #999999}
.cmTap .cmLeftBtn a.cmLeftBtn1 {background:#fff url('../../img/main/cmLeftBtn1.jpg') no-repeat 10px center}
.cmTap .cmLeftBtn a.cmLeftBtn2 {background:#fff url('../../img/main/cmLeftBtn2.jpg') no-repeat 10px center}
.cmTap .cmLeftBtn a.cmLeftBtn3 {background:#fff url('../../img/main/cmLeftBtn3.jpg') no-repeat 10px center;border-bottom:0}

.cmTap .cmLeftBtn .cmLeftBtn1.active, .cmTap .cmLeftBtn .cmLeftBtn1:hover {background:#4169e2 url('../../img/main/cmLeftBtn1_on.jpg') no-repeat 10px center;color:#fff}
.cmTap .cmLeftBtn .cmLeftBtn1.active span, .cmTap .cmLeftBtn .cmLeftBtn1:hover span, .cmTap .cmLeftBtn .cmLeftBtn1.active h3, .cmTap .cmLeftBtn .cmLeftBtn1:hover h3, .cmTap .cmLeftBtn .cmLeftBtn1.active p, .cmTap .cmLeftBtn .cmLeftBtn1:hover p {color:#fff}
.cmTap .cmLeftBtn .cmLeftBtn1.active .cm_arrow, .cmTap .cmLeftBtn .cmLeftBtn1:hover .cm_arrow {color:#4169e1;border-color:#fff;background-color:#fff}

.cmTap .cmLeftBtn .cmLeftBtn2.active, .cmTap .cmLeftBtn .cmLeftBtn2:hover {background:#0ec6ae url('../../img/main/cmLeftBtn2_on.png') no-repeat 10px center;color:#fff}
.cmTap .cmLeftBtn .cmLeftBtn2.active span, .cmTap .cmLeftBtn .cmLeftBtn2:hover span, .cmTap .cmLeftBtn .cmLeftBtn2.active h3, .cmTap .cmLeftBtn .cmLeftBtn2:hover h3, .cmTap .cmLeftBtn .cmLeftBtn2.active p, .cmTap .cmLeftBtn .cmLeftBtn2:hover p {color:#fff}
.cmTap .cmLeftBtn .cmLeftBtn2.active .cm_arrow, .cmTap .cmLeftBtn .cmLeftBtn2:hover .cm_arrow {color:#4169e1;border-color:#fff;background-color:#fff}

.cmTap .cmLeftBtn .cmLeftBtn3.active, .cmTap .cmLeftBtn .cmLeftBtn3:hover {background:#ffea00 url('../../img/main/cmLeftBtn3_on.png') no-repeat 10px center;color:#3c1e1e}
.cmTap .cmLeftBtn .cmLeftBtn3.active span, .cmTap .cmLeftBtn .cmLeftBtn3:hover span, .cmTap .cmLeftBtn .cmLeftBtn3.active h3, .cmTap .cmLeftBtn .cmLeftBtn3:hover h3, .cmTap .cmLeftBtn .cmLeftBtn3.active p, .cmTap .cmLeftBtn .cmLeftBtn3:hover p {color:#3c1e1e}
.cmTap .cmLeftBtn .cmLeftBtn3.active .cm_arrow, .cmTap .cmLeftBtn .cmLeftBtn3:hover .cm_arrow {color:#ffeb00;border-color:#3c1e1e;background-color:#3c1e1e}

.cmTap .cmLeftBtn1 span {display:block;font-size:10px;color:#4169e1;letter-spacing:2px}
.cmTap .cmLeftBtn1 h3 {font-size:27px;color:#4169e1}
.cmTap .cmLeftBtn1 p {font-size:14px;color:#4169e1}
.cmTap .cmLeftBtn1 .cm_arrow {position:absolute;bottom:20px;right:20px;width:20px;height:20px;border:1px solid #4169e1;text-align: center;line-height: 0px;font-size: 20px;padding-left: 5px;}
.cmTap .cmLeftBtn2 span {display:block;font-size:10px;color:#0dc6ae;letter-spacing:2px}
.cmTap .cmLeftBtn2 h3 {font-size:27px;color:#0dc6ae}
.cmTap .cmLeftBtn2 p {font-size:14px;color:#0dc6ae}
.cmTap .cmLeftBtn2 .cm_arrow {position:absolute;bottom:20px;right:20px;width:20px;height:20px;border:1px solid #0dc6ae;text-align: center;line-height: 0px;font-size: 20px;padding-left: 5px;}
.cmTap .cmLeftBtn3 span {display:block;font-size:10px;color:#ffa800;letter-spacing:2px}
.cmTap .cmLeftBtn3 h3 {font-size:27px;color:#ffa800}
.cmTap .cmLeftBtn3 p {font-size:14px;color:#ffa800}
.cmTap .cmLeftBtn3 .cm_arrow {position:absolute;bottom:20px;right:20px;width:20px;height:20px;border:1px solid #ffa800;text-align: center;line-height: 0px;font-size: 20px;padding-left: 5px;}


.cmRightArea > div {display:none;width:990px;height:390px}
.cmRightArea .cmRightInte .slideArea {height:390px}
.cmRightArea .cmRightInte .slideArea #custom_pager {position:relative;float:left;width: 223px;height: 100%;background-color: #4169e1;padding: 70px 40px;}
.cmRightArea .cmRightInte .slideArea #custom_pager > span {display: inline-block;width: 1px;height: 390px; background-color:rgba(255,255,255,0.8); position: absolute;top: 0;left: 45px;}
.cmRightArea .cmRightInte .slideArea #custom_pager a {color:#fff;display:block;font-size: 18px;
margin-bottom: 20px;background:url('../../img/main/pager_before.png') no-repeat center left;padding-left:20px}
.cmRightArea .cmRightInte .slideArea #custom_pager a.active span, .cmRightArea .cmRightInte .slideArea #custom_pager a:hover span {display:inline-block;width:12px;height:18px;background:url('../../img/main/pager_span.png') no-repeat center center;margin-left:10px;vertical-align:top;margin-top:5px}
/*.cmRightArea .cmRightInte .slideArea #custom_pager a::before {width:11px;height:11px;background:url('../../img/main/pager_before.png')}*/
.cmRightArea .cmRightInte .slideArea #custom_pager a.active, .cmRightArea .cmRightInte .slideArea #custom_pager a:hover {color:#ffeb00;background:url('../../img/main/pager_before_on.png') no-repeat center left;}
.cmRightArea .cmRightInte .slideArea .bx-wrapper {position:relative;height:390px;width:766px;float:left}
.cmRightArea .cmRightInte .slideArea .bx-wrapper .bx-viewport {height:390px !important}
.cmRightArea .cmRightInte .slideArea .bx-wrapper .bx-viewport li {width:766px !important}
.cmRightArea .cmRightInte .slideArea .bx-wrapper .bx-controls {position:absolute;bottom:30px;left:50%;transform:translateX(-50%);width: 120px;}
.cmRightArea .cmRightInte .slideArea .bx-prev {background:url('../../img/main/slidePrev.png');width:34px;height:34px;display: inline-block;font-size: 0;float: left;}
.cmRightArea .cmRightInte .slideArea .bx-next {background:url('../../img/main/slideNext.png');width:34px;height:34px;display: inline-block;font-size: 0;float:right}
.cmRightArea .cmRightInte .slideArea .bx-start {background:url('../../img/main/slidePlay.png');width:34px;height:34px;display: inline-block;font-size: 0;}
.cmRightArea .cmRightInte .slideArea .bx-stop {background:url('../../img/main/slideStop.png');width:34px;height:34px;display: inline-block;font-size: 0;vertical-align: top}

.cmRightArea .cmRightInte .slideArea .bx-wrapper .bx-controls .bx-controls-direction {height:34px}
.cmRightArea .cmRightInte .slideArea .bx-wrapper .bx-controls .bx-controls-auto {position: absolute;left: 50%;transform: translateX(-50%);top: 0;}



.cmRightArea .cmRightMap {display:block;position:relative}
.cmRightArea .cmRightMap .root_daum_roughmap {padding:0;border:none}
.cmRightArea .cmRightMap .root_daum_roughmap .wrap_controllers {display:none}
.cmRightArea .cmRightMap .cmRightMap_info {position:absolute;width:304px;height:175px;background-color:rgba(255,255,255,0.87);color:#333;top: 108px;right: 50px;z-index: 999;text-align: center;padding-top: 30px;box-sizing:border-box;box-shadow: 2px 2px 15px #aaa;}
.cmRightArea .cmRightMap .cmRightMap_info img {margin-bottom:5px}
.cmRightArea .cmRightMap .cmRightMap_info p {font-size:20px;font-weight: 500;letter-spacing: -1px;}
.cmRightArea .cmRightMap .cmRightMap_info p span {display:block;font-size:16px;font-weight:400}

.cmRightKakao {background-color:#ffeb00}
.cmRightKakao > div {float:left;height:100%}
.cmRightKakao > div:nth-child(2) img {position:absolute;bottom:0}
.cmRightKakao .cmRightKakao_form {padding:40px 40px 0;width:623px;text-align:center}
.cmRightKakao .cmRightKakao_form h2 {font-size:32px;color:#3c1e1e;letter-spacing: -1px;margin-bottom: 8px;}
.cmRightKakao .cmRightKakao_form h4 {font-size:16px;color:#3c1e1e;font-weight:400;margin-bottom:20px}
.cmRightKakao .cmRightKakao_form .kakaoCounselArea {border-top:1px solid #3c1e1e;padding:30px 0 0}
.cmRightKakao .cmRightKakao_form .kakaoCounselArea ul {margin-bottom:0}
.cmRightKakao .cmRightKakao_form .kakaoCounselArea ul li {width:260px;text-align:left;margin-bottom:10px}
.cmRightKakao .cmRightKakao_form .kakaoCounselArea ul li label {width:45px}
.cmRightKakao .cmRightKakao_form .kakaoCounselArea ul .cmRightKakao_txt {float:right}
.cmRightKakao .cmRightKakao_form .kakaoCounselArea ul .cmRightKakao_txt div {padding-left: 50px;margin-top: 5px;}
.cmRightKakao .cmRightKakao_form .kakaoCounselArea ul .cmRightKakao_txt div label {width:150px}
.cmRightKakao .cmRightKakao_form .kakaoCounselArea ul li .content_textarea {width:200px}
.cmRightKakao .cmRightKakao_form .kakaoCounselArea ul li.kakaoCheckboxWrap {padding-left:50px}
.cmRightKakao .cmRightKakao_form .kakaoCounselArea ul li label[for="kakaoCheckbox"] {width: 150px;padding-left: 5px;}
.cmRightKakao .cmRightKakao_form .kakaoCounselArea .submit_input {background-color:none;background-position:center;height:auto;padding:0}

.cmRightKakao > div:last-child {position:relative;height:100%}
.cmRightKakao > div:last-child img {position:absolute;bottom:0}