/* HEADER */
.header_con .logo a {background: url('../images/logo_x3.png') no-repeat center / cover;}
.header_con .navigator .header-menu li.f20 a {color: #111;}
.fp-viewing-home .header_con .navigator .header-menu li a {color:#fff;}
.fp-viewing-home .header_con .logo a {background: url('../images/logo_w_x3.png') no-repeat center / cover;}
.fp-viewing-ft .header_con, .fp-viewing-esg .header_con, .fp-viewing-capabilities .header_con {background: rgb(255, 255, 255, 0.9);}

.container.main {padding-bottom: 0;}


/* ******************  메인 비주얼 ********************** */
#mainVisual {overflow:hidden; width:100%; height:100vh; position:relative;background-color:#000; z-index: 9;}
.main-visual-con, .main-visual-con .slick-list, .main-visual-con .slick-track, .main-visual-item{height:100%;}
.main-visual-con{z-index:1;}

/* 메인 비주얼 :: 이미지 */
.main-visual-item{position:relative;}
.main-visual-item .main-visual-img {width:100%; height:100%; background-size:cover !important; -webkit-transform: scale(1.3,1.3); transform: scale(1.3,1.3); -webkit-transition:transform 5000ms  ease-in-out ; transition:transform 5000ms ease-in-out; display: none;}
.main-visual-item.item1 .main-visual-img {background:#000 url('../images/main_visual_bg1.jpg') no-repeat 50% 50%;}
.main-visual-item.item2 .main-visual-img {background:#000 url('../images/main_visual_bg2.jpg') no-repeat 50% 50%;}
.main-visual-item.item3 .main-visual-img {background:#000 url('../images/main_visual_bg3.jpg') no-repeat 50% 50%;}

/* 메인 비주얼 :: 동영상 */
#mainVisual .visual_bg {width:100%;height:100%; transform: scale(1.3,1.3); backface-visibility:hidden; transition:transform 7000ms ease-in-out;    position: absolute; width: 100%; padding-bottom: 56.25%; top:0px;left:0px;right:0px;bottom:0px;}
#mainVisual .w_video {overflow:hidden;overflow-x:hidden;overflow-y:hidden;height:100%;width:100%;position:absolute;top:0px;left:0px;right:0px;bottom:0px;}

/* 메인 비주얼 :: 텍스트 */
.main-visual-item .visual_txt{position:absolute;  left:0px; top:0; width:100%; height:100%;}
.main-visual-item .text {display:flex; align-items:center; height:100%;}

.main-visual-item .visual_txt .sub_title .f16, .main-visual-item .visual_txt .main_title .f56 span, .main-visual-item .visual_txt .explanation .f28, .main-visual-item .visual_txt .visual_btn{opacity:0;}
.main-visual-item .visual_txt .sub_title {display:block; overflow: hidden; margin-bottom:40px;}

.main-visual-item .visual_txt .sub_title .f16 {font-weight:400; color:#fff;  letter-spacing: 4px;}
.main-visual-item .visual_txt .main_title .f56 {color:#fff; font-weight: 700; overflow: hidden; font-weight: 800;}
.main-visual-item .visual_txt .main_title .f56 span .gradient {background: linear-gradient(to right, #f4f588, #9bfcc2); color: transparent;  -webkit-text-fill-color: transparent; -webkit-background-clip: text; width: 100%; display: inline;}
.main-visual-item .visual_txt .explanation {display:block; overflow: hidden; margin-top: 35px;}
.main-visual-item .visual_txt .explanation .f28 {color:#fff;}

/* 메인 비주얼 :: active효과 */
.main-visual-item.active-item .main-visual-img {-webkit-transform: scale(1.0,1.0) rotate(0.002deg); transform: scale(1.0,1.0) rotate(0.002deg);}
.main-visual-item.active-item .main_title .f56 span {-webkit-animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
.main-visual-item .visual_txt .main_title .f56 span {text-shadow: 0px 4px 8px rgb(0 0 0 / 35%); -webkit-animation-delay:0.3s; animation-delay:0.3s;}
@keyframes text-active-animation {
	from {opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateY(50px); transform: translateY(50px); }
	to {opacity:1.0;filter:Alpha(opacity=100); -webkit-transform: translateY(0); transform: translateY(0);}
}

/* 메인 비주얼 :: pause,play */
.main-visual-control {position:absolute;}
.main-visual-control.numbering {top: 34vh; transform: none;}
.main-visual-control.control_btn {top: auto; bottom: 28vh;}
.main-visual-control .inner-box {display:flex; align-items:center;}
.main-visual-control .control-box {position:relative; width:80px; height:80px; }
.main-visual-control .control-box .play-btn {position:absolute; top:0; left:0; width:100%; height:100%; margin:auto; font-size: 18px;color:#fff; z-index:20;}
.main-visual-control .control-box .play-btn.pause i:before {content:"\ea3e";}
.main-visual-control .control-box .play-btn:focus {outline:none;}
.main-visual-control .circle-box {position:relative; margin:auto; width:100%; height:100%; border:5px solid #fff; border-color:rgba(255, 255, 255, 0.2); border-radius: 50%; z-index:11; box-sizing:border-box;}
.main-visual-control .circle-box svg{overflow: visible;  position:absolute; top:2px; left:-2px; width:70px; height:70px; fill:none; stroke:#fff; transform: rotate(-90deg);}
.main-visual-control .circle-box svg circle { transform-origin: center; stroke: #fff; stroke-dasharray: 360; stroke-dashoffset: 360; stroke-width: 6px;}

/* 메인 비주얼 :: 카운터 */
.main-visual-control{position:absolute; left:0; width:100%; z-index:11; font-size:12px; color:#fff; letter-spacing:-0.5px;}
.main-visual-control .counter-box {position:relative; width:auto; line-height:37px; text-align:center; }
.main-visual-control .counter-box .count-box {display:flex; align-items:center; justify-content:center; margin-left: 10px;}
.main-visual-control .counter-box .count-box .middle{width:10px; height:1px; background:rgb(255, 255, 255, 0.5); margin:0 18px}
.main-visual-control .counter-box .count-box .f18 {font-weight: 700;}
.main-visual-control .counter-box .count-box .cur-num {color:#f9f9f9}
.main-visual-control .counter-box .count-box .total-num {color: rgba(249, 249, 249, 0.4);}

/* 메인 비주얼 :: 화살표 */
.main-visual-control .slick-arrow{	position:absolute;  top:50%;transform:translateY(-50%); border:0; cursor:pointer; z-index:9; font-size:30px; color:#fff;}
.main-visual-control .slick-arrow.slick-prev{left:-20px;}
.main-visual-control .slick-arrow.slick-next{right:-20px;}

/* 메인 비주얼 :: 공지사항 */
.main-visual-notice {position:absolute; left:0; width:100%; max-width: 820px; height:100px; bottom:0; z-index:99; background:#112e57; color:#fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.main-visual-notice .inner-box {display:flex; align-items:center; height:100%;}
.main-visual-notice .tit {display:block; width:170px; height: 100%; line-height: 100px; color: #fff; font-weight: 700; background: #1d3960; text-align: center;}
.main-visual-notice .arrow-box { display:flex; margin:0 -5px;}
.main-visual-notice .arrow-box .slick-arrow {font-size:15px; color:#fff; margin:0 5px;}
.main-visual-notice .main-visual-notice-slide {width:calc(100% - 120px); padding: 0 70px 0 50px; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box; box-sizing: border-box; }
.main-visual-notice .main-visual-notice-slide .notice-item a {display:flex; align-items:center; font-size:15px; color:#fff; justify-content:space-between;}
.main-visual-notice .main-visual-notice-slide .notice-item a .notice-tit {font-weight: 400; display:block; width:calc(100% - 80px); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color: #fff;}
.main-visual-notice .main-visual-notice-slide .notice-item a .date {font-size:16px; font-weight:400; opacity:0.2; filter:Alpha(opacity=20); color:#fff;}

/* 메인 비주얼 :: 스크롤 다운 */
#mainVisual .scroll_down {position: absolute; right:0; bottom: 110px; z-index: 9;}
#mainVisual .scroll_down .txt {position: relative; color:#fff; font-size: 13px; font-weight: 700; transform: rotate( 90deg); margin: 55px 0; letter-spacing: 0px; animation: scroll_down_txt 1.5s ease-in-out infinite;-webkit-animation: scroll_down_txt 1.5s ease-in-out infinite;}
@-webkit-keyframes scroll_down_txt { 
	0% {top:50px; opacity: 0.8;}
	50% {top:60px; opacity: 1;}
	100% {top:50px; opacity: 0.8;}
} 
#mainVisual .scroll_down .icon {position: relative; top: 24px; left: 39px; animation: scroll_down_icon 1.5s ease-in-out infinite; -webkit-animation: scroll_down_icon 1.5s ease-in-out infinite;}
#mainVisual .scroll_down .icon img {width: 15px; height: 28px; }
@-webkit-keyframes scroll_down_icon { 
	0% {top:50px; opacity: 0.8;}
	50% {top:60px; opacity: 1;}
	100% {top:50px; opacity: 0.8;}
} 

/* 메인 비주얼 :: 처음들어왔을때 검은화면 */
.main-bk-bg {width: 100%; height: 100%; position: fixed; z-index: 9999999; top: 0; left: 0; opacity: 1; visibility: visible; background-color: #000;}
/********  메인 비주얼 끝 *********/


/* section2 */
.section2 {background-image: url('../images/main_company_bg.jpg'); height: 100%; background-size: cover;background-repeat: no-repeat; background-position: center;}
.section2.fp-completely .cover_img {right: 0; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: all ease 1s; transition: all ease 1s; opacity: 1;}
.section2.fp-completely .txt_wrap .f88 {-webkit-transform: translateY(0px); transform: translateY(0px); opacity: 1; -webkit-transition-delay: 1s; transition-delay: 1s;}
.section2.fp-completely .txt_wrap .f20 {-webkit-transform: translateY(0px); transform: translateY(0px); opacity: 1; -webkit-transition-delay: 1.2s; transition-delay: 1.2s;}
.section2 .cover_img {width: 100%; height: 100%; position: absolute; bottom: 0; right: 6200px; overflow: hidden; -webkit-transform: scale(15); transform: scale(15); opacity: 0;}
.section2 .cover_img .img_pc {position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
.section2 .cover_img .img_pc {width: 100%; border-top: 100vh solid #fff; border-bottom: 100vh solid #fff;}
.section2 .cover_img .img_m {display: none;}
.section2 .txt_wrap {position: absolute; top: 50%; transform: translateY(-50%); left: 0; padding: 0 16px;}
.section2 .txt_wrap .f88 {margin-bottom: 20px; -webkit-transition: all ease-out 1s; transition: all ease-out 1s; opacity: 0; -webkit-transform: translateY(100px); transform: translateY(100px); letter-spacing: 0;}
.section2 .txt_wrap .f20 {margin-top: 70px; -webkit-transition: all ease-out 1s; transition: all ease-out 1s; opacity: 0; -webkit-transform: translateY(100px); transform: translateY(100px); line-height: 36px;}
.section2 .txt_wrap .f88 span {display: block;}
.section2 .txt_wrap .f20 span {display: block; color: #555;}


/* section3 */
.main_esg_wrap {position:relative; height: 100vh;}
.main_esg_wrap .area {max-width: 1400px;}
.main_esg_wrap .title_box.pc {display: inline-block;}
.main_esg_wrap .title_box.m {display: none;}
.main_esg_wrap .txt-box {position:relative; padding:125px 0 110px; z-index:2; top: 50%; transform: translateY(-50%);}
.main_esg_wrap .txt-box .con-box {width:50%;}
.main_esg_wrap .txt-box .con-box .main-tit-box {text-align: left;}
.main_esg_wrap .txt-box .con-box .f44 {margin-bottom: 18px; letter-spacing: -3px;}
.main_esg_wrap .txt-box .con-box .f20 {color:#555;} 
.main_esg_wrap .txt-box .list-box {margin:60px -65px 0 -35px; }
.main_esg_wrap .img-box {position:absolute; left:50%; top:0; width:50%; height:100%;}
.main_esg_wrap .img-box .inner-box {position:relative; height:100%;}
.main_esg_wrap .img-box .img-wrap {position:absolute; width:100%; height:100%; background:no-repeat center / cover; transition: all 0.4s ease-in-out;}
.main_esg_list li {margin-top:10px;}
.main_esg_list li:first-child {margin-top:0;}
.main_esg_list a {position:relative; display:block; padding:25px 80px 25px 40px;}
.main_esg_list a:before {content:""; position:absolute; top:0; left:0; width:100%; height:100%; background-color: #112e57;  border-radius:10px; opacity:0; transition: all 0.3s; box-shadow:10px 15px 20px rgba(0, 0, 0,0.19);}
.main_esg_list dl {display:flex; align-items:center; position:relative; left:-10px; transition: all 0.4s; }
.main_esg_list dt {position:relative; width:83px; height:93px; margin-right:35px; }
.main_esg_list li dt {width: 90px; height: 90px; background: #f1f1f1; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
.main_esg_list li dt .icon {display: inline-block; width: 60px; height: 60px; transition: all 0.3s;}
.main_esg_list .icon {display:block; width:100%; height:100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: no-repeat center; transition: all 0.3s; }
.main_esg_list .icon.on {opacity:0;}
.main_esg_list li.on dt, .main_esg_list li:hover dt {background: #13325e;}
.main_esg_list li.item1 .icon.off {background: url('../images/main_management_ic1.png') no-repeat center / cover;}
.main_esg_list li.item2 .icon.off {background: url('../images/main_management_ic2.png') no-repeat center / cover;}
.main_esg_list li.item3 .icon.off {background: url('../images/main_management_ic3.png') no-repeat center / cover;}
.main_esg_list li.item4 .icon.off {background: url('../images/main_management_ic4.png') no-repeat center / cover;}
.main_esg_list li.item1 .icon.on {background: url('../images/main_management_ic_on1.png') no-repeat center / cover;}
.main_esg_list li.item2 .icon.on {background: url('../images/main_management_ic_on2.png') no-repeat center / cover;}
.main_esg_list li.item3 .icon.on {background: url('../images/main_management_ic_on3.png') no-repeat center / cover;}
.main_esg_list li.item4 .icon.on {background: url('../images/main_management_ic_on4.png') no-repeat center / cover;}
.main_esg_list dd {width:calc(100% - 83px - 35px);}
.main_esg_list .f24 {color: #242633 ;font-weight:500; transition: all 0.3s;}
.main_esg_list .f18 {color: #a0a0a0; font-weight:400; margin-top:2px; transition: all 0.3s;}
.main_esg_list .arrow {position:absolute; width:65px; height:65px; background-color:#fff; border-radius:50%; text-align:center; top:50%; margin-top:-30px; right:50px; opacity:0; transition: all 0.4s; }
.main_esg_list .arrow i {font-size:24px; line-height:64px; color: #112e57;}
.area {max-width: 1300px;margin: 0px auto;}
@media all and (min-width:1025px){
	.main_esg_list li a:hover dl ,
	.main_esg_list li.on a dl {left:0;}
	.main_esg_list li a:hover:before ,
	.main_esg_list li.on a:before  {opacity:1;}
	.main_esg_list li a:hover .icon.on,
	.main_esg_list li.on a .icon.on {opacity:1;}
	.main_esg_list li a:hover .icon.off ,
	.main_esg_list li.on a .icon.off {opacity:0;}
	.main_esg_list li a:hover .f24 , .main_esg_list li a:hover .f18 ,
	.main_esg_list li.on a .f24 , .main_esg_list li.on a .f18  {color: #fff;}
	.main_esg_list li a:hover .arrow , .main_esg_list li.on a .arrow  {right:50px; opacity:1;}
	.main_esg_list li a:hover .f18, .main_esg_list li.on a .f18 {opacity: 0.6;}
}


/* section4 */
.section4 .shortcut_bg {position: absolute; top: 0; z-index: -1; height: 100%; display: none;} 
.section4 .shortcut_bg img {object-fit: cover; height: 100%;}
.section4 .shortcut_wrap {display: flex; justify-content: space-between; height: 100vh; border-right: 1px solid rgb(0 0 0 / 10%); z-index: 9;}
.section4 .shortcut_wrap .shortcut {text-align: center; border-left: 1px solid rgb(0 0 0 / 10%); width: 100%; height: 100%;}
.section4 .shortcut_wrap .shortcut:hover {background: linear-gradient(to bottom, transparent, #091a2e); opacity: 0.7;z-index: 0;}
.section4 .shortcut_wrap .shortcut .text_info {position: relative; top: 50%; transform: translateY(-50%); display: flex; flex-flow: column; align-items: center; z-index: 99;}
.section4 .shortcut_wrap .shortcut .f40 {text-align: center; color:#0e2647;}
.section4 .shortcut_wrap .shortcut .f40 span {display: block;}
.section4 .shortcut_wrap .shortcut:hover .f40 {color:#fff;}
.section4 .shortcut_wrap .view_more {position: relative; opacity: 0; text-align: center; display: flex; justify-content: center; flex-flow: column; align-items: center; height: 0;}
.section4 .shortcut_wrap .shortcut:hover .view_more {opacity: 1; transition: all 0.5s; margin-top: 50px; height: auto;}
.section4 .shortcut_wrap .view_more .f18 {color:#fff; display: inline-block; vertical-align: middle; padding: 0 20px;}
.section4 .shortcut_wrap .view_more .arrow {display: inline-block; background: rgb(255, 255, 255, 0.2); border-radius: 50%; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; margin-top: 75px;}
.section4 .shortcut_wrap .view_more .arrow span {position: relative; display: inline-block; width: 7px; height: 7px; transform: rotate(135deg); margin-left: 4px; margin-bottom: 4px;}
.section4 .shortcut_wrap .view_more .arrow span::after {content: ''; position: absolute; width: 100%; height: 100%; border: 2px solid #fff; border-right: 0; border-bottom: 0;}







@media (max-width: 1600px) {
	.area {padding: 0 16px;}
	.main_esg_wrap .txt-box .list-box {margin: 40px -35px 0 0;}
	.main_esg_list a {padding: 20px 120px 20px 30px;}

	.main-visual-control .counter-box, .main-visual-item .visual_txt .text_inner, .main-visual-control .control-box, .section2 .txt_wrap {margin-left: 10vw;}
	.main_esg_wrap .txt-box .con-box .main-tit-box, .main_esg_wrap .txt-box .list-box {margin-left: 7vw;}
	.main_esg_wrap .img-box {left: 56%; width: 44%;}
	.main_esg_wrap .txt-box .con-box {width: 60%;}

}

@media (max-width: 1440px) { 
	.main-visual-control .control-box {width: 70px; height: 70px;}
	.main-visual-control .circle-box svg {width: 60px; height: 60px;}
	.section4 .shortcut_wrap .shortcut .f40 {line-height: 40px;}
}

@media (max-width: 1199px) { 
	.section2 .contents_wrapper {height: 100%;}
	.section2 .txt_wrap{left: 50px; bottom: auto; top: 300px;}
	.section2 .cover_img {width: 100%;height: 100%;position: absolute;bottom: 0;right:0; overflow: hidden;-webkit-transform: scale(1);transform: scale(1);opacity: 0;}
	.section2 .cover_img img{position: absolute; bottom: 0; right: 50px;}
	.section2 .txt_wrap .txt2{margin-top: 20px;}
	.section2 .cover_img {background-color: #fff;}
	.section2 .cover_img.m {bottom: -180px; right: -80px;}
	.section2 .cover_img .img_m { display: inline-block; max-width: 600px;}
	.section2 .txt_wrap .f20 {line-height: 34px;}
	.main_esg_wrap .txt-box .con-box .f44 {margin-bottom: 10px;}
	.main_esg_wrap .txt-box .list-box {margin: 30px -35px 0 7vw;}
	.main_esg_list li a:hover .arrow, .main_esg_list li.on a .arrow {right: 30px;}
	.section2 .txt_wrap {margin-left: 5vw;}
	.section4 .shortcut_wrap .shortcut .f40 {line-height: 38px;}
}

@media (max-width: 1024px) { 
	#mainVisual {height: 70vh;}
	.main-visual-notice {height: 65px; max-width: 100%;}
	.main-visual-notice .tit {line-height: 65px;}
	#mainVisual .scroll_down {right: -10px; bottom: 140px;}
	#mainVisual .scroll_down .icon {margin-top: -20px;}
	.main-visual-control.numbering {top: auto; bottom: 120px; left: 70px; width: auto;}
	.main-visual-item .text .text_inner {margin-bottom: 50px;}
	.main-visual-control.control_btn {bottom: 100px;}
	.main-visual-control .control-box {width: 60px; height: 60px;}
	.main-visual-control .circle-box svg {width: 50px; height: 50px;}
	.section2 {height: 600px; background: none;}
	.section2 .m_bg {background: url('../images/main_company_bg.jpg') no-repeat center / cover; display: inline-block; width: 100%; height: 100%; position: absolute; top: 0;left: 0;}
	.section2 .cover_img {background-color: transparent;}
	.section2 .cover_img.pc {display: none; background-color: #fff;}
	.section2 .txt_wrap .f88, .section2 .txt_wrap .f20, .section2 .cover_img {opacity: 1;}
	.section2 .cover_img.m {bottom: -100px; right: -50px;}
	.section2 .cover_img .img_m {max-width: 400px;}
	.section2 .txt_wrap{left: 16px; bottom: auto; top: 100px;}
	.main_esg_wrap {height: auto;}
	.main_esg_wrap .img-box {display: none;}
	.main_esg_wrap .txt-box {position: static; transform: none; padding: 90px 0 !important;}
	.main_esg_wrap .txt-box .con-box {width: 100%;}
	.main_esg_list li dt {background: #13325e;}
	.main_esg_list li .icon.off {display: none;}
	.main_esg_list li .icon.on {opacity: 1;}
	.main_esg_list a {background: #f5f5f5; border-radius: 20px; padding: 20px 30px !important;}
	.main_esg_list .arrow {opacity: 1; display: none;}
	.main_esg_list .arrow, .main_esg_list li a:hover .arrow, .main_esg_list li.on a .arrow {right: 20px !important;}
	.main_esg_wrap .txt-box .list-box {margin: 30px 0 0;}
	.main_esg_wrap .txt-box .list-box .main_esg_list {display: flex; flex-flow: wrap;}
	.main_esg_wrap .txt-box .list-box .main_esg_list li {flex: 1 1 100%; margin: 0 0 6px;}
	.main_esg_wrap .txt-box .list-box .main_esg_list li:nth-child(odd) {margin-left: 0;}
	.main_esg_wrap .txt-box .list-box .main_esg_list li:nth-child(even) {margin-right: 0;}
	.main_esg_list li dt {flex-shrink: 0; margin-right: 25px;}
	.main_esg_list dd {width: calc(100% - 83px);}
	.section4 .shortcut_wrap {flex-flow: wrap; height: auto;}
	.section4 .shortcut_bg {opacity: 0;}
	.section4 .shortcut_wrap .shortcut:nth-child(1) {background: url('../images/main_capabilities_bg_m1.jpg') no-repeat center / cover;}
	.section4 .shortcut_wrap .shortcut:nth-child(2) {background: url('../images/main_capabilities_bg_m2.jpg') no-repeat center / cover;}
	.section4 .shortcut_wrap .shortcut:nth-child(3) {background: url('../images/main_capabilities_bg_m3.jpg') no-repeat center bottom / cover;}
	.section4 .shortcut_wrap .shortcut:nth-child(4) {background: url('../images/main_capabilities_bg_m4.jpg') no-repeat center / cover;}
	.section4 .shortcut_wrap .shortcut {flex: 1 1 100%; height: 220px; border-right: 0; border-top: 1px solid rgb(0 0 0 / 10%);}
	.section4 .shortcut_wrap .shortcut {}
	.section4 .shortcut_wrap .shortcut .f40 span {display: inline;}
	.section4 .shortcut_wrap .shortcut .text_info {padding: 0 10px;}
	.section4 .shortcut_wrap .view_more .arrow {width: 24px; height: 24px; margin-top: 0 !important;}
	.section4 .shortcut_wrap .view_more, .section4 .shortcut_wrap .shortcut:hover .view_more {margin-top: 12px; height: auto;}
	.section4 .shortcut_wrap .view_more, .section4 .shortcut_wrap .shortcut:hover .view_more {opacity: 1; margin-top: 15px; flex-flow: nowrap;}
	.section4 .shortcut_wrap .view_more .f18 {color:#444; padding: 0;}
	.section4 .shortcut_wrap .view_more .arrow {margin-top: 0; width: 30px; height: 30px; flex-shrink: 0; margin-left: 10px;}
	.section4 .shortcut_wrap .view_more .arrow {background: #13325e;}
	.section4 .shortcut_wrap .shortcut:hover .f40 {color:#0e2647;}
	.section4 .shortcut_wrap .view_more .arrow span {width: 6px; height: 6px; margin-left: 3px; margin-bottom: 4px;}

	.main-visual-control .counter-box, .main-visual-item .visual_txt .text_inner, .main-visual-control .control-box, .section2 .txt_wrap {margin-left: 0;}
	.main_esg_wrap .txt-box .con-box .main-tit-box, .main_esg_wrap .txt-box .list-box {margin-left: 0 !important; margin-right: 0 !important;}
	.main_esg_wrap .txt-box .con-box .main-tit-box {text-align: center;}
}

@media (max-width: 959px) { 
	.section2 .cover_img .img_m {max-width: 300px;}
	.section2 .cover_img.m {bottom: -60px; right: -50px;}
	.main_esg_list li dt {width: 80px; height: 80px;}
	.main_esg_list li dt .icon  {width: 50px; height: 50px;}
	.section4 .shortcut_wrap .shortcut .f40 {line-height: 34px;}
}

@media (max-width: 767px) {
	.section2 {height: 500px;}
	.section2 .cover_img .img_m {max-width: 250px;}
	.section2 .cover_img.m {bottom: -60px; right: -50px;}
	.section2 .txt_wrap{left: 0; top: 15%;}
	.section2 .txt_wrap .txt2{font-size: 16px; line-height: 28px; margin-top: 15px; width: 80%; word-break: keep-all; white-space: normal;}
	.section2 .txt_wrap .txt2 br{display: none;}
	.section2 .txt_wrap .f20 span {display: inline;}
	.main-visual-notice .tit {display: none;}
	.main-visual-notice .main-visual-notice-slide {padding: 0 16px; width: 100%;}
	.main-visual-notice .main-visual-notice-slide .notice-item a .date {font-size: 15px;}
	.main_esg_wrap .txt-box .list-box .main_esg_list li {flex: 1 1 100%; margin: 0 0 6px;}
	.section4 .shortcut_wrap .shortcut {height: 200px;}
	.main_esg_wrap .txt-box {padding: 80px 0 !important;}
	.section4 .shortcut_wrap .shortcut {height: 180px;}
}

@media (max-width: 640px) {
	.section2 .cover_img .img_m {max-width: 200px;}
	.section2 .cover_img.m {bottom: -50px; right: -60px;}
	.main-visual-notice .tit {width: 100px;}
	.main_esg_list a {padding: 16px 24px;}
	.main_esg_list li dt {width: 70px; height: 70px; margin-right: 15px;}
	.main_esg_list li dt .icon {width: 45px; height: 45px;}
	.main-visual-control .counter-box .count-box .middle {margin: 0 10px;}
}

@media (max-width: 479px) {
	#mainVisual {height: 70vh;}
	.section2 {height: 450px;}
	.section2 .cover_img .img_m {max-width: 150px;}
	.section2 .cover_img.m {bottom: -30px; right: -50px;}
	.section2 .txt_wrap .txt2 {width: 100%;}
	.section4 .shortcut_wrap .shortcut .f40 {line-height: 30px;}
}

@media (max-width: 374px) {
	#mainVisual {height: 80vh;}
	.main-visual-item .visual_txt .main_title .f56 {display: inline;}
}





@media (max-height: 920px) {
	.main .section3 .main_esg_wrap .txt-box {padding: 150px 0 60px;}
	.main_esg_list li dt {width: 70px; height: 70px;}
	.main_esg_list li dt .icon {width: 45px; height: 45px;}
	.main_esg_list .arrow {width: 55px; height: 55px; margin-top: -25px;}
	.main_esg_list .arrow i {line-height: 54px;}
	.main_esg_list .f18 {margin-top: 0;}
	.main_esg_wrap .txt-box .list-box {margin: 20px -15px 0 7vw;}
	.main_esg_list a {padding: 15px 120px 15px 30px;}
	.main_esg_list li a:hover .arrow, .main_esg_list li.on a .arrow {right: 30px;}
	.main_esg_wrap .txt-box .con-box .f44 {margin-bottom: 5px;}
	.section4 .shortcut_wrap .shortcut .text_info {top: 55%;}
	.section4 .shortcut_wrap .shortcut .f40 {line-height: 40px;}
	.section4 .shortcut_wrap .shortcut:hover .view_more {margin-top: 30px;}
	.section4 .shortcut_wrap .view_more .arrow {margin-top: 50px;}
	.section2 .cover_img.m {bottom: 0;}
	

}
	

@media (min-height: 900px) {
	.main_esg_wrap .txt-box .list-box {margin: 60px -65px 0 7vw;}

}

@media (max-height: 750px) {
	.section4 .shortcut_wrap .shortcut .text_info {top: 50%;}
}



@media (min-width: 1601px) { 
	.main_esg_wrap .txt-box .list-box {margin: 60px -65px 0 -35px;}
}