@import url("layout.css");
/*-------------------------------------------------
Author : SY,CHo
Create date : 2020. 03. 04.

YHY : 2011202 A￢A?a€?A￢a€ºA¹AªA·A¼A￢a€?A± A≪Aªa€|A≪A?a€?A≪A’a?￢A≪A¹a€? A￢E†EœA￢A?a€￠
-------------------------------------------------*/

br { font-family:initial; }
/* ========================================== LAYOUT */
#wrap {line-height: 1;}

#header {opacity: 0; background: rgba(255,255,255,0.5); transform: translateY(50px); -webkit-transform: translateY(50px); transition: all 0.5s ease; -webkit-transition: all 0.5s ease;}
#header.fixed {opacity: 1; background: #fff; transform: translateY(0); -webkit-transform: translateY(0);}

/* ========================================== AªA³AμA­a€?Aμ */
.section {position: relative;}
.section:after {clear: both; display: block; width: 100%; content: "";}

.fontTitillium {font-weight: normal;}
.fontTitillium em {font-weight: 300; font-family: 'Titillium Web'; }

/* A≪Aⓒa€?A￢A?A¸ A≪A¹a€?A￢A￡A¼A￢a€“A¼ */
.section1 .container {position: absolute; top: 0; left: 50%; height: 100%; line-height: 1.4; transform: translateX(-50%); -webkit-transform: translateX(-50%);}
#visualList {height: 100vh;}
#visualList li {position: relative; float: left; display: block; height: 100vh; overflow: hidden;}
#visualList li > img { position:relative; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); min-width: 100%; height: 100vh; padding-top:80px; }
#visualList li > img.m_visual { display:none; }
#visualList li .text-box {position: absolute; top: 30%; left: 0; width: 100%;  }

