@charset "utf-8";

.main5sAction{width:100%;height:100%;position:fixed;left:0;top:0;transition:0.3s;z-index:10;transition: all 1s cubic-bezier(0.2, 0, 0.3, 1);}
.main5sAction.closed{visibility:hidden;opacity:0;z-index:0;}
.main5sAction video{width:100vw;height:100vh;object-fit:cover;position:fixed;top:0;left:0;}
.main5sActionMask{width:100%;height:100vh;position:absolute;left:0;top:0;background:rgba(0,0,0,0.5) url('../../images/main/pattern_11.png') repeat center;}
.main5sAction button{background:url('../../images/main/x_5_w.png') no-repeat center;background-size:2.7rem;font-size:0;border:0.3rem solid rgba(255,255,255,0.5);border-radius:100%;width:7rem;height:7rem;position:absolute;left:calc(50% - 3.5rem);}
.main5sAction button:hover{border-color:rgba(255,255,255,0.8);}
.main5sAction .shLogo{width:100%;position:absolute;left:0;text-align:center;}

.main5sAction .shLogo{top:0rem;opacity:0;transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);}
.main5sAction button{bottom:0rem;opacity:0;transition: all 2s cubic-bezier(0.2, 0, 0.3, 1);}
.main5sAction.closeCutton .shLogo{opacity:1;top:10rem;}
.main5sAction.closeCutton button{opacity:1;bottom:10rem;}

.main5sActionCutton::before,
.main5sActionCutton::after{content:"";display:block;width:100%;height:49.9%;position:absolute;left:0;background:rgba(0,0,0,0.8) url('../../images/main/pattern_11.png') repeat center;transition: all 2s cubic-bezier(0.2, 0, 0.3, 1);}
.main5sActionCutton::before{top:0;}
.main5sActionCutton::after{bottom:0;}

.main5sAction.closeCutton .main5sActionCutton::before{top:-60%;}
.main5sAction.closeCutton .main5sActionCutton::after{bottom:-60%;}

