/* 퀵메뉴 */
.right-quick-menu {position:fixed; bottom:2%; right:2rem; z-index:99; text-align:center; cursor:pointer; display: none;}
.right-quick-menu li {background:#bbb; width:87px; height:87px; line-height:87px; border-radius:100%; text-align:center; cursor:pointer; margin-bottom:7px;}
.right-quick-menu li img {margin-bottom:-20px;}
.right-quick-menu li:hover {background:#AD3371;}
.container {height:100%;}

.slick-list,
.slick-track {height: 100%;}
.slick-list * {outline: none;}

.fade {position: relative; opacity: 0; transition: 1s;}
.fade-fast {transition: 0.05s;}
.fade-l {left:-50px;}
.fade-l.fade-show {left:0; opacity: 1;}
.fade-r {right:-50px;}
.fade-r.fade-show {right:0; opacity: 1;}
.fade-t {top:-50px;}
.fade-t.fade-show {top:0; opacity: 1;}
.fade-b {bottom:-50px;}
.fade-b.fade-show {bottom:0; opacity: 1;}
.fade-delay0-5 {transition-delay: 0.2s;}
.fade-delay1 {transition-delay: 0.4s;}
.fade-delay1-5 {transition-delay: 0.6s;}
.fade-delay2 {transition-delay: 0.8s;}
.fade-delay2-5 {transition-delay: 1s;}
.fade-delay3 {transition-delay: 1.2s;}
.fade-delay3-5 {transition-delay: 1.4s;}
.fade-delay4 {transition-delay: 1.8s;}
.fade-delay4-5 {transition-delay: 2.0s;}

/* 스크롤  */
.icon-scroll {display:none;position:fixed;bottom:0px;left:calc(50% - 25px);z-index:999; padding:0px 0 20px;;}
.icon-scroll div {display:none; transform:rotate(-90deg); font-size:13px;font-weight:500;color:#222;}
.icon-scroll:after {content:"";display:block;width:53px;height:53px;background:url(../images/arrow1.png) center center no-repeat;margin:0 auto;}
.icon-scroll.on {display:block;}


/* 섹션별 */
.slider-01 {background-image: url(../images/bg_01.jpg); background-repeat: no-repeat; background-size: cover; background-position:center;}
.slider-02 {background-image: url(../images/bg_01_2.jpg); background-repeat: no-repeat; background-size: cover; background-position:center;}
.slider-03 {background-image: url(../images/bg_01_3.jpg); background-repeat: no-repeat; background-size: cover; background-position:center;}

.mainslide {height:100vh; width:100vw;}
.mainslide .swiper-wrapper {width:100%;}
.mainslide .swiper-slide { color:#fff; position: relative; box-sizing: border-box; display:flex; flex-direction: column; align-items: center; justify-content: center;}
.mainslide .swiper-slide .dim {display:block; width:100%; height:100%; background-color:rgba(0,0,0,.4);position: absolute;}
.mainslide .con { padding:5%; color:#333; text-align: center;}
.mainslide .swiper-slide .tit {font-size:17px; font-weight:400; color:#013b75; line-height: 1.6em; margin:45px 0;}
.mainslide .swiper-slide .txt {font-size:27px; font-weight:500; color:#3d3d3d; line-height:1.5em; letter-spacing:-0.5px;}
.mainslide .swiper-slide-active .logo-img {animation:ani2_2 1s .4s both; width:90%; max-width:520px; margin:0 auto;}
.mainslide .swiper-slide-active .tit {animation:ani2 1s .9s both;}
.mainslide .swiper-slide-active .txt {animation:ani2 1s 1.2s both;}

.mainslide .swiper-pagination {background:rgba(0,0,0,.4); color:#fff; width:80px; height:35px; line-height: 35px; border-radius: 30px; font-size:15px; margin-left:5.5%; margin-bottom:5%;}

.mv_slide {
    animation: grow 20s linear infinite; 
    -webkit-animation: grow 20s linear infinite;
    -moz-animation: grow 20s linear infinite;
    -ms-animation: grow 20s linear infinite;
    -o-animation: grow 20s linear infinite;
}

@keyframes grow {
    0%   { background-size: 100% 100%; }
    50% { background-size: 110%  110%; }
    100% { background-size: 100% 100%; }
}
@-webkit-keyframes grow { 
    0%   { background-size: 100% 100%; }
    50% { background-size: 110%  110%; }
    100% { background-size: 100% 100%; }
   }
@-moz-keyframes grow { 
    0%   { background-size: 100% 100%; }
    50% { background-size: 110%  110%; }
    100% { background-size: 100% 100%; }
}
@-ms-keyframes grow { 
    0%   { background-size: 100% 100%; }
    50% { background-size: 110%  110%; }
    100% { background-size: 100% 100%; }
}
@-o-keyframes grow { 
    0%   { background-size: 100% 100%; }
    50% { background-size: 110%  110%; }
    100% { background-size: 100% 100%; }
}

@keyframes ani {
	0% {opacity:0; transform:translateX(-170px)}
	100% {opacity:1; transform:translateX(0px)}
}
@keyframes ani2 {
	0% {opacity:0; transform:translateY(40px)}
	100% {opacity:1; transform:translateY(0px)}
}
@keyframes ani2_2 {
	0% {opacity:0; transform:translateY(-30px)}
	100% {opacity:1; transform:translateY(0px)}
}
@keyframes ani3 {
	0% {opacity:0; }
	100% {opacity:1;}
}
@keyframes zoom {
    0% { -webkit-transform: scale(1); transform: scale(1); }
	70% { -webkit-transform: scale(1.1); transform: scale(1.1); }
	100% { -webkit-transform: scale(1); transform: scale(1); }


}
.title {font-size:39px; font-weight:700; line-height: 1.3em;}
.h-tit {font-size:15px; font-weight:500; letter-spacing:1.3em;}
.h-tit-white {color:#fff;font-size:15px; font-weight:300; letter-spacing:1.3em;}
.h-tit-gray {color:#999;font-size:15px; font-weight:500; letter-spacing:1.3em;}

#list {background: url(../images/bg_02.jpg) no-repeat right center/cover; display: flex; align-items: center; justify-content: center;}
#list p.sec_title {color:#fff; font-size:30px; margin-top:55px;} 
#list ul.ul_pic {justify-content: space-around; margin-top:55px;}
#list ul.ul_pic li {width:30%; margin:4px; box-sizing: border-box; background:#fff; padding:40px 10px;}
#list ul.ul_pic li img {max-width:140px; width:90%;}
#list ul.ul_pic li h5 {color:#333; font-size:30px; font-weight:700; letter-spacing:-.01em; line-height: 1.1em; margin:10px 0;}
#list ul.ul_pic li p {color:#777; font-size:19px; font-weight:500; letter-spacing:-.03em; line-height: 1.5em; }

#cons_cate {background: url(../images/bg_03.jpg) no-repeat center/cover; display: flex; align-items: center; justify-content: center;}
#cons_cate ul {display:flex; flex-wrap:wrap; justify-content: center; margin-top:90px;}
#cons_cate ul li {width:33%;}
#cons_cate ul li.text {padding:40px; box-sizing: border-box;}
#cons_cate ul li img {width:100%; height:100%;}
#cons_cate ul li h5 {color:#374595; font-size:35px; font-weight:700; margin:50px 0 20px;}
#cons_cate ul li p {color:#777; font-size:17px; font-weight:500; letter-spacing:-.03em; line-height: 1.5em;}

#consmkt {display: flex; flex-wrap:wrap; align-items: center;}
#consmkt .left {width:25%; height:100%; background: url(../images/bg_04.jpg) no-repeat center/cover; display: flex; flex-direction: column; justify-content:center; color:#fff; padding:4%; box-sizing:border-box;}
#consmkt .left .line {width:100px; height:1px; background:#fff; margin:40px 0;}
#consmkt .right {width:75%; height:100%; background:#fff; display: flex; flex-direction: column; flex-wrap:wrap; justify-content: center;}
#consmkt .right p.h-tit {margin-left:7%;}
#consmkt .right h5.title {color:#121ca0; margin-left:7%; margin-top:20px;}
#consmkt .right ul {display:flex; flex-wrap:wrap;margin-left:7%; margin-top:40px;}
#consmkt .right ul li {width:34%; padding:50px; background:#121ca0; color:#fff; margin:5px 10px 5px 0; display:flex;}
#consmkt .right ul li > div:first-child {width:100px; display:flex; justify-content: center; align-items: center; margin-right:20px;}
#consmkt .right ul li.gray {background:#e4e4e4; color:#fff; color:#333;}
#consmkt .right ul li b {font-size:26px; font-weight:600; display:block; margin-bottom:7px;}

#info_page { background: url(../images/bg_05.jpg) no-repeat center/cover; display: flex; flex-wrap:wrap; justify-content: center; align-items: center;}
#info_page p.sec_title {font-size:39px; font-weight:700; line-height: 1.3em;  margin:35px;} 
#info_page p.txt {font-size:18px; width:80%; margin:0 auto;}
#info_page ul {display:flex; flex-wrap:wrap; justify-content: space-around; margin-top:70px;}
#info_page ul li {width:23%; margin:5px; box-sizing: border-box; padding:20px;}
#info_page ul li img {width:100%;}

#process { background: url(../images/bg_06.jpg) no-repeat center/cover; display: flex; flex-wrap:wrap; justify-content: center; align-items: center;}
#process p.sec_title {font-size:39px; font-weight:700; line-height: 1.3em; margin:35px; color:#fff;} 
#process ul {display:flex; flex-wrap:wrap; justify-content: space-around; margin-top:50px;}
#process ul li {width:30%; margin:5px; box-sizing: border-box; background:#fff; padding:35px 20px; text-align: center; margin-bottom:30px;}
#process ul li h5 {color:#121ca0; padding:12px 0;}
#process ul li img {width:90%; max-width:260px;}
#process ul li p {font-size:20px; color:#333;}
#process ul li h4 {font-size:17px; font-weight:bold; color:#121ca0;}

#foot_page {position:relative;}
#foot_page .up {text-align: center; display:flex; flex-direction: column; justify-content: center; align-items: center; height:68vh;}
#foot_page .up img {width:80%; max-width:520px;}
#foot_page .up h5 {font-size:25px; margin-top:50px;}
#foot_page .down {position:absolute; bottom:0; width:100%; height:32vh; background:#0e2e97; color:#fff; display:flex; flex-wrap:wrap; justify-content: center; align-items:center; padding:30px 0; font-size:25px;}
#foot_page .down ul {display:flex; flex-wrap:wrap; justify-content: space-around; align-items:center; width:85%;}
#foot_page .down ul li {width:30%; display:flex; justify-content: center; align-items:center; margin:10px 1%;}
#foot_page .down ul li img {display: inline-block; width:35px; margin-right:10px;}
#foot_page .down ul li:last-child {width:100%;}


/* 푸터 */
#footer {background-color: #000; padding:30px 0 60px;}
#footer h1 {color:#ccc; font-weight:700; font-size:33px; letter-spacing:-3px;}
#footer .bottom-menu a {color:#fff;}
#footer .copytxt p {line-height: 27px; color:#888;}
#footer .bottom_menu li {margin:0 20px; position:relative; color:#fff;}
#footer .bottom_menu li a { color:#ccc;}
#footer .bottom_menu li a:hover {text-decoration: underline;}
#footer .bottom_menu li::after {display: block; content:''; width:1px; height:15px; background:#fff; position:absolute; top:5px; left:-17px;}
#footer .bottom_menu li:first-child::after {display: none;}
#footer .line {width:100%; height:1px; background-color:#555; margin-top:30px;}


/* 반응형미디어쿼리 */

@media(max-width:1480px) {
	.mainslide .con .logo-img img {width:80%; max-width:300px;}
	.mainslide .swiper-slide span {font-size:33px;}
	.mainslide .swiper-slide .txt span {font-size:16px;}
	.mainslide .swiper-slide .txt {font-size:23px;}
	.h-tit, .h-tit-white {font-size:13px;}
	.title, #process p.sec_title, #info_page p.sec_title {font-size:28px;}
	#cons_cate ul {margin-top:30px;}
	#cons_cate ul li h5 {font-size:25px; margin:20px 0 15px;}
	#consmkt .right p.h-tit {margin-left:4%;}
	#consmkt .right h5.title {margin-left:4%; margin-top:10px; font-size:25px;}
	#consmkt .right ul {margin-left:4%; margin-top:40px;}
	#consmkt .right ul li {padding:30px;}
	#consmkt .right ul li b {font-size:22px;}
	#consmkt .left p {font-size:12px;}
	#process ul {margin-top:30px;}
	#process ul li h5 {padding:7px 0;}
	#process ul li p {font-size:17px;}
	#process ul li img {max-width:170px;}
	#process p.sec_title {margin:25px 0;}
	#info_page p.txt {font-size:16px;}
	#list p {font-size:15px;}
	#list p.sec_title {font-size:25px; margin-top:40px;}
	#list ul.ul_txt {font-size:17px; }
	#list ul.ul_pic li h5 {font-size:25px;}
	#list ul.ul_pic li img {max-width:90px;}
	img.img100 {width:100%;}
	#foot_page .up img {max-width:430px;}
	#foot_page .down ul li img {width:25px;}
	#foot_page .down {font-size:16px;}
	
}
@media(max-width:1024px) {
	.mainslide .swiper-slide span {font-size:29px;}
	.mainslide .swiper-slide .tit {font-size:17px; margin:30px 0;}
	.mainslide .swiper-slide .txt {font-size:19px;}
	#cons_cate ul li p {font-size:16px;}
	#list h1, #care h1, #info_page .left h1, #about h1 {font-size:25px; margin-top:20px;}
	#cons_cate h5, #care h5 {font-size:18px; margin-bottom:10px;}
	#list p {font-size:15px; margin-top:15px;}
	#list ul.ul_txt {font-size:16px; margin-top:20px; padding:15px;}
	#list ul.ul_pic li p {font-size:16px;}
	#list p.sec_title {margin-top:30px;}
	#consmkt .right ul li b {font-size:18px;}
	#consmkt .right ul p {font-size:14px;}
	#info_page ul {margin-top:30px;}
	#info_page ul li {padding:10px;}
	#about .swiper {height:400px;}
	#about .swiper-button-prev, .swiper-container-rtl .swiper-button-next {width:35px; height:35px; background: url(../images/pre2_m.png) no-repeat;}
	#about .swiper-button-next, .swiper-container-rtl .swiper-button-prev {width:35px; height:35px; background: url(../images/next2_m.png) no-repeat;}
}
@media(max-width:900px) {
	/* 섹션별 */
	.slider-01 {background-image: url(../images/bg_01_m.jpg); background-repeat: no-repeat; background-size: cover; background-position:center;}
	.slider-02 {background-image: url(../images/bg_01_2_m.jpg); background-repeat: no-repeat; background-size: cover; background-position:center;}
	.slider-03 {background-image: url(../images/bg_01_3_m.jpg); background-repeat: no-repeat; background-size: cover; background-position:center;}
	.mainslide .swiper-slide .tit {margin:40px 0 40px;}
	
	#fp-nav {display:none;}
	.title {font-size:29px;}
	.h-tit, .h-tit-white {font-size:10px;}
	/* .mainslide .con {margin-top:20%;} */
	.mainslide .con .logo-img img {width:80%; max-width:300px;}
	.mainslide .swiper-slide span {font-size:35px;}
	.fade {position: relative; opacity: 0; transition: 0.8s;}
    .fade-fast {transition: 0.05s;}
	.left, .right {width:100%;}
	#list p {font-size:9px;}
	#list ul.ul_pic li {width:32%;}
	#list ul.ul_pic li p {font-size:14px; margin-top:2px;}
	/* #list p.sec_title {font-size:15px;} */
	#list ul.ul_txt {width:90%;}
	#list ul.ul_txt li {padding:0 10px;}
	#list ul.ul_pic li h5 {font-size:16px; margin:4px 0;}
	#list ul.ul_pic {flex-wrap:wrap; margin-top:30px;}
	#list ul.ul_pic li {padding:30px 7px;}
	#list ul.ul_pic li img {max-width:80px;}
	#list p.sec_title {margin-top:25px; font-size:18px;}
	#main_page .d-flex .left img {margin-top:5%;}
	#main_page .d-flex .right .f-size22 {font-size: 17px;}
	#main_page .d-flex .right h3 {font-size:23px; margin-left:0; margin-top:0;line-height: 1.3em;}
	#main_page .d-flex .right p {font-size:12px; margin-left:0;}
	#main_page .f-size18 {font-size:16px;}
	#cons_cate { background: url(../images/bg_03_m.jpg) no-repeat center/cover;}
	#cons_cate ul li img, #cons_cate ul li {height:80%;}
	#cons_cate ul li {width:100%;}
	#cons_cate ul li.mo-no {display:none;}
	#cons_cate ul {margin-top:10px;}
	#cons_cate ul li h5 {font-size:16px; margin:10px 0 5px;}
	#cons_cate ul li p {font-size:12px;}
	#cons_cate ul li.text {padding:10px;}
	#consmkt .left {width:100%; height:200px; background: url(../images/bg_04_m.jpg) no-repeat center/cover; display: flex; flex-direction: column; justify-content:center; color:#fff; padding:6%; box-sizing:border-box;}
	#consmkt .right {width:100%; height:calc(100% -200px); background:#fff; display: flex; flex-wrap:wrap; justify-content: center;}
	#consmkt .right p.h-tit {margin-left:5%;margin-top:9%;}
	#consmkt .right h5.title {margin-left:5%; margin-top:5px; font-size:17px;}
	#consmkt .right ul { margin-top:20px;}
	#consmkt .right ul li {width:43%; padding:40px 20px; margin:3px 6px 3px 0;}
	#consmkt .right ul li > div:first-child {width:50px; margin-right:10px;}
	#consmkt .right ul li > div:first-child img {width:25px;}
	#consmkt .right ul li p {font-size:11px;}
	#consmkt .right ul li b {font-size:17px; margin-bottom:10px;}
	#consmkt .left .line {margin:2px 0;}
	#consmkt .left p {font-size:13px;}
	#info_page p.h-tit {margin: 50px 0 20px;}
	#info_page p.sec_title {font-size:23px; margin:10px;}
	#info_page p.txt {font-size:14px;}
	#info_page ul {margin-top:5px;}
	#info_page ul li {width:44%; padding:0px;}
	#info_page { background: url(../images/bg_05_m.jpg) no-repeat center/cover;}
	#process p.sec_title {font-size:23px; margin:20px;}
	#process ul {margin-top:30px;}
	#process ul li {width:45%; padding:10px; margin-bottom:10px;}
	#process ul li p {font-size:14px;}
	#foot_page .up img {max-width:300px;}
	#foot_page .up h5 {font-size:14px; margin-top:20px;}
	#foot_page .down ul li {width:100%; font-size:15px; justify-content: flex-start; padding-left:5%;}
	#foot_page .down ul li img {width:25px;}
	#foot_page .down ul {width:95%;}
}
@media(max-width:540px) {
	.title {font-size:19px;}
	.h-tit {font-size:10px;}
	/* .mainslide .con {margin-top:18%} */
	.mainslide .swiper-slide span {font-size:20px;}
	.mainslide .swiper-slide .tit {font-size:12px;}
	.mainslide .swiper-slide .txt {font-size:15px; letter-spacing: .1em;}
	.mainslide .swiper-slide .txt span {font-size:14px; padding-top:40px;}
	#consmkt .left {height:90px; flex-direction: column; color:#fff; padding:5%; box-sizing:border-box;}
	#consmkt .right {width:100%; height:calc(100% -100px); background:#fff; display: flex; flex-direction: column; }
	#consmkt .right ul {margin-top:15px;}
	#consmkt .right ul li {width:39%; padding:15px; margin:0px;}
	#consmkt .right ul li b {font-size:15px;}
	#consmkt .right p.h-tit {margin-top:4%;}
	#list h1, #care h1, #info_page .left h1, #about h1 {font-size:19px;}
	#list ul.ul_pic {margin-top:20px;}
	#list ul.ul_pic li {width:100%; padding:9px;}
	#list ul.ul_txt {font-size:14px;}
	#list p.sec_title {margin-top:15px; font-size:14px;}
	#process ul li img {max-width:120px;}
	#process p.sec_title {margin:10px;}
	#process ul li h4 {font-size:13px;}
	#process ul li p {font-size:13px;}
	#foot_page .down {font-size:15px;}
	#foot_page .down ul li {padding-left:2%;}
}
@media(max-width:344px) {
	#consmkt .right ul li {width:36%;}
}