.visualOuter .bx-controls {position: absolute; top: 22%; left: 50%; display: inline-block; margin-left: -700px; line-height: 1; z-index: 1;}
.visualOuter .bx-controls-auto {position: absolute; top: 0; right: 0.7rem;}
.visualOuter .bx-controls-auto .bx-start,
.visualOuter .bx-controls-auto .bx-stop {position: relative; display: inline-block; width: 30px; height: 2rem; color: transparent; overflow: hidden;}
.visualOuter .bx-controls-auto .bx-start:after,
.visualOuter .bx-controls-auto .bx-stop:after {position: absolute; top:0; left:0; width: 100%; line-height: 2rem; text-align: center; font-family: 'xeicon'; font-size: 1rem; color: #fff; content: "\ea3e";}
.visualOuter .bx-controls-auto .bx-stop:after {content: "\ea3b";}

.visualOuter .bx-pager { position:absolute; top:0.5rem; left:3rem; color:#fff; }

.visualOuter .bx-controls-direction { position:relative; width:9rem; height:2rem; border-radius:2rem; background:rgba(0,0,0,0.8); }
.visualOuter .bx-controls-direction a { position:absolute; top:0; width:1rem; line-height:2rem; color:transparent; overflow:hidden; }
.visualOuter .bx-controls-direction a:before { position:absolute; top:0; left:0; width:1rem; font-size:1rem; font-family:'xeicon'; color:#fff;  }
.visualOuter .bx-controls-direction a.bx-prev { left:1rem; }
.visualOuter .bx-controls-direction a.bx-next { left:5.5rem; }
.visualOuter .bx-controls-direction a.bx-prev:before { content: "\e93d"; }
.visualOuter .bx-controls-direction a.bx-next:before { content: "\e940"; }

.conceptWhite .visualOuter .bx-controls-auto .bx-start:after,
.conceptWhite .visualOuter .bx-controls-auto .bx-stop:after,
.conceptWhite .visualOuter .bx-pager .bx-pager-item .bx-pager-link,
.conceptWhite .visualOuter .bx-pager .bx-pager-item + .bx-pager-item .bx-pager-link:before {color: #fff;}
.conceptWhite .visualOuter .bx-pager .bx-pager-item .bx-pager-link.active {color: #fff; border-color: #fff;}
.conceptWhite .sideNav #fullpageMenu::before {background: rgba(255,255,255,0.5);}
.conceptWhite .sideNav #fullpageMenu li::before {background: #fff;}
.conceptWhite .sideNav #fullpageMenu li a {color: #111;}

.section1 .logo60 { display:none }/*210105*/
.section1 .scrollDown {position: absolute; bottom: 3%; left: 50%; padding-bottom: 1.5rem; transform: translateX(-50%); -webkit-transform: translateX(-50%);}
.section1 .scrollDown span {display: block; margin-bottom: 0.5rem; padding-top: 2rem; line-height: 1rem; font-size: 0.65rem; color: #fff; text-shadow: 2px 2px 4px rgba(0,0,0); background: url(/images/web/cu/main/icon01.png) no-repeat center top;} /*211028 A￢A?a€?AªA·A¼A￢a€?A±A￢E†EœA￢A?a€￠*/
.section1 .scrollDown .xi-angle-down-thin {position: absolute; left: 50%; bottom: 0.35rem; margin-left: -10px; font-size: 20px; color: #fff; -webkit-animation: scroll 1s infinite linear; animation: scroll 1s infinite linear;}
.section1 .scrollDown .xi-angle-down-thin + .xi-angle-down-thin {bottom: 0;}

.section1 .container.animationPigOuter {top: auto; bottom: 0; height: 50%;}
.animationPig {position: absolute; bottom: 0; left: -200%; min-width: 600px; transition: all 0.75s ease; -webkit-transition: all 0.75s ease;}
.animationPig::before {position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: #b0f2fe; content: "";}
.animationPig::after {position: absolute; top: 0; right: 0; width: 200%; height: 100%; background: url(/images/web/cu/main/bgPig.png) no-repeat right bottom; content: "";}
.animationPig a {position: relative; display: block; padding: 2rem 0; font-size: 0.7rem; color: #06204b; z-index: 1;}
.animationPig a strong {font-size: 1.2rem; opacity: 0; visibility: hidden; transition: all 0.25s ease; -webkit-transition: all 0.25s ease;}
.animationPig a p {margin: 0.5rem 0 1.5rem; color: #9a9a9a; opacity: 0; visibility: hidden; transition: all 0.25s ease; -webkit-transition: all 0.25s ease;}
.animationPig a .go {font-size: 0.65rem; opacity: 0; visibility: hidden; transition: all 0.25s ease; -webkit-transition: all 0.25s ease;}
.animationPig .shadow {position: absolute; width: 50px; height: 10px; border-radius: 50%; background: rgba(0,0,0,0.1); opacity: 0; visibility: hidden; transition: all 0.25s ease; -webkit-transition: all 0.25s ease;}
.animationPig .shadow01 {bottom: 40px; right: 275px;}
.animationPig .shadow02 {bottom: 10px; right: 225px;}
.animationPig .shadow03 {bottom: 25px; right: 120px;}
.animationPig .pig {position: absolute; opacity: 1;} /*231027 opacity 변경*/
.animationPig .pig01 {bottom: 60px; right: 275px;}
.animationPig .pig02 {bottom: 30px; right: 205px;}
.animationPig .pig03 {bottom: 45px; right: 50px;}

/* fullpage active */
.animationPig.active {left: 0;}
.animationPig.active a strong {opacity: 1; font-weight:600; visibility: visible; transition-delay: 0.75s; -webkit-transition-delay: 0.75s;}
.animationPig.active a p {color: #111;opacity: 1;visibility: visible;transition-delay: 0.85s;-webkit-transition-delay: 0.85s;}
.animationPig.active a .go {opacity: 1; visibility: visible; transition-delay: 1s; -webkit-transition-delay: 1s;}
/* .animationPig.active .shadow {opacity: 1; visibility: visible; transition-delay: 1s; -webkit-transition-delay: 1s; animation: circle 1s ease 1s infinite; -webkit-animation: circle 1s ease 1s infinite;}
.animationPig.active .pig01 {animation: bounceUp3 1.5s ease infinite; -webkit-animation: bounceUp3 1.5s ease infinite; animation-delay: 3s; -webkit-animation-delay: 2s;}
.animationPig.active .pig02 {animation: bounceUp2 1.5s ease infinite; -webkit-animation: bounceUp2 1.5s ease infinite; animation-delay: 2.25s; -webkit-animation-delay: 2.25s;}
.animationPig.active .pig03 {animation: bounceUp1 1.5s ease infinite; -webkit-animation: bounceUp1 1.5s ease infinite; animation-delay: 2s; -webkit-animation-delay: 2.5s;} *//*231027 애니메이션 삭제*/

@-webkit-keyframes scroll{
	0% {transform: translateY(-10px); -webkit-transform: translateY(-10px);}
	100% {transform: translateY(10px); -webkit-transform: translateY(10px);}
}
@keyframes scroll{
	0% {transform: translateY(-10px); -webkit-transform: translateY(-10px);}
	100% {transform: translateY(10px); -webkit-transform: translateY(10px);}
}

@keyframes circle {
	100% {transform: scale(1.2); opacity: 0;}
}
@-webkit-keyframes circle {
	100% {transform: scale(1.2); opacity: 0;}
}

@keyframes bounceUp1 {
	0% {opacity: 1; transform: translateY(0);}
	25% {opacity: 1; transform: translateY(-80px);}
	50% {opacity: 1; transform: translateY(20px);}
	100% {opacity: 1; transform: translateY(0);}
}
@-webkit-keyframes bounceUp1 {
	0% {opacity: 1; transform: translateY(0);}
	25% {opacity: 1; transform: translateY(-80px);}
	50% {opacity: 1; transform: translateY(20px);}
	100% {opacity: 1; transform: translateY(0);}
}

@keyframes bounceUp2 {
	0% {opacity: 1; transform: translateY(0);}
	25% {opacity: 1; transform: translateY(-50px);}
	50% {opacity: 1; transform: translateY(10px);}
	100% {opacity: 1; transform: translateY(0);}
}
@-webkit-keyframes bounceUp2 {
	0% {opacity: 1; transform: translateY(0);}
	25% {opacity: 1; transform: translateY(-50px);}
	50% {opacity: 1; transform: translateY(10px);}
	100% {opacity: 1; transform: translateY(0);}
}
@keyframes bounceUp3 {
	0% {opacity: 1; transform: translateY(10px);}
	30% {opacity: 1; transform: translateY(-5px);}
	40% {opacity: 1; transform: translateY(10px);}
	80% {opacity: 1; transform: translateY(-5px);}
	100% {opacity: 1; transform: translateY(10px);}
}
@-webkit-keyframes bounceUp3 {
	0% {opacity: 1; transform: translateY(10px);}
	30% {opacity: 1; transform: translateY(-5px);}
	40% {opacity: 1; transform: translateY(10px);}
	80% {opacity: 1; transform: translateY(-5px);}
	100% {opacity: 1; transform: translateY(10px);}
}

/* NEWS */
.section2 {overflow: hidden;}
.section2 .container {position: relative; padding: 5.5rem 0; background: #fff;}
.section2 .container:before {position: absolute; top: -200%; right: 410px; width: 1px; height: 0; background: #dadbdd; content: ""; transition: all 2s ease; -webkit-transition: all 2s ease;}
.section2 .container:after {position: absolute; top: 50%; right: calc(410px - 7px); width: 14px; height: 47px; background: url(/images/web/cu/main/icon21.png) no-repeat left top; content: ""; opacity: 0; visibility: hidden; transition: all 0.5s ease; -webkit-transition: all 0.5s ease;}
.section2 .boxDiv {position: relative; float: left; width: 445px; opacity: 0; visibility: hidden; transform: translateY(200px); -webkit-transform: translateY(200px); transition: all 0.5s ease; -webkit-transition: all 0.5s ease;}
.section2 .boxDiv.box2 {margin-left: 50px;}
.section2 .boxDiv.box3 {margin-left: 100px; width: 360px;}
.section2 .boxDiv.box3 .boxDiv {width: 360px;}
.section2 .boxDiv.box5 {margin-top: 1.75rem;}
.section2 h2 {margin-bottom: 1.5rem; padding-bottom: 1rem; height: 2.75rem; font-size: 1.2rem; color: #000; border-bottom: 3px solid #000; font-weight:600; }
.section2 .boxDiv.box1 h2 {font-size: 1.5rem;}
.section2 .btnPlus {position: absolute; top: 0; right: 0; font-size: 1.8rem; color: #222;}
/*201217 focus A?Æ’A?A­A?a€|A?A¡A?a€?A?A¨A?Æ’A?AªA?a€?A?A³A?a€?A?A¼ A?Æ’A?A￢A?a€?A?A¶A?A￠A￠a€?A￢A?A?A?Æ’A?AªA?a€?A?A°A?A￠A￠a?￢A¡A?A￢*/
.section2 .btnPlus:hover i,
.section2 .btnPlus:focus i {-webkit-transform: rotate(180deg); transform: rotate(180deg); -webkit-transition: 0.25s ease; transition: 0.25s ease;}


/* fullpage active */
.fp-viewing-2rdPage .section2 .boxDiv {opacity: 1; visibility: visible; transform: translateY(0); -webkit-transform: translateY(0);}
.fp-viewing-2rdPage .section2 .boxDiv.box1 {transition-delay: 0.25s; -webkit-transition-delay: 0.25s;}
.fp-viewing-2rdPage .section2 .boxDiv.box2 {transition-delay: 0.5s; -webkit-transition-delay: 0.5s;}
.fp-viewing-2rdPage .section2 .boxDiv.box3 {transition-delay: 0.75s; -webkit-transition-delay: 0.75s;}
.fp-viewing-2rdPage .section2 .container:before {height: 1000%; transition-delay: 1s; -webkit-transition-delay: 1s;}
.fp-viewing-2rdPage .section2 .container:after {opacity: 1; visibility: visible; -webkit-transform: rotate(360deg); transform: rotate(360deg); transition-delay: 1.25s; -webkit-transition-delay: 1.25s;}

.info .title {display: block; margin-bottom: 1rem; width: 100%; height: 1rem; line-height: 1rem; font-size: 0.9rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.info span {font-family: 'Titillium Web', sans-serif;font-size: 0.75rem;color: #666;}
.info span i {margin-right: 0.25rem;}

.listType01 li + li {margin-top: 1rem;}
.listType01 li a {position: relative; display: block; width: 100%; line-height: 20px; overflow: hidden;}
.listType01 li a:after {position: absolute; bottom: 0; left: 0; width: 100%; height: 4.5rem; background-color: rgba(0, 0, 0, 0.6); content: ""; -webkit-transition: 0.5s ease; transition: 0.5s ease;}
.listType01 li a .picture {width: 100%; height: 310px; overflow: hidden;}
.listType01 li a .picture img {width: 100%; height: auto; transform: scale(1); -webkit-transform: scale(1); -webkit-transition: 0.35s ease; transition: 0.35s ease;}/*A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A¡A?a€?A?A?A?Æ’A?A￠A?A￠A￠a?￢A¡A?A￢A?a€?A?A￠A?Æ’A†a€™A?a€?A?A­A?Æ’A?A￠A?A￠A￠a?￢A¡A?A￢A?a€?A?A￠A?Æ’A￠a?￢A¡A?a€?A?A´A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A¡A?a€?A?A§A?Æ’A?A￠A?A￠A￠a?￢A¡A?A￢A?a€|A?A¾ A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A¡A?a€?A?A?A?Æ’A￠a?￢A¡A?a€?A?A¼A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A¡A?a€?A?A?A?Æ’A?A￠A?A￠A￠a?￢A¡A?A￢A?a€?A?A￠A?Æ’A†a€™A?a€?A?A­A?Æ’A?A￠A?A￠A￠a?￢A¡A?A￢A?a€?A?A￠A?Æ’A￠a?￢A|A?A￠A￠a€?A￢A…a€œ A?Æ’A†a€™A?a€?A?AªA?Æ’A￠a?￢A¡A?a€?A?A·A?Æ’A￠a?￢A|A?A￠A￠a€?A￢A…a€œA?Æ’A†a€™A?a€?A?AªA?Æ’A￠a?￢A¡A?a€?A?A²A?Æ’A￠a?￢A¡A?a€?A?AⓒA?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A|A?A￠A￠a€?A￢A…a€œA?Æ’A￠a?￢A¡A?a€?A?A¼A?Æ’A†a€™A?a€?A?A≪A?Æ’A￠a?￢A¡A?a€?A?A¡A?Æ’A￠a?￢A|A?A￠A￠a€?A￢A…a€œ A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A¡A?a€?A?A?A?Æ’A￠a?￢A¡A?a€?A?A¸A?Æ’A†a€™A?a€?A?A≪A?Æ’A?A￠A?A￠A￠a?￢A¡A?A￢A?a€|A?A¾A?Æ’A￠a?￢A¡A?a€?A?A¤A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A¡A?a€?A?A?A?Æ’A￠a?￢A¡A?a€?A?A¼ A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A¡A?a€?A?A?A?Æ’A￠a?￢A¡A?a€?A?A´A?Æ’A†a€™A?a€?A?A≪A?Æ’A￠a?￢A¡A?a€?A?A?A?Æ’A￠a?￢A¡A?a€?A?A¸A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A¡A?a€?A?A§A?Æ’A?A￠A?A￠A￠a€?A￢A…A¡A?a€?A?A￢A?Æ’A†a€™A?a€?A?AªA?Æ’A￠a?￢A¡A?a€?A?A°A?Æ’A?A￠A?A￠A￠a€?A￢A…A¡A?a€?A?A￢ A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A¡A?a€?A?A?A?Æ’A?A￠A?A￠A￠a€?A￢A…A¡A?a€?A?A￢A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A|A?a€?A?A¾A?Æ’A￠a?￢A¡A?a€?A?A￥A?Æ’A†a€™A?a€?A?A≪A?Æ’A￠a?￢A¡A?a€?A?A?A?Æ’A￠a?￢A¹A?a€|A￠a?￢A“A?Æ’A†a€™A?a€?A?A≪A?Æ’A￠a?￢A|A?a€?A?A?A?Æ’A?A￠A?A￠A￠a?￢A¡A?A￢A?a€?A?A?A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A¡A?a€?A?A§A?Æ’A?A￠A?A￠A￠a€?A￢A…A¡A?a€?A?A￢ A?Æ’A†a€™A?a€?A?A­A?Æ’A?A￠A?A￠A￠a€?A￢A…A¾A?a€?A?A￠A?Æ’A?A￠A?A￠A￠a?￢A¡A?A￢A?a€?A?A￠A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A¡A?a€?A?A?A?Æ’A￠a?￢A¡A?a€?A?A¸ A?Æ’A†a€™A?a€?A?A­A?Æ’A?A￠A?A￠A￠a?￢A¡A?A￢A?a€?A?A￠A?Æ’A?A￠A?A￠A￠a?￢A¡A?A￢A?a€|A?A¾A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A|A?a€?A?A¡A?Æ’A?A￠A?A￠A￠a?￢A¡A?A￢A?a€?A?A?*/
.listType01 li a .info {position: absolute; bottom: 0; left: 0; width: 100%; padding: 1rem 2rem; height: 4.5rem; transform: translateY(0); -webkit-transform: translateY(0); -webkit-transition: 0.5s ease; transition: 0.5s ease; z-index: 1;}
.listType01 li a .info .title {display: block; margin-bottom: 0.5rem; width: 100%; height: 1rem; line-height: 1rem; font-size: 0.9rem; color: #fff; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.listType01 li a .info span {font-family: 'Titillium Web', sans-serif;font-size: 0.75rem;color: #fff;}
.listType01 li a .info span i {margin-right: 0.25rem;}
/*201217 focus A?A­A…A¡A?A¨A?AªA?A³A?A¼ A?A￢A?A¶A￠a?￢A?A?AªA?A°A￠a€?A￢*/
.listType01 li a:focus{outline-offset: -1px; }/*250902 웹접근성 수정*/
.listType01 li a:hover:after,
.listType01 li a:focus:after {height: 100%;}
.listType01 li a:hover .picture img,
.listType01 li a:focus .picture img {transform: scale(1.1); -webkit-transform: scale(1.1);}
.listType01 li a:hover .info,
.listType01 li a:focus .info {bottom: 50%; transform: translateY(50%); -webkit-transform: translateY(50%);}

.pagerShort {position: absolute; bottom: 0;left: 50%; margin-left: -40px; padding-top: 0.5rem; width: 80px; height: 50px; text-align: right; font-family: 'Titillium Web', sans-serif; font-size: 1.5rem; font-weight: 700; color: #000;}
.pagerShort .total {font-size: 1rem; color: rgba(0,0,0,0.5);}

.section2 .boxDiv.box1 h2 {position: relative; border-bottom-color: #01afd4;}
.section2 .boxDiv.box1 h2:before {position: absolute; bottom: -3px; left: 0; width: 30%; height: 3px; background: #d7a100; content: "";}
.section2 .boxDiv.box1 h2:after {position: absolute; bottom: -3px; left: 30%; width: 15%; height: 3px; background: #0b56a7; content: "";}

/*.section2 .listType01 {overflow: hidden;}*/ /*221027 i?‘e·¼i?± eŒ€i?‘ i?­i?œ*/
.section2 .listType01 a:focus {outline-offset:2px;} /*221027 i?‘e·¼i?± eŒ€i?‘ i¶”e°€*/

.listType02 li + li {margin-top: 1rem; padding-top: 1rem; border-top: 1px dashed #b2b2b2;}
.listType02 li a .info .title {color: #000;}
/*201217 focus, hover A?A­A…A¡A?A¨A?AªA?A³A?A¼ A?A￢A?A¶A￠a?￢A?A?AªA?A°A￠a€?A￢*/
.listType02 li a:hover .info .title,
.listType02 li a:focus .info .title { color:#0b56a7; }

.section2 .listType03 li { height:560px; overflow:hidden; text-align:center; }
.section2 .listType03 a {display: block; width: 100%;}
.section2 .listType03 img {max-width: 100%;}
.section2 .boxDiv.box2 .bx-controls {position: relative; margin-top: 20px; width: 100%; height: 60px; line-height: 60px;}
.section2 .boxDiv.box2 .bx-controls:before {position: absolute; top: 0; right: 0; width: 185px; height: 60px; -webkit-clip-path: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%); clip-path: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%); content: "";
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e5b914+0,f4c263+100 */
background: rgb(229,185,20); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(229,185,20,1) 0%, rgba(244,194,99,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(229,185,20,1) 0%,rgba(244,194,99,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(229,185,20,1) 0%,rgba(244,194,99,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5b914', endColorstr='#f4c263',GradientType=1 ); /* IE6-9 */
}
.section2 .boxDiv.box2 .bx-controls a {position: absolute; top: 0; display: inline-block; width: 50px; color: transparent; overflow: hidden;}
.section2 .boxDiv.box2 .bx-prev {right: 100px;}
.section2 .boxDiv.box2 .bx-next {right: 0;}
.section2 .boxDiv.box2 .bx-controls a.bx-start,
.section2 .boxDiv.box2 .bx-controls a.bx-stop {right: 50px; display: block;}
.section2 .boxDiv.box2 .bx-controls a.bx-start.active,
.section2 .boxDiv.box2 .bx-controls a.bx-stop.active {display: none;}
.section2 .boxDiv.box2 .bx-controls a:after {position: absolute; top: 0; left: 0; width: 100%; text-align: center; font-family: 'xeicon'; font-size: 1.25rem; color: #000;}
.section2 .boxDiv.box2 .bx-prev:after {content: "\e908";}
.section2 .boxDiv.box2 .bx-next:after {content: "\e90b";}
.section2 .boxDiv.box2 .bx-start:after {content: "\ea3e";}
.section2 .boxDiv.box2 .bx-stop:after {content: "\ea3b";}
.section2 .boxDiv.box2 .pagerShort {left: auto; right: 185px; margin-left: 0; padding-top: 0; width: 100px; height: 60px; line-height: 60px; text-align: center; font-size: 1.35rem;}

/* CU A­a€?a€?A≪A¡A“A￢A?A?A­A?A¸ */
.section3 {background: #f8f8f8;}
.section3 h2 {margin-bottom: 3.75rem; font-size: 1.9rem; font-weight:600;}
#project {position: relative; padding-bottom: 5.5rem;}
#project .bx-controls {position: absolute; bottom: 0; left: 50%; display: inline-block; margin-left: -190px; width: 380px; height: 60px;}
#project .bx-controls a {position: relative; display: inline-block; width: 70px; height: 60px; line-height: 60px; border: none; color: transparent; background: #c6c6c6; overflow: hidden;
clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
-webkit-clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
-o-clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
-ms-clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
}
/*211028 A￢A?a€?AªA·A¼A￢a€?A± A￢A?a€￠A￢A§a?￢A≪A²a€?A­A?A¼ A￢A¶a€?AªA°a?￢*/
#project .bx-controls-auto{position: absolute; top: -20px; left:50%;}
#project .bx-controls-auto a{background: transparent;}
#project .bx-controls-auto a.bx-start,
#project .bx-controls-auto a.bx-stop {position:relative;display: inline-block;width: 30px;height: 30px;color: transparent;/* overflow: hidden; */clip-path: none;} /*220203 A￢A?a€?AªA·A¼A￢a€?A± A￢E†EœA￢A?a€￠*/
#project .bx-controls-auto a.bx-start:after,
#project .bx-controls-auto a.bx-stop:after{position: absolute; top: 0; left: 0; width: 100%; line-height: 30px; text-align: center; font-family: 'xeicon'; font-size: 1rem; color: #000;}
#project .bx-controls-auto a.bx-start:after{content: "\ea3e";}
#project .bx-controls-auto a.bx-stop:after {content: "\ea3b";}
/*//211028 A￢A?a€?AªA·A¼A￢a€?A± A￢A?a€￠A￢A§a?￢A≪A²a€?A­A?A¼ A￢A¶a€?AªA°a?￢*/
#project .bx-controls a:hover,
#project .bx-controls a:focus { background:#777; } /* 201217 A?Æ’A?A￢A?a€?A?A¶A?A￠A￠a€?A￢A?A?A?Æ’A?AªA?a€?A?A°A?A￠A￠a?￢A¡A?A￢ */
#project .bx-controls-auto a:hover,
#project .bx-controls-auto a:focus{background: transparent;} /*211028 A?A￢A?A¶A￠a?￢A?A?AªA?A°A￠a€?A￢*/
#project .bx-controls a.bx-next {float: right;}
#project .bx-controls a:after {position: absolute;top: 0;left: 0;width: 100%;text-align: center;font-family: 'xeicon';font-size: 1.25rem;color: #111;font-weight: 600;}
#project .bx-prev:after {content: "\e93d";}
#project .bx-next:after {content: "\e940";}
#project .bx-prev:focus, #project .bx-next:focus{outline-offset:-12px;} /*221227 접근성 대응 추가*/

#projectList li a {display: block;} /*220211 ie A￢A?a€?AªA·A¼A￢a€?A± AªA´a?￢A≪A?A¨ A￢E†EœA￢A?a€￠*/
#projectList li span {position: relative; display: block; width: 100%; text-align: right;}
#projectList li img {opacity: 0; transform: translateX(-50%); -webkit-transform: translateX(-50%); transition: all 0.25s; -webkit-transition: all 0.25s;}
#projectList .info {position: absolute; top: 50%; left: 0; padding: 3rem 2.5rem; width: 525px; height: 400px; text-align: left; color: #fff; opacity: 0; transform: translate(50%, -50%); -webkit-transform: translate(50%, -50%); transition: all 0.25s; -webkit-transition: all 0.25s;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#006fba+0,17a7db+100 */
background: rgb(0,111,186); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(0,111,186,1) 0%, rgba(23,167,219,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(0,111,186,1) 0%,rgba(23,167,219,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(0,111,186,1) 0%,rgba(23,167,219,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006fba', endColorstr='#17a7db',GradientType=1 ); /* IE6-9 */
}
#projectList .info:after {position: absolute; top: -1rem; left: 2.5rem; width: 4px; height: 0; background: #e5b915; content: ""; transition: all 0.25s; -webkit-transition: all 0.25s;}
#projectList .number {display: inline-block; margin: 0; padding: 0; line-height: 0.75; font-size: 6rem; font-weight: 700; opacity: 0; transition: all 0.25s; -webkit-transition: all 0.25s;}
#projectList .title {margin-top: -1rem; margin-bottom: 0; height: auto; line-height: 1; font-size: 1.1rem; opacity: 0; transform: translateY(-30px); -webkit-transform: translateY(-30px); transition: all 0.25s; -webkit-transition: all 0.25s;}
#projectList .title strong {display: block; margin-top: 1rem; line-height: 1.2; font-size: 2.25rem; font-weight: 400; color: #000; letter-spacing: -0.075em; opacity: 0; transform: translateY(-30px); -webkit-transform: translateY(-30px); transition: all 0.25s; -webkit-transition: all 0.25s;}
#projectList .cont {margin-top: 1rem;line-height: 1.5;height: 3rem;font-size: 0.75rem;font-weight: 200;color: #fff;/* overflow: hidden; */opacity: 0;transform: translateY(-30px);-webkit-transform: translateY(-30px);transition: all 0.25s;-webkit-transition: all 0.25s;} /*231124 overflow: hidden; 삭제*/
#projectList li a:focus { border:2px solid #000; } /*210107*/

/* slide active *//* ieCheck 200903 */
#projectList li.ieCheck img,
#projectList li.active img {opacity: 1; transform: translateX(0); -webkit-transform: translateX(0); transition-delay: 0.25s; -webkit-transition-delay: 0.25s;}
#projectList li.ieCheck .info,
#projectList li.active .info {opacity: 1; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); transition-delay: 0.25s; -webkit-transition-delay: 0.25s;}
#projectList li.ieCheck .info:after,
#projectList li.active .info:after {height: 70px; transition-delay: 0.5s; -webkit-transition-delay: 0.5s;}
#projectList li.ieCheck .number,
#projectList li.active .number {opacity: 1; transition-delay: 0.75s; -webkit-transition-delay: 0.75s;} /*211028 A?A￢A?A?A￠a?￢EœA?AªA?A·A?A¼A?A￢A￠a?￢A¾A?A± A?A￢A?a€?A?A“A?A￢A?A?A￠a?￢A￠*/
#projectList li.ieCheck .number,
#projectList li.active .number .info span {color: white;} /*211028 A?A￢A?A?A￠a?￢EœA?AªA?A·A?A¼A?A￢A￠a?￢A¾A?A± A?A￢A?A¶A￠a?￢A?A?AªA?A°A￠a€?A￢*/
#projectList li.ieCheck .title,
#projectList li.active .title {opacity: 1; transform: translateY(0); -webkit-transform: translateY(0); transition-delay: 1s; -webkit-transition-delay: 1s;}
#projectList li.ieCheck .title strong,
#projectList li.active .title strong {opacity: 1; transform: translateY(0); -webkit-transform: translateY(0); transition-delay: 1.25s; -webkit-transition-delay: 1.25s;}
#projectList li.ieCheck .cont,
#projectList li.active .cont {opacity: 1; transform: translateY(0); -webkit-transform: translateY(0); transition-delay: 1.5s; -webkit-transition-delay: 1.5s;}

/* CU SNS */
.section4 .container {position: relative;}
.section4 h2 {position: relative;margin: 2rem 0;padding-bottom: 2rem; font-size: 1.9rem;font-weight:600;opacity: 0;visibility: hidden;transform: translateY(100px);-webkit-transform: translateY(100px);transition: all 0.35s ease;-webkit-transition: all 0.35s ease;}
.section4 h2:before {position: absolute; left: 0; bottom: 0; width: 0; height: 1px; background: #dadbdd; content: ""; transition: all 0.5s ease; -webkit-transition: all 0.5s ease;}
.section4 h2:after {position: absolute; left: 50%; bottom: -3.5rem; margin-left: -22px; width: 44px; height: 12px; background: #dadbdd; background: url(/images/web/cu/main/icon22.png) no-repeat left top; content: ""; opacity: 0; visibility: hidden; transition: all 0.5s ease; -webkit-transition: all 0.5s ease;}

#snsList {position: absolute; top: 0; right: 0; opacity: 0; visibility: hidden; transform: translateY(100px); -webkit-transform: translateY(100px); transition: all 0.35s ease; -webkit-transition: all 0.35s ease;}
#snsList li {float: left;}
#snsList li + li {margin-left: 1.5rem;}
#snsList li span {display: inline-block; margin-right: 0.5rem; width: 40px; height: 40px; vertical-align: middle; background: url(/images/web/cu/main/sns.png) no-repeat center center; overflow: hidden; transition: .25s; -webkit-transition: .25s;}
#snsList a span.youtube {background-position: 0 0;}
#snsList a span.naverBlog {background-position: -40px 0;}
#snsList a span.naverPost {background-position: -80px 0;}
#snsList a span.facebook {background-position: -120px 0;}
#snsList a span.cu60 {background-position: -160px 0;} /*201109*/
#snsList a span.instagram{background-position: -200px 0;} /*260119*/
/*201217 focus A?Æ’A?A­A?a€|A?A¡A?a€?A?A¨A?Æ’A?AªA?a€?A?A³A?a€?A?A¼ A?Æ’A?A￢A?a€?A?A¶A?A￠A￠a€?A￢A?A?A?Æ’A?AªA?a€?A?A°A?A￠A￠a?￢A¡A?A￢*/
#snsList a:hover span.youtube,
#snsList a:focus span.youtube {background-position: 0 -40px;}
#snsList a:hover span.naverBlog,
#snsList a:focus span.naverBlog {background-position: -40px -40px;}
#snsList a:hover span.naverPost,
#snsList a:focus span.naverPost {background-position: -80px -40px;}
#snsList a:hover span.facebook,
#snsList a:focus span.facebook {background-position: -120px -40px;}
#snsList a:hover span.cu60,
#snsList a:focus span.cu60 {background-position: -160px -40px;} /*201109*/
#snsList a:hover span.instagram,
#snsList a:focus span.instagram {background-position: -200px -40px;}  /*260119*/

.decoText {margin-bottom: 3.5rem;padding-top: 2rem;line-height: 1.5;text-align: center;font-size: 0.9rem;color: #666;opacity: 0;visibility: hidden;transform: translateY(-100px);-webkit-transform: translateY(-100px);transition: all 0.35s ease;-webkit-transition: all 0.35s ease;}
.decoText strong {display: block; margin-bottom: 0.75rem; font-size: 2rem; color: #000; font-weight:600; }

.section4 .box1 {position: relative;}
.section4 .bx-wrapper {max-width: 100% !important;}
.section4 .bx-controls {position: absolute; top: -2.5rem; right: 0; width: 8rem; height: 2rem; /*overflow: hidden;*/} /*221227*/
.section4 .bx-controls a {position: relative;float: left;display: inline-block;margin-left: -1px;width: 2rem;height: 2rem;line-height: 2rem;color: transparent;border: 1px solid #333;overflow: hidden;}
.section4 .bx-controls a:after {position: absolute;top: 0;left: 0;width: 100%;text-align: center;font-family: 'xeicon';color: #333;}
.section4 .bx-controls a.bx-prev {margin-left: 0;}
.section4 .bx-controls a:focus{outline:2px dotted black} /*221227 접근성대응 추가*/
.section4 .bx-prev:after {content: "\e93b";}
.section4 .bx-next:after {content: "\e93e";}
.section4 .bx-start:after {content: "\ea3e";}
.section4 .bx-stop:after {content: "\ea3b";}
.section4 .bx-controls a.active::after,
.section4 .bx-controls a:hover::after {color: #000;}

.section4 .listType01 li {float: left; width: 300px;}
.section4 .listType01 li + li {margin-top: 0;}
.section4 .listType01 li a:after {display: none;}
.section4 .listType01 li a .info {position: static; bottom: auto; left: auto; margin-top: 1.5rem; width: 100%; padding: 0; height: auto; transform: none; -webkit-transform: none; -webkit-transition: none; transition: none; z-index: auto;}
.section4 .listType01 li a .info .title {display: -webkit-box;/* margin-bottom: 1.25rem; */height: 2.2rem;line-height: 1.5;font-size: 0.75rem;color: #000;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap: break-word;white-space: normal;}
.section4 .listType01 li a .info span {color: #666;}
.section4 .listType01 li a .picture { height:200px; } /* 201109 */ 

/* fullpage active */
.fp-viewing-footPage .section4 h2,
.fp-viewing-4rdPage .section4 h2 {opacity: 1; visibility: visible; transform: translateY(0); -webkit-transform: translateY(0); transition-delay: 0.5s; -webkit-transition-delay: 0.5s;}
.fp-viewing-footPage .section4 #snsList,
.fp-viewing-4rdPage .section4 #snsList {opacity: 1; visibility: visible; transform: translateY(0); -webkit-transform: translateY(0); transition-delay: 0.75s; -webkit-transition-delay: 0.75s;}
.fp-viewing-footPage .section4 .decoText,
.fp-viewing-4rdPage .section4 .decoText {opacity: 1; visibility: visible; transform: translateY(0); -webkit-transform: translateY(0); transition-delay: 1.25s; -webkit-transition-delay: 1.25s;}
.fp-viewing-footPage .section4 h2:before,
.fp-viewing-4rdPage .section4 h2:before {width: 100%; transition-delay: 1.5s; -webkit-transition-delay: 1.5s;}
.fp-viewing-footPage .section4 h2:after,
.fp-viewing-4rdPage .section4 h2:after {opacity: 1; visibility: visible; transform: rotate(360deg); -webkit-transform: rotate(360deg); transition-delay: 1.75s; -webkit-transition-delay: 1.75s;}

/* FOOTER */
.section5 {height: 180px !important;}

/* side A?A≪A?AⓒA￠a?￢A?A?A≪A￠a?￢A°A?A´ */
.sideNav {position:fixed; width:95px; right:65px; top: 150px;}
.sideNav .quick {position:relative; margin-bottom: 1rem; overflow: hidden;}
/*211222 A￢A?a€?AªA·A¼A￢a€?A± A￢A¶a€?AªA°a?￢*/
.sideNav .quick li .quick_list {display: none;} 
.sideNav .quick li .btn_open {font-size: 0.65rem; font-weight: 300; background:#0b367a;}
.sideNav .quick li .btn_open i {display: none;  margin-bottom: 0.25rem; font-size: 1.4rem; }
.sideNav .quick li .btn_open i.on {display: block;}
.sideNav .quick li .btn_open:hover i{transform: rotate(360deg); -webkit-transform: rotate(360deg); transition: all 0.25s; -webkit-transition: all 0.25s;}
/* //211222 A￢A?a€?AªA·A¼A￢a€?A± A￢A¶a€?AªA°a?￢*/
.sideNav .quick a {position:relative; display: block; padding: 0.75rem; height: 4rem; text-align: center; font-size: 0.7rem; color: #fff;}
.sideNav .quick a:focus {outline-offset:-2px;} /*221027 i?‘e·¼i?± eŒ€i?‘ i¶”e°€*/
.sideNav .quick li:nth-of-type(1) a {background: #06204b;}
.sideNav .quick li:nth-of-type(2) a {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#006fba+0,17a7db+100 */
background: rgb(0,111,186); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(0,111,186,1) 0%, rgba(23,167,219,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(0,111,186,1) 0%,rgba(23,167,219,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(0,111,186,1) 0%,rgba(23,167,219,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006fba', endColorstr='#17a7db',GradientType=1 ); /* IE6-9 */
}

.sideNav .quick li:nth-of-type(3) a {background:#00c2eb;color: #111;}
.sideNav .quick li:nth-of-type(4) a {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e5b914+0,f4c263+100 */background: rgb(229,185,20); /* Old browsers */background: -moz-linear-gradient(left,  rgba(229,185,20,1) 0%, rgba(244,194,99,1) 100%); /* FF3.6-15 */background: -webkit-linear-gradient(left,  rgba(229,185,20,1) 0%,rgba(244,194,99,1) 100%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(to right,  rgba(229,185,20,1) 0%,rgba(244,194,99,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5b914', endColorstr='#f4c263',GradientType=1 ); /* IE6-9 */color: #111;}
.sideNav .quick li:nth-of-type(5) a {
background: rgb(11,163,150);
background: -moz-linear-gradient(90deg, rgba(11,163,150,1) 0%, rgba(29,158,197,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(11,163,150,1) 0%, rgba(29,158,197,1) 100%);
background: linear-gradient(90deg, rgba(11,163,150,1) 0%, rgba(29,158,197,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0ba396",endColorstr="#1d9ec5",GradientType=1);
}
.sideNav .quick li:nth-of-type(6) a {background:#69c5ea;color: #111;}
.sideNav .quick li:nth-of-type(7) a {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e5b914+0,f4c263+100 */background: rgb(229,185,20); /* Old browsers */background: -moz-linear-gradient(left,  rgba(229,185,20,1) 0%, rgba(244,194,99,1) 100%); /* FF3.6-15 */background: -webkit-linear-gradient(left,  rgba(229,185,20,1) 0%,rgba(244,194,99,1) 100%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(to right,  rgba(229,185,20,1) 0%,rgba(244,194,99,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5b914', endColorstr='#f4c263',GradientType=1 ); /* IE6-9 */color: #111;}
.sideNav .quick li:nth-of-type(1) a i {display: block; margin-bottom: 0.25rem; font-size: 1.4rem;}
.sideNav .quick li:nth-of-type(8) a {
background: rgb(11,163,150);
background: -moz-linear-gradient(90deg, rgba(11,163,150,1) 0%, rgba(29,158,197,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(11,163,150,1) 0%, rgba(29,158,197,1) 100%);
background: linear-gradient(90deg, rgba(11,163,150,1) 0%, rgba(29,158,197,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0ba396",endColorstr="#1d9ec5",GradientType=1);
}/* 241121 예금금리비교 추가 */

.sideNav .quick a span {display: block; margin-bottom: 0.5rem;}

.sideNav .quick li:nth-of-type(1) a:hover i {transform: rotate(360deg); -webkit-transform: rotate(360deg); transition: all 0.25s; -webkit-transition: all 0.25s;}
.quick li a::before {position: absolute; top: 50%; left: 50%; z-index: 2; display: block; content: ''; width: 0; height: 0; background: rgba(0,0,0,.2); border-radius: 50%; transform: translate(-50%, -50%); opacity: 0;}
.quick li a:hover{animation: bloom ease-in-out .75s forwards;}
.quick li a:hover::before {animation: circle2 .75s;}

@keyframes bloom {
	0% {filter: grayscale(.8);}
	40% {filter: grayscale(.5);}
	100% {filter: grayscale(0);}
}
@keyframes circle2 {
	0% {opacity: .3; background: rgba(255,255,255,.2);}
	40% {opacity: 0.5; background: rgba(255,255,255,.2);}
	100% {width: 200%; height: 200%; opacity: 0;}
}

.sideNav #fullpageMenu {position: relative; padding-right: 15px; overflow: hidden;}
.sideNav #fullpageMenu::before {position: absolute; top: 0; right: 3px; width: 2px; height: 100%; background: rgba(0,0,0,0.2); content: "";}
.sideNav #fullpageMenu li {position: relative; display: block; padding: 2px 0;}
.sideNav #fullpageMenu li::before {position: absolute; top: 0; right: -12px; width: 2px; background: #000; content: ""; opacity: 0; visibility: hidden; transition: .25s; -webkit-transition: .25s;}
.sideNav #fullpageMenu li::after {position: absolute; top: 0; right: -15px; width: 8px; height: 8px; background: #e3b81c; border-radius: 50%; content: ""; opacity: 0; visibility: hidden; transition: .25s; -webkit-transition: .25s;}
.sideNav #fullpageMenu li a {display: block;line-height: 30px;text-align: center;font-size: 0.65rem;background: none;transition: .25s;-webkit-transition: .25s;color: #000;} /*211028 A?A￢A?A?A￠a?￢EœA?AªA?A·A?A¼A?A￢A￠a?￢A¾A?A± A?A￢A?A≫A?A￢A?A≪A…A¸A?A￢ A?A￢A?a€?A?A“A?A￢A?A?A￠a?￢A￠*/
.sideNav #fullpageMenu li.active::before {height: 34px; opacity: 1; visibility: visible;}
.sideNav #fullpageMenu li.active::after {top: 14px; opacity: 1; visibility: visible;}
.sideNav #fullpageMenu li.active a {color: #fff;background: #666;}

/* A?A≪A?A¹A￠a?￢A¾A?A￢A?A￡A?A¼A?A￢A￠a?￢a€œA?A¼ IEA?A￢A?A²A?A´A?A­A?A?A?A￢ 200903 */
.visualOuter .bx-pager.ieCheck .bx-pager-item{float:left;}
.visualOuter .bx-pager.ieCheck .bx-pager-item + .bx-pager-item:before{content:"/"; padding:0 3px; display:block; float:left; }

/* A?A￢A…A?A?A￢A?A≪A?A?A?A¼A?A￢A?A?A?A´A?A≪A￠a?￢A“A…a€œ A?AªA?A³A?AμA?A￢A…A¡A?Aⓒ 200903 */
.slick-slider {transition:all ease-in-out .3s; 	box-sizing:border-box; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none;  user-select:none; -webkit-touch-callout:none; -khtml-user-select:none; -ms-touch-action:pan-y; touch-action:pan-y; -webkit-tap-highlight-color:transparent; }
.slick-slide { display:none; height:100%; min-height:1px; vertical-align:middle; }
.slick-list { overflow:hidden; }
.slick-list.dragging { cursor:pointer; }
.slick-initialized .slick-slide { display:inline-block; overflow:hidden; }
.slick-arrow.slick-hidden { display:none; }
.slick-current { opacity:1; display:block; }
.slick-track {position:relative; left:0; top:0; display:block; margin-left:auto; margin-right:auto; }

/* Layer popup A?A￢A…A?A?A￢A?A≪A?A?A?A¼A?A￢A?A?A?A´A?A≪A￠a?￢A“A…a€œ 200903 */
.openPop { display:block; }
#LayerPopupList {position: relative;display: inline-block;width:calc(100% - 6rem);margin: .5rem auto 2.5rem;opacity:1;} /*241216 */
#popupList {overflow: hidden; }
.layerPopup .popup_list img { max-width:100%; } 
.layerPopup .popup_list a { display:block; margin:0 5px; } 
.layerPopup .slick-counter {
	position: absolute;
	top: -0.5rem;
	left: 50%;
	/* margin-left: 7rem; */
	padding-top: 0;
	width: 3.25rem;
	height: 3.25rem;
	line-height: 3.25rem;
	text-align: center;
	font-family: 'Titillium Web', sans-serif;
	font-size: 0.9rem;
	font-weight:700;
	color: #fff;
	letter-spacing: -0.05em;
	border-radius: 50%;
	/* background: rgb(0,111,186); */
	background: -moz-linear-gradient(left,  rgba(0,111,186,1) 0%, rgba(23,167,219,1) 100%);
	/* background: -webkit-linear-gradient(left,  rgba(0,111,186,1) 0%,rgba(23,167,219,1) 100%); */
	/* background: linear-gradient(to right,  rgba(0,111,186,1) 0%,rgba(23,167,219,1) 100%); */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006fba', endColorstr='#17a7db',GradientType=1 );
	}/*241216 */
.layerPopup .slick-counter .current {color: #fff;}/*#ffd65d  241216 색상변경*/
.layerPopup h3 {visibility:hidden}/*241216 */
.layerPopup .slick-arrow {position: absolute; top: 50%; display: block; margin-top: -1rem; width: 2rem; height: 2rem; color: transparent; overflow: hidden;}
.layerPopup .slick-arrow:before {position: absolute; top: 0; left: 0; width: 2rem; height: 2rem; text-align: center; font-family: 'xeicon'; font-size: 2rem; color: #fff; text-shadow: 3px 3px 3px rgba(0,0,0,0.5);}
.layerPopup .slick-arrow.slick-prev {left: -3rem;}
.layerPopup .slick-arrow.slick-prev:before {content: '\e93b';}
.layerPopup .slick-arrow.slick-next {right: -3rem;}
.layerPopup .slick-arrow.slick-next:before {content: '\e93e';}
.layerPopup .closeWrap a {display: inline-block; margin:0 0.25rem 0.25rem; padding: 0 1.5rem; line-height: 2rem; border-radius: 1rem; background: #000;}
.layerPopup .closeWrap a i {margin-left: 1rem;}

/* Layer popup A?A￢A…A?A?A￢A?A≪A?A?A?A¼A?A￢A?A?A?A´A?A≪A￠a?￢A“A…a€œ 
.LayerPopupList {position: relative; display: inline-block; margin: 2.5rem auto; padding: 0 3rem;}
#popupList {overflow: hidden;}
#popupList li {float: left; width: 360px !important; height: 393px;}
#popupList a {display: block; width: 347px; height: 100%; text-align: center; background: #fff;}
#popupList a img {width: 100%; height: 100%;}

.layerPopup .bx-controls-direction > a {position: absolute; top: 50%; display: block; margin-top: -1rem; width: 2rem; height: 2rem; color: transparent; overflow: hidden;}
.layerPopup .bx-controls-direction > a:before {position: absolute; top: 0; left: 0; width: 2rem; height: 2rem; text-align: center; font-family: 'xeicon'; font-size: 2rem; color: #fff; text-shadow: 3px 3px 3px rgba(0,0,0,0.5);}
.layerPopup .bx-prev {left: 0;}
.layerPopup .bx-prev:before {content: '\e93b';}
.layerPopup .bx-next {right: 0;}
.layerPopup .bx-next:before {content: '\e93e';}

.layerPopup .pagerShort {position: absolute; top: -5.25rem; left: 50%; margin-left: 7rem; padding-top: 0; width: 3.25rem; height: 3.25rem; line-height: 3.25rem; text-align: center; font-family: 'Titillium Web', sans-serif; font-size: 0.9rem; color: #fff; letter-spacing: -0.05em; border-radius: 50%;
background: rgb(0,111,186);
background: -moz-linear-gradient(left,  rgba(0,111,186,1) 0%, rgba(23,167,219,1) 100%);
background: -webkit-linear-gradient(left,  rgba(0,111,186,1) 0%,rgba(23,167,219,1) 100%);
background: linear-gradient(to right,  rgba(0,111,186,1) 0%,rgba(23,167,219,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006fba', endColorstr='#17a7db',GradientType=1 );
}
.pagerShort .total {color: inherit;}
.pagerShort .now {color: #ffd65d;}

.layerPopup .closeWrap a {display: inline-block; margin: 0 0.25rem; padding: 0 1.5rem; line-height: 2rem; border-radius: 1rem; background: #000;}
.layerPopup .closeWrap a i {margin-left: 1rem;}*/

/* 2020.05.08 SY,CHo A?Æ’A?A￢A?a€?A?A¶A?a€|A￠a?￢A“A?Æ’A?A≪A?a€?A?A?A?a€?A?A￥A?Æ’A?A≪A?a€?A?A￢A?a€?A?A¼ A?Æ’A?A￢A?a€¹A￠a?￢A?A?a€¹A…a€œA?Æ’A?A≪A?a€|A?A¸A?A￠A￠a€?A￢A?A°A?Æ’A?A￢A?A￠A￠a€?A￢A￠a?￢A?A?a€?A?A? A?Æ’A?A≪A?A￠A￠a€?A￢A?A?A?a€?A?A°A?Æ’A?A≪A?a€?A?A￥A?a€?A?A¸ A?Æ’A?A￢A?a€?A?A?A?A￠A￠a€?A￢A?A￠A?Æ’A?A≪A?a€?A?A?A?a€?A?A￢ A?Æ’A?A￢A?a€?A?A?A?a€?A?A´A?Æ’A?A￢A?a€?A￠a?￢a?￠A?a€?A?A?A?Æ’A?A￢A?a€|A￠a?￢A“A?a€?A?A¼A?Æ’A?A≪A?a€?A?A¡A?a€|A￠a?￢A“ A?Æ’A?A­A?A￠A￠a€?A￢A?A?A?a€|A￠a?￢a?￠A?Æ’A?A≪A?a€|A?A¸A?a€?A?A￢A?Æ’A?AªA?a€?A?A·A?a€?A?A¸A?Æ’A?A￢A?a€?A?A?A?a€?A?A¸ A?Æ’A?AªA?a€?A?AμA?a€?A?A?A?Æ’A?A￢A?a€?A?A²A?a€?A?A´ A?Æ’A?A≪A?a€?A?A°A?a€?A?A±A?Æ’A?A￢A?A￠A￠a€?A￢A￠a?￢A?A?A￠A￠a€?A￢A?A|
.layerPopup #popupList .slick-list {overflow: hidden;}
.layerPopup #popupList .slick-track {margin: 0 auto;}
.layerPopup #popupList .slick-slide {position: relative; float: left; margin: 0 0.5rem;}
.layerPopup #popupList .slick-slide.slick-current.slick-active.slick-center:after {position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 5px solid red; content: ""; transition: .25s; -webkit-transition: .25s;}
.layerPopup #popupList a {display: inline-block; max-width: 347px; height: 393px;}
.layerPopup button {position: absolute; top: 50%; display: block; margin-top: -1rem; width: 2rem; height: 2rem; color: transparent; overflow: hidden;}
.layerPopup button.slick-prev {left: 0;}
.layerPopup button.slick-next {right: 0;}
.layerPopup button:before {position: absolute; top: 0; left: 0; width: 2rem; height: 2rem; text-align: center; font-family: 'xeicon'; font-size: 2rem; color: #fff; text-shadow: 3px 3px 3px rgba(0,0,0,0.5);}
.layerPopup button.slick-prev:before {content: '\e93b';}
.layerPopup button.slick-next:before {content: '\e93e';}
.layerPopup .slick-dots {position: absolute; top: -5.25rem; left: 50%; margin-left: 7rem; width: 3.25rem; height: 3.25rem; line-height: 3.25rem; font-family: 'Titillium Web', sans-serif; font-size: 0.9rem; letter-spacing: 5px; border-radius: 50%;
background: rgb(0,111,186);
background: -moz-linear-gradient(left,  rgba(0,111,186,1) 0%, rgba(23,167,219,1) 100%);
background: -webkit-linear-gradient(left,  rgba(0,111,186,1) 0%,rgba(23,167,219,1) 100%);
background: linear-gradient(to right,  rgba(0,111,186,1) 0%,rgba(23,167,219,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006fba', endColorstr='#17a7db',GradientType=1 );
}
.layerPopup .slick-dots li {display: none; width: 100%; letter-spacing: -0.025em;}
.layerPopup .slick-dots li.slick-active {display: block;}
.layerPopup .slick-dots li .now {color: #ffd65d;}
*/

@media screen and (max-width: 1700px){
	.sideNav {right: 10px;}
}
@media screen and (max-width: 1600px){
	/* A?A≪A?AⓒA￠a?￢A?A?A￢A?A?A?A¸ A?A≪A?A¹A￠a?￢A¾A?A￢A?A￡A?A¼A?A￢A￠a?￢a€œA?A¼ */
	#visualList li .text-box {top: 12rem; }
	.visualOuter .bx-controls {top: 9rem; }

		/* side A?A≪A?AⓒA￠a?￢A?A?A≪A￠a?￢A°A?A´ */
	.sideNav {top: 180px; right: 0; width: 60px;}
	.sideNav .quick a {display: block; padding: 0; height: 3rem; opacity: 0.9; overflow: hidden;}
	.sideNav .quick a:hover {opacity: 1;}
	.sideNav .quick li:nth-of-type(1) a i {margin-bottom: 0; height: 3rem; line-height: 3rem;}
	.sideNav .quick > li:nth-of-type(2) a i {margin-bottom: 0; height: 3rem; line-height: 3rem;} /*211222 A￢A?a€?AªA·A¼A￢a€?A± A￢A¶a€?AªA°a?￢*/
	.sideNav .quick a span {display: block; margin-bottom: 0; width: 100%; height: 3rem; padding: 1rem 0;}

	.sideNav #fullpageMenu {display: none;}
}
@media screen and (max-width: 1440px){
	.section,
	.fp-tableCell {height: auto !important;}
	.section {padding: 3rem 0;}

		/* A?A≪A?AⓒA￠a?￢A?A?A￢A?A?A?A¸ A?A≪A?A¹A￠a?￢A¾A?A￢A?A￡A?A¼A?A￢A￠a?￢a€œA?A¼ */
	.section.section1 {padding: 0;}
	.visualOuter .bx-viewport,
	#visualList,
	#visualList li {height: 700px !important;}
	#visualList li > img { height: 100%; }
	.section1 .scrollDown {display: none;}
	/* 200901 A?Æ’A?A￢A?A￠A￠a€?A￢A…A¡A?a€?A?A­A?Æ’A?A￢A?a€?A?A?A?a€|A￠a?￢A“
	#visualList li .text-box p.tit1 { font-size:2.25rem;  }
	#visualList li .text-box p.tit2 { font-size:1.5rem; }
	#visualList li .text-box p.tit3 { font-size:1.25rem; }
	#visualList li .text-box p.tit4 { font-size:0.8rem; }
	*/
	#visualList li .text-box .slogan { transform:scale(0.7); -webkit-transform:scale(0.7); transform-origin:left top; -webkit-transform-origin:left top; max-width:140%; }/* 200901 A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A¹A?A￠A￠a€?A￢A?A?A?Æ’A￠a?￢A¹A?a€|A￠a?￢A“A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A¡A?a€?A?A?A?Æ’A?A￠A?A￠A￠a?￢A¡A?A￢A?a€?A?A￠*/

	/* NEWS */
	.section2 .container {padding: 3.5rem 0;}
	.section2 .boxDiv {opacity: 1; visibility: visible; transform: translateY(0); -webkit-transform: translateY(0);}
	.section2 .container:before {height: 1000%;}
	.section2 .container:after {opacity: 1; visibility: visible; -webkit-transform: rotate(360deg); transform: rotate(360deg); transition-delay: 1.25s; -webkit-transition-delay: 1.25s;}

/* CU A?A­A￠a?￢A?A￠a?￢A¾A?A≪A?A¡A…a€œA?A￢A?A?A?A?A?A­A…A?A?A¸ */
	.section3 h2 {margin-bottom: 1.5rem;}

	/* CU SNS */
	.section4 h2 {opacity: 1; visibility: visible; transform: translateY(0); -webkit-transform: translateY(0);}
	.section4 #snsList {opacity: 1; visibility: visible; transform: translateY(0); -webkit-transform: translateY(0);}
	.section4 .decoText {opacity: 1; visibility: visible; transform: translateY(0); -webkit-transform: translateY(0);}
	.section4 h2:before {width: 100%;}
	.section4 h2:after {opacity: 1; visibility: visible; transform: rotate(360deg); -webkit-transform: rotate(360deg);}

	/* CU SNS */
	#snsList {right: 2rem;}

	/* FOOTER */
	.section.section5 {padding: 0; height: auto !important;}
}
@media screen and (max-width: 1400px){
	.container {padding: 0 2rem;}

		/* A?A≪A?AⓒA￠a?￢A?A?A￢A?A?A?A¸ A?A≪A?A¹A￠a?￢A¾A?A￢A?A￡A?A¼A?A￢A￠a?￢a€œA?A¼ */
	.visualOuter .bx-controls {left: 1rem; margin-left: 0;}
	.animationPig a {padding: 2rem;}

	/* NEWS */
	.section2 .container {padding: 0 2rem;}
	.section2 .container:before,
	.section2 .container:after {display: none;}
	.section2 .boxDiv {width: 48%;}
	.section2 .boxDiv.box2 {margin-left: 4%;}
	.section2 .boxDiv.box3 {clear: both; margin-top: 2rem; margin-left: 0; width: 100%;}
	.section2 .boxDiv.box3 .boxDiv {width: 48%;}
	.section2 .boxDiv.box5 {margin-top: 0; margin-left: 4%;}

	/* CU SNS */
	#snsList {right: 1rem;}

	/* FOOTER */
	.section.section5 .container {padding: 0;}
}

@media screen and (max-width: 1280px){

	/* CU SNS 201109 */
	#snsList li + li {margin-left: 0.5rem;}
	#snsList a {display: block; color: transparent; width: 40px; height: 40px; overflow: hidden;} 
	
}
@media screen and (max-width: 1024px){
	#wrap { position:relative; padding-bottom:19rem; } /*210204*/
	.container {padding: 0 1rem;}

	/* A?A≪A?AⓒA￠a?￢A?A?A￢A?A?A?A¸ A?A≪A?A¹A￠a?￢A¾A?A￢A?A￡A?A¼A?A￢A￠a?￢a€œA?A¼ */
	.visualOuter .bx-viewport,
	#visualList,
	#visualList li {height: 600px !important;}
	#visualList li .text-box {top: 30%;}
	.visualOuter .bx-controls {top: 20%;}
	.animationPig a {padding: 1rem;}
	#visualList li > img { padding-top:60px; }

	/* NEWS */
	.section2 .container {padding: 0 1rem;}
	.listType01 li a .picture { height:auto; }
	.section2 .listType03 li { height:auto; }
	

	/* CU A?A­A￠a?￢A?A￠a?￢A¾A?A≪A?A¡A…a€œA?A￢A?A?A?A?A?A­A…A?A?A¸ */
	#project {padding-bottom: 4.5rem;}
	#project .bx-controls {margin-left: -150px; width: 300px;}
	#projectList li img {max-width: 100%;}
	#projectList .info {padding: 2rem 1.5rem; width: 60%; height: auto;}
	#projectList .number {font-size: 4rem;}
	#projectList .title strong {font-size: 1.75rem;}

	/* CU SNS  201109* /
	/* #snsList li + li {margin-left: 0.5rem;}
	#snsList a {display: block; color: transparent; width: 40px; height: 40px; overflow: hidden;} */
	.section4 .listType01 li a .picture { height:auto; }

	/* side A?A≪A?AⓒA￠a?￢A?A?A≪A￠a?￢A°A?A´ */
	.sideNav {position: absolute; top: auto;bottom: 0;width: 100%;} /*210204*/
	.sideNav .quick a {line-height: 3rem; opacity: 1;}
	.sideNav .quick li:nth-of-type(1) {display: none;}
	/*211222 A￢A?a€?AªA·A¼A￢a€?A± A￢A¶a€?AªA°a?￢*/
		.sideNav .quick a.btn_open i.on {display: inline-block; margin-right: 0.5rem; margin-bottom: 0; padding: 0; width: auto; height: auto;} 
		.sideNav .quick a.btn_open span {display: inline-block; }
	/*//211222 A￢A?a€?AªA·A¼A￢a€?A± A￢A¶a€?AªA°a?￢*/
	.sideNav .quick a span {display: inline-block; margin-right: 0.5rem; margin-bottom: 0; padding: 0; width: auto; height: auto;}
}
@media screen and (max-width: 768px){
	
	/*A?Æ’A?A≪A?a€?A?A¹A?A￠A￠a€?A￢A…A¾A?Æ’A?A￢A?a€?A?A￡A?a€?A?A¼A?Æ’A?A￢A?A￠A￠a€?A￢A￠a?￢A“A?a€?A?A¼*/
	#visualList li > img { right:0; }
	#visualList li > img.w_visual { display:none; }
	#visualList li > img.m_visual { display:block; width:100%; }
	.visualOuter .bx-viewport, #visualList, #visualList li { height:auto !important; }
	.visualOuter .bx-controls { top:5rem; }
	#visualList li .text-box { top:8rem; }

	/* CU SNS */
	.decoText strong {font-size: 1.25rem;}
}
@media screen and (max-width: 600px){
		/* A?A≪A?AⓒA￠a?￢A?A?A￢A?A?A?A¸ A?A≪A?A¹A￠a?￢A¾A?A￢A?A￡A?A¼A?A￢A￠a?￢a€œA?A¼ */
	#visualList li .text-box .slogan { transform:scale(0.4); -webkit-transform:scale(0.4)}/* 200902A?Æ’A†a€™A?a€?A?A￢A?Æ’A￠a?￢A¡A?a€?A?A¶A?Æ’A?A￠A?A￠A￠a?￢A¡A?A￢A?a€?A?A?A?Æ’A†a€™A?a€?A?AªA?Æ’A￠a?￢A¡A?a€?A?A°A?Æ’A?A￠A?A￠A￠a€?A￢A…A¡A?a€?A?A￢*/
	
	/*210105*/
	#visualList li.slogan_right .container { margin-left:-1rem; transform:none; -webkit-transform:none; }
	#visualList li.slogan_right .text-box { top:5rem; left:auto; right:0; }
	
	.container.animationPigOuter {position: relative; top: auto; left: auto; margin-top: 5rem; height: auto; transform: none; -webkit-transform: none;}
	.animationPig {min-width: 100%;}
	.animationPig::after {right: -110px;}
	.animationPig a {padding: 5rem 2rem 1rem;}
	.animationPig.active a strong {float: left; margin-right: 1rem;}
	.animationPig.active a p {float: left; margin: 0;}
	.animationPig.active a .go {clear: both; display: block;}
	.animationPig .shadow01 {right: auto; bottom: 110px; left: 7%;}
	.animationPig .shadow02 {right: auto; bottom: 80px; left: 19%;}
	.animationPig .shadow03 {right: auto; bottom: 75px; left: 35%;}
	.animationPig .pig01 {right: auto; bottom: 130px; left: 8%;}
	.animationPig .pig02 {right: auto; bottom: 100px; left: 20%;}
	.animationPig .pig03 {right: auto; bottom: 100px; left: 30%;}
	.animationPig .pig01 img {width:50px;}
	.animationPig .pig02 img {width:50px;}
	.animationPig .pig03 img {width:100px;}

	/* NEWS */
	.section2 .boxDiv {width: 100%;}
	.section2 .boxDiv.box2 {margin-top: 2rem; margin-left: 0%;}
	.section2 .boxDiv.box3 .boxDiv {width: 100%;}
	.section2 .boxDiv.box5 {margin-top: 2rem; margin-left: 0;}

	.listType01 li a .picture {height: auto;}

/* CU A?A­A￠a?￢A?A￠a?￢A¾A?A≪A?A¡A…a€œA?A￢A?A?A?A?A?A­A…A?A?A¸ */
	.section3 h2 {font-size: 1.5rem;}
	#projectList .info {padding: 1.5rem;}
	#projectList .info:after {left: 1.5rem;}
	#projectList .number {font-size: 3rem;}
	#projectList .title {margin-top: -0.5rem; font-size: 0.9rem; white-space: normal; text-overflow: inherit;}
	#projectList .title strong {margin-top: 0.5rem; font-size: 1rem;}
	#projectList .cont {display: none;}

	#projectList li.active .info:after {height: 40px;}
}
	@media screen and (max-width: 414px){
	/* A?A≪A?AⓒA￠a?￢A?A?A￢A?A?A?A¸ A?A≪A?A¹A￠a?￢A¾A?A￢A?A￡A?A¼A?A￢A￠a?￢a€œA?A¼ */
		.animationPig .shadow01 {left: 12%;}
		.animationPig .pig01 {left: 9%;}
	
	@keyframes bounceUp1 {
		0% {opacity: 1; transform: translateY(0);}
		25% {opacity: 1; transform: translateY(-40px);}
		50% {opacity: 1; transform: translateY(10px);}
		100% {opacity: 1; transform: translateY(0);}
	}
	@-webkit-keyframes bounceUp1 {
		0% {opacity: 1; transform: translateY(0);}
		25% {opacity: 1; transform: translateY(-40px);}
		50% {opacity: 1; transform: translateY(10px);}
		100% {opacity: 1; transform: translateY(0);}
	}

	@keyframes bounceUp2 {
		0% {opacity: 1; transform: translateY(0);}
		25% {opacity: 1; transform: translateY(-30px);}
		50% {opacity: 1; transform: translateY(10px);}
		100% {opacity: 1; transform: translateY(0);}
	}
	@-webkit-keyframes bounceUp2 {
		0% {opacity: 1; transform: translateY(0);}
		25% {opacity: 1; transform: translateY(-30px);}
		50% {opacity: 1; transform: translateY(10px);}
		100% {opacity: 1; transform: translateY(0);}
	}
	@keyframes bounceUp3 {
		0% {opacity: 1; transform: translateY(0px);}
		30% {opacity: 1; transform: translateY(-5px);}
		40% {opacity: 1; transform: translateY(0px);}
		80% {opacity: 1; transform: translateY(-5px);}
		100% {opacity: 1; transform: translateY(0px);}
	}
	@-webkit-keyframes bounceUp3 {
		0% {opacity: 1; transform: translateY(0px);}
		30% {opacity: 1; transform: translateY(-5px);}
		40% {opacity: 1; transform: translateY(0px);}
		80% {opacity: 1; transform: translateY(-5px);}
		100% {opacity: 1; transform: translateY(0px);}
	}


	/* CU A?A­A￠a?￢A?A￠a?￢A¾A?A≪A?A¡A…a€œA?A￢A?A?A?A?A?A­A…A?A?A¸ */
	#projectList .info {padding: 1rem;}
	#projectList .info:after {left: 1rem;}
	#projectList .number {font-size: 2rem;}
	#projectList .title {line-height: 1.3; font-size: 0.8rem;}
	#projectList .title strong {line-height: 1.3; font-size: 0.9rem;}

	/* CU SNS */
	.section4 h2 {font-size: 1.5rem; padding-bottom:5rem}
    #snsList {top: 3rem;}
    
	/* FOOTER */
	.section.section5 .container {padding: 0;}
}
@media screen and (max-width: 380px){
/*210105*/
	.visualOuter { position:relative; }
	.container.animationPigOuter { padding:0; margin-top:0; } 
	.animationPig { position:relative; }
	.animationPig a { padding:1rem 2rem; }
	.animationPig .shadow01 { display:none; }
	.animationPig .shadow02 { display:none; }
	.animationPig .shadow03 { display:none; }
	.animationPig .pig01 { display:none; }
	.animationPig .pig02 { display:none; }
    .animationPig .pig03 { display:none; }

    /*210105*/
	.visualOuter .bx-controls-direction { width:7rem; }
	.visualOuter .bx-controls-auto { right:0.4rem; }
	.visualOuter .bx-pager { left:2rem; }
	.visualOuter .bx-controls-direction a.bx-prev { left:0.5rem; }
	.visualOuter .bx-controls-direction a.bx-next { left:4rem; }
	.section1 .logo60 {display:block; position:absolute; left:1rem; bottom:1rem; background: #fff;width: 3.5rem;text-align: center;border-radius: 50%;height: 3.5rem; box-shadow:0 0 10px 0 rgba(255,255,255,0.5); -webkit-box-shadow:0 0 10px 0 rgba(255,255,255,0.5); }
	.section1 .logo60 img { width:2rem; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); }
}
@media screen and (max-height: 950px){
	/* CU SNS */
	.section4 h2:after,
	.section4 .decoText {/* display: none; */}
	
	.decoText {margin-bottom: 3rem;padding-top: 2rem;}
	.decoText strong {margin-bottom: 0.5rem;}

}