.main5sAction .actionTxt{line-height:1.3;color:#FFF;width:100%;height:100%;padding:15rem 0;position:absolute;left:0;top:0);visibility:hidden;opacity:0;text-align:center;display:flex;align-items:center;justify-content:center;flex-direction:column;}
.main5sAction .actionTxt1,
.main5sAction .actionTxt2{font-family:'paper-eb';font-size:5rem;}
.main5sAction .actionTxt3{font-family:'paper-sb';font-size:2.5rem;padding-top:3rem;}
.main5sAction .actionTxt5{padding-top:6rem;}
.main5sAction .actionTxt5 a{font-family:'paper-sb';font-size:2rem;color:#FFF;padding:1.5rem 3rem;border:1px solid rgba(255,255,255,0.3);border-radius:1rem;margin:0 1rem;}
.main5sAction .actionTxt5 a:hover{background:rgba(0,0,0,0.5);color:#FFF;border-color:rgba(255,255,255,0.5)}

.main5sAction .actionTxt > div{opacity:0;filter:blur(5px);}
.main5sAction .actionTxt1{transform:translateX(-5rem);}
.main5sAction .actionTxt2{transform:translateX(5rem);}
.main5sAction .actionTxt3{transform:translateY(5rem);}
.main5sAction .actionTxt4{transform:scale(0) rotate(-45deg);}
.main5sAction .actionTxt5{transform:translateY(5rem);}

.main5sAction.activeTxt .actionTxt{visibility:visible;opacity:1;}

.main5sAction.activeTxt1 .actionTxt1{animation-name:actionTxt1;animation-duration:4s;animation-fill-mode:forwards;}
@keyframes actionTxt1{
	0%{}
	20%{opacity:1;transform:translateX(1rem);}
	100%{opacity:1;filter:blur(0px);transform:translateX(0);}
}
.main5sAction.activeTxt2 .actionTxt2{animation-name:actionTxt2;animation-duration:4s;animation-fill-mode:forwards;}
@keyframes actionTxt2{
	0%{}
	20%{opacity:1;transform:translateX(-1rem);}
	100%{opacity:1;filter:blur(0px);transform:translateX(0);}
}
.main5sAction.activeTxt3 .actionTxt3{animation-name:actionTxt3;animation-duration:3s;animation-fill-mode:forwards;}
@keyframes actionTxt3{
	0%{}
	20%{opacity:1;transform:translateY(-1rem);}
	100%{opacity:1;filter:blur(0px);transform:translateY(0);}
}
.main5sAction.activeTxt5 .actionTxt5{animation-name:actionTxt5;animation-duration:1s;animation-fill-mode:forwards;}
@keyframes actionTxt5{
	0%{}
	100%{opacity:1;filter:blur(0px);transform:translateY(0rem);}
}

@media all and (max-width:768px) {
	.main5sAction .actionTxt1,
	.main5sAction .actionTxt2{font-size:3rem;}
	.main5sAction .actionTxt3{font-size:1.8rem;}
	.main5sAction .actionTxt5{display:flex;flex-direction:column;}
	.main5sAction .actionTxt5 a{margin:1rem 0;}

	.main5sAction .shLogo img{max-width:15rem;}
	.main5sAction.closeCutton .shLogo{top:5rem;}
	.main5sAction.closeCutton button{bottom:5rem;}
}


/*슬로건*/
.slogan .txt_1{animation-name:sloganText_1;animation-duration:2s;animation-fill-mode:forwards;}
@keyframes sloganText_1{
	0%{}
	100%{opacity:1;transform:translateX(0);}
}
.slogan .txt_2{animation-name:sloganText_2;animation-duration:3s;animation-fill-mode:forwards;}
@keyframes sloganText_2{
	0%{}
	100%{opacity:1;transform:translateX(0);}
}
.wrap_visual .gradation_mask{animation-name:sloganMask;animation-duration:1s;animation-fill-mode:forwards;animation-delay:3s;}
@keyframes sloganMask{
	0%{}
	100%{opacity:1;}
}

.mainTitle_1,
.deptNewsWrap .itemA,
.deptNewsWrap .itemB,
.deptNewsWrap .more,
.mainTitle_2,
.wrap_news .list > ul > li:nth-child(1),
.wrap_news .list > ul > li:nth-child(2),
.wrap_news .list > ul > li:nth-child(3),
.mainTitle_3,
.textBanner,
.mainTitle_5,
.wrap_notice,
.mainTitle_6,
.linkService,
.mainTitle_7,
.wrap_sns1,
.wrap_sns2,
.mainTitle_4,
.shuOpinionInner .item_1,
.shuOpinionInner .item_2,
.shuOpinionInner .item_3,
.shuOpinionInner .item_4,
.shuOpinionInner .item_5,
.shuOpinionInner .item_6,
.shuOpinionInner .item_7,
.shuOpinionInner .item_8,
.shuOpinionInner .item_9,
.shuOpinionInner .item_10,
.shuOpinionInner .item_11,
.shuOpinionInner .item_12,
.shuOpinionInner .item_13,
.shuOpinionInner .item_14{opacity:0;transition: all 0.3s cubic-bezier(0.2, 0, 0.3, 1);}

.scroll .mainTitle_1,
.scroll .deptNewsWrap .itemA,
.scroll .deptNewsWrap .itemB,
.scroll .deptNewsWrap .more,
.scroll .mainTitle_2,
.scroll .wrap_news .list > ul > li:nth-child(1),
.scroll .wrap_news .list > ul > li:nth-child(2),
.scroll .wrap_news .list > ul > li:nth-child(3),
.scroll .mainTitle_3,
.scroll .textBanner,
.scroll .mainTitle_5,
.scroll .wrap_notice,
.scroll .mainTitle_6,
.scroll .linkService,
.scroll .mainTitle_7,
.scroll .wrap_sns1,
.scroll .wrap_sns2,
.scroll .mainTitle_4,
.scroll .shuOpinionInner .item_1,
.scroll .shuOpinionInner .item_2,
.scroll .shuOpinionInner .item_3,
.scroll .shuOpinionInner .item_4,
.scroll .shuOpinionInner .item_5,
.scroll .shuOpinionInner .item_6,
.scroll .shuOpinionInner .item_7,
.scroll .shuOpinionInner .item_8,
.scroll .shuOpinionInner .item_9,
.scroll .shuOpinionInner .item_10,
.scroll .shuOpinionInner .item_11,
.scroll .shuOpinionInner .item_12,
.scroll .shuOpinionInner .item_13,
.scroll .shuOpinionInner .item_14{opacity:1;}

.editMode .mainTitle_1,
.editMode .deptNewsWrap .itemA,
.editMode .deptNewsWrap .itemB,
.editMode .deptNewsWrap .more,
.editMode .mainTitle_2,
.editMode .wrap_news .list > ul > li:nth-child(1),
.editMode .wrap_news .list > ul > li:nth-child(2),
.editMode .wrap_news .list > ul > li:nth-child(3),
.editMode .mainTitle_3,
.editMode .textBanner,
.editMode .mainTitle_5,
.editMode .wrap_notice,
.editMode .mainTitle_6,
.editMode .linkService,
.editMode .mainTitle_7,
.editMode .wrap_sns1,
.editMode .wrap_sns2,
.editMode .mainTitle_4,
.editMode .shuOpinionInner .item_1,
.editMode .shuOpinionInner .item_2,
.editMode .shuOpinionInner .item_3,
.editMode .shuOpinionInner .item_4,
.editMode .shuOpinionInner .item_5,
.editMode .shuOpinionInner .item_6,
.editMode .shuOpinionInner .item_7,
.editMode .shuOpinionInner .item_8,
.editMode .shuOpinionInner .item_9,
.editMode .shuOpinionInner .item_10,
.editMode .shuOpinionInner .item_11,
.editMode .shuOpinionInner .item_12,
.editMode .shuOpinionInner .item_13,
.editMode .shuOpinionInner .item_14{opacity:1;}


.mainTitle_1{transform:translateY(-3rem);}
.scroll .mainTitle_1{opacity:1;transform:translateY(0);}

.deptNewsWrap .itemA{transform:translateX(-3rem);transition-delay:0.5s;}
.deptNewsWrap .itemB{transform:translateX(3rem);transition-delay:1s;}
.deptNewsWrap .more{transform:translateY(3rem);transition-delay:1.2s;}
.scroll .deptNewsWrap .itemA{transform:translateX(0rem);}
.scroll .deptNewsWrap .itemB{transform:translateX(0rem);}
.scroll .deptNewsWrap .more{transform:translateX(0rem);}

.mainTitle_2{transform:translateY(-3rem);}
.wrap_news .list > ul > li:nth-child(1){transform:translateY(3rem);transition-delay:1s;}
.wrap_news .list > ul > li:nth-child(2){transform:translateY(-3rem);transition-delay:1.5s;}
.wrap_news .list > ul > li:nth-child(3){transform:translateY(3rem);transition-delay:2s;}
.scroll .mainTitle_2{transform:translateY(0rem);}
.scroll .wrap_news .list > ul > li:nth-child(1){transform:translateY(0rem);}
.scroll .wrap_news .list > ul > li:nth-child(2){transform:translateY(0rem);}
.scroll .wrap_news .list > ul > li:nth-child(3){transform:translateY(0rem);}

.mainTitle_3{transform:translateY(3rem);transition-delay:2s;}
.textBanner{transform:translateY(3rem);transition-delay:2.5s;}
.scroll .mainTitle_3{transform:translateY(0rem);}
.scroll .textBanner{transform:translateY(0rem);}

.mainTitle_5{transform:translateY(-5rem);}
.wrap_notice{transform:translateY(5rem);}
.scroll .mainTitle_5{transform:translateY(0rem);}
.scroll .wrap_notice{transform:translateY(0rem);}

.mainTitle_6{transform:translateY(-5rem);}
.linkService{transform:translateY(5rem);}
.scroll .mainTitle_6{transform:translateY(0rem);}
.scroll .linkService{transform:translateY(0rem);}

.mainTitle_7{transform:translateY(-5rem);}
.wrap_sns1{transform:translateX(-5rem);transition-delay:1s;}
.wrap_sns2{transform:translateX(5rem);transition-delay:1s;}
.scroll .mainTitle_7{transform:translateY(0rem);}
.scroll .wrap_sns1{transform:translateX(0rem);}
.scroll .wrap_sns2{transform:translateX(0rem);}

.mainTitle_4{transform:scale(0.5);}
.shuOpinionInner .item_1{transform:scale(0.5);}
.shuOpinionInner .item_2{transform:scale(0.5);}
.shuOpinionInner .item_3{transform:scale(0.5);}
.shuOpinionInner .item_4{transform:scale(0.5);}
.shuOpinionInner .item_5{transform:scale(0.5);}
.shuOpinionInner .item_6{transform:scale(0.5);}
.shuOpinionInner .item_7{transform:scale(0.5);}
.shuOpinionInner .item_8{transform:scale(0.5);}
.shuOpinionInner .item_9{transform:scale(0.5);}
.shuOpinionInner .item_10{transform:scale(0.5);}
.shuOpinionInner .item_11{transform:scale(0.5);}
.shuOpinionInner .item_12{transform:scale(0.5);}
.shuOpinionInner .item_13{transform:scale(0.5);}
.shuOpinionInner .item_14{transform:scale(0.5);}

.scroll .mainTitle_4{transform:scale(1);}
.scroll .shuOpinionInner .item_1{transform:scale(1);transition-delay:0.9s;}
.scroll .shuOpinionInner .item_2{transform:scale(1);transition-delay:0.5s;}
.scroll .shuOpinionInner .item_3{transform:scale(1);transition-delay:1.6s;}
.scroll .shuOpinionInner .item_4{transform:scale(1);transition-delay:1s;}
.scroll .shuOpinionInner .item_5{transform:scale(1);transition-delay:0.6s;}
.scroll .shuOpinionInner .item_6{transform:scale(1);transition-delay:1.5s;}
.scroll .shuOpinionInner .item_7{transform:scale(1);transition-delay:1.1s;}
.scroll .shuOpinionInner .item_8{transform:scale(1);transition-delay:1.4s;}
.scroll .shuOpinionInner .item_9{transform:scale(1);transition-delay:0.7s;}
.scroll .shuOpinionInner .item_10{transform:scale(1);transition-delay:1.3s;}
.scroll .shuOpinionInner .item_11{transform:scale(1);transition-delay:1.2s;}
.scroll .shuOpinionInner .item_12{transform:scale(1);transition-delay:1.7s;}
.scroll .shuOpinionInner .item_13{transform:scale(1);transition-delay:0.8s;}
.scroll .shuOpinionInner .item_14{transform:scale(1);transition-delay:0.3s;}