@charset "utf-8";

#multipleDiv_eng_304,
#multipleDiv_eng_212 {z-index: 100; background: #fff;}
#multipleDiv_eng_1445 {z-index: 100; background: #fbfbfb;}
#multipleDiv_eng_1417 {z-index: 100;}

/* #multipleContentsDiv_kor_11 {position: fixed;} */
#multipleDiv_kor_11 {height: 0px;}
.edit #multipleContentsDiv_kor_11 {position: relative;}

#menu242_obj18{position: absolute; z-index: 50; top: 37%; left: 8%; width: 100%;}
.visual-text h1{font-family: 'Roboto'; font-weight: 700; font-size: 60px; text-shadow: 2px 2px 3px rgba(0,0,0,0.45); line-height: 1.1; color: #fff;}
.visual-text h1 em {color: #13baec;}
.visual-text .view {display: inline-block; margin: 40px 0 0 0; padding: 15px 58px; border: 1px solid #fff; border-radius: 100px;  font-family: 'Roboto'; font-size: 15px; color: #fff; transition: .4s;}
.visual-text .view:hover {background: #fff; color:#13baec; }
.visual-info{display: none; margin-top: 48px;}
.visual-info::after{content:""; display: table; clear: both;}
.visual-info.end {display: block;}
.visual-playstop{float: left; margin-right: 22px; margin-top: 5px; margin-left: 6px;}
.visual-playstop button{width: 7px; height: 9px; display: none;}
.visual-playstop button.on{display: block;}
.visual-playstop .visual-stop{background: url(../../images/custom/visual-stop.png);}
.visual-playstop .visual-play{background: url(../../images/custom/visual-play.png);}
.visual-page{float: left; font-size: 12px; margin-right: 31px;}
.visual-page span{color: white; display: inline-block;}
.visual-page .slash{margin: 0 5px; color: #bbb8b1;}
.visual-delay{float: left; width: 310px; position: relative; height: 1px; background-color: rgba(255,255,255,.3); margin-top: 8.5px;}
.visual-delay-bar{position: absolute; width: 0; height: 100%; left: 0; top: 0; background-color: white;}
.visual-delay.on .visual-delay-bar{animation: bar 5s 1;}

@keyframes bar{
	0%{width: 0;}
	100%{width: 100%;}
}

@media all and (max-width: 1000px) {
    .visual-text h1 {font-size: 50px;}
}

@media all and (max-width: 768px) {
    .visual-text h1 {font-size: 35px;}
}


#menu242_obj33{position: absolute; right: 3.8%; bottom: -6.5%; z-index: 100;}
.visual-link ul::after{content:"";display: table;clear: both;}
.visual-link li{position: relative; top: 80px; opacity: 0; width: 230px; height: 220px; float: left; margin-right: 20px; transition: all .5s; position: relative;}
.visual-link li:hover{ box-shadow: 4.5px 4.5px 4px rgba(0,0,0,0.45); top: -40px !important; }
.visual-link li.on {top: 0; opacity: 1;}
.visual-link li.bg1 {background: url('../../images/custom/bg-visual-link1.jpg') no-repeat center center}
.visual-link li.bg2 {background: url('../../images/custom/bg-visual-link2.jpg') no-repeat center center}
.visual-link li.bg3 {background: url('../../images/custom/bg-visual-link3.jpg') no-repeat center center}
.visual-link li:last-child{margin-right: 0;}
.visual-link li a{position: relative; display: block; width: 100%; height: 100%;}
.visual-link li a::after {content: ''; position: absolute; right: 10px; bottom: 10px; width: 73px; height: 66px; transform: rotateY(0); transition: .65s;}
.visual-link li:hover a::after {transform: rotateY(360deg);}
.visual-link li.bg1 a::after {background: url('../../images/custom/visual-link-logo_1.png') no-repeat center center}
.visual-link li.bg2 a::after {background: url('../../images/custom/visual-link-logo_3.png') no-repeat center center}
.visual-link li.bg3 a::after {background: url('../../images/custom/visual-link-logo_2.png') no-repeat center center}
.visual-link-logo{width: 71px; margin: 0 auto; padding-top: 30px;}
.visual-link li p{text-align: left; color: white; font-size: 18px; line-height: 27px; font-family:'TitilliumWeb-Regular'; padding: 33px  0 0 39px}

@media all and (max-width: 1400px) {
    .visual-link li {top: 0; opacity: 1; }
    .visual-link li{width: 180px; height: 180px; margin-right: 20px;}
	.visual-link li p{padding: 17px 0 0 20px; font-size: 19px; font-family:'S-CoreDream-3Light'; line-height: 27px;}
}

@media all and (max-width: 1023px) {
    .visual-link-logo{padding-top: 25px; width: 39px;}
	.visual-link li{width: 135px; height: 135px; margin-right: 10px;}
	.visual-link li p{padding: 13px 0 0 16px; font-size: 14px; font-family:'S-CoreDream-3Light'; line-height: 18px;}
    .visual-link li a::after {width: 53px; height: 46px; background-size: 100% !important;}
}

@media all and (max-width: 768px) {
    .visual-link {display: none;}
	.visual-link li{ height: 100px;}
	.visual-link-logo{display: none;}
	.visual-link li a{display: table;}
}

@media all and (max-width: 420px) {
    .visual-link li p {line-height: 22px;}
	.visual-link li{margin-right: 10px;}
}

#multipleContentsDiv_kor_191{background: url(../../images/custom/slider-background.jpg) no-repeat top center; background-attachment: fixed; background-size: cover; width: 100%;}
.main-slider-title{color: white; text-align: center; padding-top: 92px;}
.main-slider-title h1{font-family:'Mont Bold'; font-size: 60px;}
.main-slider-title h1 span{font-family:'Mont Bold';}
.main-slider-title p{font-size: 30px; font-family:'TitilliumWeb-Regular';}

@media all and (max-width: 1500px) {
	.main-slider-title h1 {font-size: 50px;}
	.main-slider-title p {font-size: 25px;}
}

@media all and (max-width: 1023px) {
	.main-slider-title{padding-top: 80px;}
	.main-slider-title h1 {font-size: 35px;}
    .main-slider-title h1 span {opacity: 1;}
	.main-slider-title p {font-size: 20px;}
}

@media all and (max-width: 768px) {
    .main-slider-title {padding-top: 60px;}
	.main-slider-title h1 {font-size: 30px;}
	.main-slider-title p{padding: 0 20px; font-size: 15px;}
}

.img-t {display: none;}

@media all and (max-width: 1023px) {
    .img-p {display: none;}
    .img-t {display: block;}
}

.wrap-why {overflow: hidden; background: url('../../images/main/bg-why.jpg') no-repeat top center; background-size: cover;}
.wrap-why .box {display: table; width: 100%; height: 570px; table-layout: fixed;}
.wrap-why .title,
.wrap-why .list {display: table-cell; vertical-align: middle;}
.wrap-why .title {width: 48.5%; padding: 0 0 0 6%;}
.wrap-why .title strong {display: block; padding: 37px 0 0 0; font-family: 'Mont Bold'; font-size: 60px; color: #000;}
.wrap-why .title p {font-family: 'TitilliumWeb-Regular'; font-size: 19px; color: #666;}
.wrap-why .list > ul {margin: 45px 0 0 0; text-align: center;}
.wrap-why .list > ul li {opacity: 0; float: left; width: 33.333%; padding: 0 2%; text-align: center; transform: translate(50%, 0); transition: .75s;}
.wrap-why .list img {display: inline-block;}
.multipleDiv.on .wrap-why .list li {opacity: 1; transform: translate(0, 0);}
.multipleDiv.on .wrap-why .list li:nth-child(2) {transition-delay: .3s;}
.multipleDiv.on .wrap-why .list li:nth-child(3) {transition-delay: .6s;}
.wrap-why .list .text {margin: 25px 0 0 0; font-family: 'TitilliumWeb-SemiBold'; font-size: 17px; line-height: 1.3; color: #333;}
.wrap-why .control {font-size: 0;}
.wrap-why .control li,
.wrap-why .control button {display: inline-block; width: auto; vertical-align: middle;}
.wrap-why .control button {width: 13px; height: 13px; margin: 0 5px; background: #989898; border-radius: 100%; text-indent: -99999px;}
.wrap-why .control .slick-active button {background: #2e5bb6;}
.wrap-why .control .slick-dots {margin: 40px 0 0 0; text-align: center;}

@media all and (max-width: 1660px) {
    .wrap-why .title strong {font-size: 50px;}
    .wrap-why .list .text {font-size: 13px;}
    .wrap-why .title p {font-size: 16px;}
    .wrap-why .title {width: 40%; padding: 0;}
    .wrap-why .list {padding: 0;}
}

@media all and (max-width: 1200px) {
    .wrap-why {padding: 60px 0;}
    .wrap-why .box,
    .wrap-why .title,
    .wrap-why .list {display: block; width: 100%;}
    .wrap-why .title strong {padding: 0;}
    .wrap-why .box {height: auto;}
}

@media all and (max-width: 768px) {
    .wrap-why .title strong {font-size: 30px;}
    .wrap-why .title p {font-size: 15px;}
    .wrap-why .list .text {font-size: 15px;}
    .wrap-why .list img {width: 43%;}
    .wrap-why .list > ul li {opacity: 1; transform: translate(0, 0);}
}

#multipleContentsDiv_eng_304 {max-width: 1660px; margin: 0 atuo; padding: 165px 0 115px 0;}
#menu242_obj310 {overflow: visible;}

@media all and (max-width: 1660px) {
    #multipleContentsDiv_eng_304 {padding: 165px 20px 115px 20px;}
}

@media all and (max-width: 1270px) {
    #multipleContentsDiv_eng_304 {padding: 135px 20px 85px 20px;}
}

@media all and (max-width: 768px) {
    #multipleContentsDiv_eng_304 {padding: 60px 20px 60px 20px;}
}

#multipleDiv_eng_336 {padding: 150px 0; background: url('../../images/main/bg-photo.jpg') no-repeat center top; background-attachment: fixed; background-size: cover;}

@media all and (max-width: 1500px) {
    #multipleDiv_eng_336 {padding: 100px 0;}
}

@media all and (max-width: 1270px) {
    #multipleDiv_eng_336 {padding: 80px 0;}
}

@media all and (max-width: 768px) {
    #multipleDiv_eng_336 {padding: 60px 0;}
}

/*Video*/
.wrap-visual .video {background: #000;}
.wrap-visual .video video {display: block; height: 118%; margin: 0 auto;}
.wrap-visual::after {z-index: 1;}

@media all and (max-width: 1000px) {
    .wrap-visual .video {display: none;}
    .wrap-visual::after {z-index: 1;}
}

/*Animation*/
@media all and (min-width: 1700px) {
    #multipleDiv_eng_1445 {position: relative; left: auto; right: -10%; transition: all .75s; opacity: 0;}
    #multipleDiv_eng_1445.on,
    #multipleDiv_eng_1445.edit {right: 0; opacity: 1;}
    #multipleDiv_eng_212 {position: relative; left: -10%; transition: all .75s; opacity: 0;}
    #multipleDiv_eng_212.on,
    #multipleDiv_eng_212.edit {left: 0; opacity: 1;}
    /*
    #multipleDiv_eng_1417 {position: relative; top: -10%; transition: all .75s; opacity: 0;}
    #multipleDiv_eng_1417.on,
    #multipleDiv_eng_1417.edit {top: 0; opacity: 1;}
    */
}

.photo-ellipsis {
	position: relative;
	height: 700px;
	overflow: hidden;
}


.photo-ellipsis:before {
	position: absolute;
	bottom: 0;
	left: 0;
	content: "";
	width: 100%;
	height: 60px;
/*	background: rgb(0,0,0);
	background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(229,236,246,1) 80%);
*/
	z-index: 10;
}

/* 2022.07.13 추가작업 */
.photo-ellipsis * {
	font-size: 16px !important;
	text-align: left !important;
	color: #777 !important;
	font-weight: 400 !important;
}
.photo-ellipsis .subject {
	font-size: 19px !important;
	color: #666 !important;
	font-weight: 700 !important
}

@media all and (max-width: 1023px) {
.photo-ellipsis {
	height: auto;
	max-height: 550px;
}