@charset "utf-8"; 
 

/*********************************************** main ***********************************************/
.index small{vertical-align:baseline; font-size:.5em;}
.main-tit {text-align: center; padding:170px 0 100px;}
.main-tit h3{font-size: 60px; line-height: 1.3;}
.main-tit h3 i{font-style:normal;  vertical-align: middle; font-weight: 300; color: #5cb3e6;  }
.main-tit p{display:inline-block; color:#5cb3e6;position:relative; font-size: 18px; font-weight: 600;  margin-bottom: 10px;}  
.main-tit p::before{  width:0; height:3px; background:#5cb3e6; position:absolute; left:0; bottom:-3px; transition:color ease .6s; }
.main-tit h3 small{font-size: .5em;}
.main-tit.animation p::before{width:100%;}
.main-tit .btns{margin-top: 60px;} 
.main-tit .btn{ background: #fff; border:1px solid #ddd; color: #111; font-weight: 700; margin-right: 10px;}
.main-tit .btn i{font-weight: 500;}
.main-tit .btn:hover{background: #5cb3e6; border-color:#5cb3e6; color: #fff;}

/* sec01 */
.index .sec01{position:relative;}
.index .swiper-container-wrapper--timeline .swiper-slide {   background: #999; height:100vh; height:100lvh;      } 
.index .swiper-container-wrapper--timeline .swiper-slide .container { padding: 0;width: 100%;}
.index .swiper-container-wrapper--timeline .swiper-slide .title {color:#fff;  margin:0 auto;   position:absolute; left:5%; width:90%; top:50%; transform:translateY(-50%); text-align: center;    opacity: 0;transition: 0.5s ease 0.3s;}
.index .swiper-container-wrapper--timeline .swiper-slide .title h2{font-size: 70px;   line-height: 1.3; margin:60px 0 20px; transform:translateY(30px); opacity:0;transition:all ease 1s;} 
.index .swiper-container-wrapper--timeline .swiper-slide .title h2 sup{font-size: .5em;}
.index .swiper-container-wrapper--timeline .swiper-slide .title h2 small{font-size: .5em;}
.index .swiper-container-wrapper--timeline .swiper-slide .title p{font-size: 20px;color:rgba(255,255,255,0.5); transform:translateY(30px); opacity:0;transition:all 1s ease .5s;}
.index .swiper-container-wrapper--timeline .swiper-slide .title p b{font-weight: 600; color: #fff; font-size: 1.2em; vertical-align:baseline;}
.index .swiper-container-wrapper--timeline .swiper-slide-active .title {opacity: 1;}
.index .swiper-container-wrapper--timeline .swiper-slide-active .title h2{transform:translateY(0); opacity:1;}
.index .swiper-container-wrapper--timeline .swiper-slide-active .title p{transform:translateY(0); opacity:1;}
.index .swiper-container-wrapper--timeline .swiper-slide .image{position:absolute; left:0; top:0; width:100%; height:100%; z-index:-1; background: #000;}
.index .swiper-container-wrapper--timeline .swiper-slide .image img{position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; opacity:0.8;}
.index .swiper-container-wrapper--timeline .swiper-navi{	position:absolute; left:5%; bottom:50px; width:90%;  overflow:hidden;}
.index .swiper-container-wrapper--timeline .swiper-navi:after{	content:''; width:100%; height:2px; background:rgba(255,255,255,0.2); position:absolute; left:0; bottom:18px;     z-index: 2;}
.index .swiper-container-wrapper--timeline .swiper-pagination-progressbar {  position: relative;  margin-bottom: 20px;  background-color: transparent; height: 2px;   width: 100%;  max-width:720px;  left:-240px;}
.index .swiper-container-wrapper--timeline .swiper-pagination-progressbar-fill {  background-color: #fff;  height: 3px;  top: 2px;  transition-duration:3s !important; } 
.index .swiper-container-wrapper--timeline .swiper-pagination-custom {  position: relative; list-style: none;   padding: 0;  display: flex;  line-height: 1.66; bottom: 0; z-index: 11; width: 100%;  max-width:720px;  display: flex;}
.index .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch {  position: relative;  width: 100%;  height: 40px;  line-height: 40px;  display: block;}
.index .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch .switch-title {  position: absolute;font-weight: 400;  left: 0;    transition-delay: 0s; cursor: pointer; z-index: 1; color:rgba(255,255,255,0.5); line-height: 1.5; height:24px;}
.index .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch .switch-title:after { position: absolute;bottom: -23px; left: 0;  width: 8px;  height: 8px;  background: #fff;  border-radius: 2rem; content: ""; transition: 0.6s all ease-in-out; transition-delay: 0s;  z-index: 1; }
.index .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch .switch-title:before{  content: ""; position: absolute; bottom: -23px; left: 0;  width: 8px; height: 8px; background: rgba(255,255,255,0.2); border-radius: 2rem;  transition: 0.6s all ease-in-out;  transition-delay: 3s;  z-index: 1; 	}
.index .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch.active .switch-title:before{   transform:scale(2);	}
.index .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch.active .switch-title {  font-weight: 600; transition-delay: 0.6s; color:#fff;}
.index .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch.active .switch-title:after {  transition-delay: 0.6s;} 
.index .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch.active ~ .swiper-pagination-switch .switch-title:after {  background: #fff;}



/* intro */
.index .intro {position:absolute; top:0; left:0; width:100%; height:100vh; height:100lvh; z-index:9999; background: #fff;} 
.index .intro .skip-btn{position:absolute; bottom:30px; right:40px;  z-index:2; text-align: center;}
.index .intro .skip-btn a{display:inline-block; cursor:pointer; border:1px solid #003866; padding:8px 30px; border-radius:50px; color:#003866; transition:all ease .3s; }
.index .intro .skip-btn a:hover{background: #003866; color:#fff;}
.index .intro-sec{width:100%;  height:100vh; height:100lvh;    position:relative;} 
.index .intro-sec > div{position:absolute; left:0; top:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; overflow:hidden;} 
.index .intro-sec .title01{ font-weight: 600; color: #003866; z-index:1; }
.index .intro-sec .title01 img{height:80px;     vertical-align: baseline;}
.index .intro-sec .title01 img.white{position:absolute; left:0; top:0; opacity:0;}
.index .intro-sec .title01 span{  vertical-align:baseline;   font-weight:600; line-height:1;}
.index .intro-sec .title01 .titM{font-size: 47px; color: #003866; opacity:0; width:0; white-space: nowrap; overflow:hidden; margin-top:36px; font-size: 46px; font-weight: 700;}
.index .intro-sec .title01 .titT{position:relative; transform: translate(0, -25vh); white-space: nowrap;  text-align:center; overflow:hidden; margin-right:10px; }
.index .intro-sec .title01 .titP{ transform: translate(0, 25vh);   white-space: nowrap;text-align:center;  font-weight: 800; margin-left:10px;}
.index .intro-sec .title01 .titT .txtT{ opacity:0; color:#5cb3e6;  font-weight: 800; float:left;  margin-right:-60px;} 
.index .intro-sec .title01 .titP .txtP{ opacity:0; color:#5cb3e6;  font-weight: 800; float:left; margin-right:-60px;}   
.index .intro-sec .title01 .titT{margin-right:20px; line-height:1;}
.index .intro-sec .title01 .titP{margin-left:20px; line-height:1;}
.index .intro-sec .title01 .txtT{margin-left:0;}
.index .intro-sec .title01 .txtP{margin-right:0;}
.index .intro-sec .title01 .hiddenT .color{opacity:0; position:absolute; right:0;  }  


/* sec02 */
.index .sec02{width:100%;  height:100vh; height:100lvh;    position:relative;} 
.index .sec02 > div{position:absolute; left:0; top:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; overflow:hidden;} 
.index .sec02 .title01{ font-weight: 600; color: #003866; z-index:1; }
.index .sec02 .title01 img{height:80px;     vertical-align: baseline;}
.index .sec02 .title01 img.white{position:absolute; left:0; top:19px; opacity:0;}
.index .sec02 .title01 span{  vertical-align:baseline;   font-weight:600;}
.index .sec02 .title01 .titM{  white-space: nowrap; overflow:hidden; margin-top:36px;  color: #003866; width:470px;  font-size: 46px; font-weight: 700;}
.index .sec02 .title01 .titT{position:relative; white-space: nowrap;  text-align:center; overflow:hidden; line-height:1;  margin-right: 5px;}
.index .sec02 .title01 .titP{ white-space: nowrap;text-align:center;  font-weight: 800; line-height:1; margin-left: 5px;}  
.index .sec02 .title01 .txtT{ opacity:0; color:#5cb3e6;  font-weight: 800; float:left;  } 
.index .sec02 .title01 .txtP{ opacity:0; color:#5cb3e6;  font-weight: 800; float:left; }   
.index .sec02 .title01 .titT .txtT{position:relative; opacity:1;}
.index .sec02 .title01 .titP .txtP{position:relative; opacity:1;} 
.index .sec02 .title01 span{line-height:1;}
.index .sec02 .title01 img.white{top:0;}
.index .sec02 .image{opacity:0; background: #000;}
.index .sec02 .image img{position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover;opacity:.8;} 
.index .sec02 .title02{opacity:0;text-align: center;} 
.index .sec02 .title02 p{ color:#fff;  font-weight: 600; font-size: 30px; margin:5px 0; overflow:hidden;}
.index .sec02 .title02 p:nth-child(4){margin-top: 30px;}
.index .sec02 .title02 p span{transform:translateY(100%);}

:lang(en) .index .sec02 .title01 .titM{width:633px;}
 
 



@keyframes moveTit {
  0% { 
  } 
  100% {
    transform:translate(0, 0);
  }  
}

@-webkit-keyframes moveTit {
  0% { 
  } 
  100% {
    transform:translate(0, 0);
  }  
}
@keyframes fadeInMove{
  0% { 
  	width:0;
	opacity:0;
  } 
  100% {
    width:503px;
	opacity:1;
  }  
}
@-webkit-keyframes fadeInMove{
  0% { 
  	width:0;
	opacity:0;
  } 
  100% {
    width:503px;
	opacity:1;
  }  
}
 
@keyframes fadeInSpel {
  0% { 
  } 
  100% {
    opacity: 1;  
  }  
}
@-webkit-keyframes fadeInSpel {
  0% { 
  } 
  100% {
    opacity: 1;  
  }  
}
@keyframes fadeOutSpel {
  0% {
    opacity: 1;  
  } 
  100% {
    opacity: 0;  
  }  
}
@-webkit-keyframes fadeOutSpel {
  0% {
    opacity: 1;  
  } 
  100% {
    opacity: 0;  
  }  
}

@keyframes fadeOutAndShrink {
  0% { 
    opacity: 1; 
  } 
  25% { 
    opacity: 0; 
	width:456px;
  } 
  100% { 
    transform:translateX(-100%);
	width:60px;
    opacity: 0; 
  }
}
@-webkit-keyframes fadeOutAndShrink {
  0% { 
    opacity: 1; 
  } 
  25% { 
    opacity: 0; 
	width:456px;
  } 
  100% { 
    transform:translateX(-100%);
	width:60px;
    opacity: 0; 
  }
}





/* sec03 */
.index .sec03{ position:relative; z-index:3; background: #fff; width:100%; height:100vh; height:100lvh;    }
.index .sec03 .main-tit{position:absolute; left:0; width:100%; padding:0;top: 50%;   margin-top: -36vh;}
.index .sec03 .circle{position:absolute; left:0; top:0; width:100%; height:100%; z-index:-1; }
.index .sec03 .circle .image{width: 500px;height: 500px;border-radius: 450px;overflow: hidden;position: relative;left: 50%;top: 59%;transform: translate(-50%, -50%);  background: #011c37; }
.index .sec03 .circle img{position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover;  } 
.index .sec03 .loc{width:100%; height:100%; overflow:hidden; position:relative; display:none;}
.index .sec03 .loc .dot {width: 170px;height: 170px;  position: absolute; left:50%;top:50%;z-index:2; display:flex; align-items:center; justify-content:center;}
.index .sec03 .loc .dot:nth-child(1){transform:translate(-180px,-200px);}
.index .sec03 .loc .dot:nth-child(2){transform:translate(-260px,-120px);} 
.index .sec03 .loc .dot:nth-child(3){transform:translate(-280px,-125px);}
.index .sec03 .loc .dot:nth-child(4){transform:translate(-320px,-110px);}
.index .sec03 .loc .dot:nth-child(5){transform:translate(-280px,-80px);}
.index .sec03 .loc .dot:nth-child(6){transform:translate(-280px,5px);}
.index .sec03 .loc .dot:nth-child(7){transform:translate(-265px,13px);}
.index .sec03 .loc .dot:nth-child(8){transform:translate(-245px,18px);}   
.index .sec03 .loc .dot:nth-child(9){transform:translate(-210px,-180px);}   
.index .sec03 .loc .dotlist_01 { width: 9px; height: 9px; background-color: #fff;border-radius: 50%; position: absolute; transform: translate(-50%, -50%); top: 50%;  left: 50%;  z-index: 1;}
.index .sec03 .loc .dotlist_02 {  width: 70px; height: 70px;  border-radius: 50%;  animation: effect_zoom 1.5s ease-out infinite alternate-reverse;  background: url(/images/dot_dark.png) no-repeat center center / cover;}
.index .sec03 .loc .dot:nth-child(1) .dotlist_02:before {  content: '';  width: 170px;  height: 170px;  background: url(/images/dot_dark.png) no-repeat center center / cover; no-repeat center center / cover;border-radius: 50%; position: absolute; transform: translate(-50%, -50%);  top: 50%;  left: 50%;	z-index: -1;} 
.index .sec03 .global-tit{font-size: 60px;  color: #003866;  font-weight: 700; position:absolute; left:0; right:0; margin:0 auto; width:90%; max-width:1820px; top:50%; transform:translateY(-50%); text-align: center; }
.index .sec03 .global-tit small{font-size: .5em;}
.index .sec03 .global-tit div{overflow:hidden; line-height:1.5;}
.index .sec03 .global-tit div span{transform:translateY(100%);} 


    



@keyframes spin3D {
  from {
    transform: rotate3d(.5,.5,.5, 360deg);
  }
  to{
    transform: rotate3d(0deg);
  }
}
 
.spinner-box {
  width: 500px;
  height: 500px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: transparent;
  position:absolute; 
  left:50%; 
  top:59%; transform:translate(-50%,-50%);
  display:none;
}
 
.leo {
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 50%;
}

.blue-orbit {
	width: 520px;
	height: 520px;
  border: 1px solid #5cb3e6;
  -webkit-animation: spin3D 4s linear .2s infinite;
}

.gray-orbit {
	width: 500px;
	height: 500px;
  border: 1px solid #ddd;
  -webkit-animation: spin3D 3s linear 0s infinite;
}
 
@-webkit-keyframes effect_zoom {
  50% {
    transform: scale(1.2, 1.2);
  }
  99% {
    transform: scale(0.01, 0.01);
  }
  100% {
    transform: scale(0.01, 0.01);
  }
}
@keyframes effect_zoom {
  50% {
    transform: scale(1.2, 1.2);
  }
  99% {
    transform: scale(0.01, 0.01);
  }
  100% {
    transform: scale(0.01, 0.01);
  }
}  


/* sec04 */
.index .sec04 .main-esg{width:100%;   margin:0 auto; padding:100px 0 200px; background:url('/images/main_esg2.jpg') no-repeat center center / cover;   }
.index .sec04 .main-esg ul{display:flex; flex-wrap:wrap; justify-content:center; gap:3%; max-width:1440px; width:90%; margin:0 auto;}
.index .sec04 .main-esg ul li {width:24%; position:relative; color: #fff; text-align: center; display:flex; align-items:center; justify-content:center;}
.index .sec04 .main-esg ul li a > div{position:absolute; left:0; top:50%; width:100%; transform:translateY(-50%); z-index:1; }
.index .sec04 .main-esg ul li a > div img{width:50px;}
.index .sec04 .main-esg ul li a > img{opacity:.5;}
.index .sec04 .main-esg ul li h4{font-size: 28px; font-weight: 600; margin-top: 10px; color: #fff;}
.index .sec04 .main-esg ul li p{font-size: 18px; margin-top: 10px; font-weight: 500; color: #fff;}
 
/* sec05 */
.index .sec05{position:relative;  overflow:hidden; margin-bottom: 100px;}
.index .sec05 .main-tit{text-align:left;}
.index .sec05 .cont{display:flex; flex-wrap:wrap; justify-content:space-between; max-width:1100px; margin:0 auto; width:90%;}
.index .sec05 .cont > div{width:44%; max-width:450px;}
.index .sec05 .cont .right {margin-top: 30vh;}
.index .sec05 .card{width:100%; max-width:450px; background:#fff; border-radius:20px;  box-shadow:3px 3px 60px rgba(0,0,0,0.1); overflow:hidden; margin: 150px 0  ;  } 
.index .sec05 .card .thumb{width:100%; height:0; padding-bottom:70%; position:relative; overflow:hidden;}
.index .sec05 .card .thumb img{width:100%; height:100%; position:absolute; left:0; top:0; object-fit:cover; transition:all ease .5s;}
.index .sec05 .card .txt{padding:30px 30px 40px;}
.index .sec05 .card .sbj{font-size: 20px; font-weight: 600;}
.index .sec05 .card .desc{font-size: 15px; color: #aaa; margin-top: 20px; font-weight: 300;}
.index .sec05 .card .cate{ color:#5cb3e6; font-weight: 500; margin-right:20px; position:relative;}
.index .sec05 .card .cate:before{content:''; width:1px; height:12px; background: #ddd; position:absolute; right:-12px; top:4px;}
.index .sec05 .card:hover .thumb img{transform:scale(1.1);} 
.line-wave {
  position: absolute;
  width: 200%;
  height: 50vh;
  left: 0;
  top: 50%;
  overflow: visible;
  pointer-events: none;
  z-index: -1; 
  --move-period: 30s;
  --scale-period: 25s; 
  --color-one: #5cb3e6;
  --color-two: #5cb3e6; 
  opacity:.2;
}
.line-wave path {
  transform-origin: center;
  stroke-width: 1;
  fill: transparent;
}
.line-wave g:nth-child(1) {
  animation: move-across var(--move-period) infinite linear;
}
.line-wave g:nth-child(2) {
  animation: move-across calc(var(--move-period) * 1.2) calc(var(--move-period) * -0.33) infinite linear;
} 
.line-wave g:nth-child(1) path {
  animation: scale-y calc(var(--scale-period)) calc(var(--scale-period) * -0.2) infinite ease;
  stroke: var(--color-one);
}
.line-wave g:nth-child(2) path {
  animation: scale-y calc(var(--scale-period) * 1.2) calc(var(--scale-period) * -0.53) infinite ease;
  stroke: var(--color-two);
} 
@keyframes scale-y {
  0% {
    transform: scaleY(50%);
  }

  50% {
    transform: scaleY(-50%);
  }

  100% {
    transform: scaleY(50%);
  }
}

@keyframes move-across {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-50%);
  }
}

  
/*********************************************** responsive ***********************************************/
 
@media screen and (max-width:1440px){ 
	.index .sec03 .circle .image{width: 300px; height: 300px;    background: #01203f;} 
}
@media screen and (max-width:1280px){
	.index .swiper-container-wrapper--timeline .swiper-slide .title h2{font-size: 50px;} 
	.index .intro-sec > div{padding:0 5%;}
	.main-tit{padding:100px 0 60px;}
	.main-tit h3{font-size:40px; margin-top: 10px;}
	.index .sec02 .title02 p{font-size: 24px;}
	.index .sec03 .circle .image{width: 300px; height: 300px; background: #01203f;} 
	.index .sec03 .global-tit{font-size:40px;}
	.index .sec04 .main-esg{padding:140px 0;}  
	.index .sec05 .cont .right{margin-top: 10vh;}
	.index .sec04 .main-esg ul li h4{font-size: 20px;}   
	.index .swiper-container-wrapper--timeline .swiper-navi{ bottom:90px;}
	.index .intro .skip-btn{ bottom:90px;}
  


}


 
@media screen and (max-width:969px){  /* mobile */ 
 
	/* main */ 
	.index .swiper-container-wrapper--timeline .swiper-slide .title h2{font-size: 36px; margin:60px 0 0; } 
	.index .swiper-container-wrapper--timeline .swiper-slide .title p{font-size: 16px;}
	.index .swiper-container-wrapper--timeline .swiper-navi{font-size: 12px;bottom:120px;  }
	.index .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch{height: 34px; line-height: 34px;} 
	.index .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch .switch-title{height:18px;}
	.index .swiper-container-wrapper--timeline .swiper-pagination-progressbar{left:-33.33%;} 
	.index .intro .skip-btn{right:20px;  bottom:120px;}
 

	.main-tit{padding:80px 5% 40px;}
	.main-tit > a{font-size: 14px;}
	.main-tit h3{font-size: 28px; line-height: 1.3;}
	.main-tit h3 br{display:none;}
	.main-tit .btns{margin-top: 30px;}
	.main-tit .btn{font-size: 14px; margin-bottom:10px;} 
	
	
	.index .intro-sec .title01 img{height:30px;} 
	.index .intro-sec .title01 .txtT img{height:40px;} 
	.index .intro-sec .title01 .txtP img{height:40px;} 
	.index .intro-sec .title01 .titM{font-size: 24px; margin-top: 16px;} 
	:lang(en) .index .intro-sec .title01 .titM{font-size: 18px;}
	.index .intro-sec .title01 .titT{margin-right: 5px;}
	.index .intro-sec .title01 .titP{margin-left: 5px;}
	.index .intro .skip-btn a{padding:5px 20px;font-size: 14px;}

	.index .sec02 .title01 img{height:40px;} 
	.index .sec02 .title01 .titM{font-size: 24px; width:240px; margin-top: 16px;} 
	:lang(en) .index .sec02 .title01 .titM{width:240px; font-size: 18px;}
	.index .sec02 .title01 .titT{margin-right: 2px;}
	.index .sec02 .title01 .titP{margin-left: 2px;}
	.index .sec02 .title02 p{font-size:18px;}
   
	.index .sec03 .circle .image{width: 300px; height: 300px;} 
	.gray-orbit{width:330px; height:330px;}
	.index .sec03 .global-tit{font-size: 24px; }
	.index .sec03 .main-tit{margin-top: -30vh;}
	.index .sec04 .main-esg{padding:50px 0;}
	.index .sec04 .main-esg ul li{    width: 60%;  margin: 10px auto;}
	.index .sec04 .main-esg ul li h4{font-size: 18px;}
	.index .sec04 .main-esg ul li p{font-size: 15px; margin-top: 5px;}
	.index .sec04 .main-esg ul li > div img{max-width:30px;}
	.index .sec05{margin-bottom: 50px;}
	.index .sec05 .cont > div{width:100%; max-width:100%;}
	.index .sec05 .cont .card{margin:50px auto; width:100%; width:90%;}
	.index .sec05 .cont .left .card{margin:0 auto;}
	.index .sec05 .cont .right{margin-top: 0;}   
	.index .sec05 .card .txt{padding:24px;}
	.index .sec05 .card .sbj{font-size: 18px;}
	.index .sec05 .card .desc{font-size: 13px;}
	.index .sec05 .card{margin:30px 0;} 
	  
}
@media screen and (max-width:480px){  /* mobile */ 

	.index .swiper-container-wrapper--timeline .swiper-navi{ bottom:90px;}
	.index .intro .skip-btn{ bottom:90px;}

	.index .sec02 .title02 p:nth-child(4) { margin-top: 0; }
	.index .sec02 .title02 p:nth-child(8) { margin-top: 20px; }
	.index .sec04 .main-esg ul li a > div img{width:40px;}
}

@media screen and (max-width:375px){  /* mobile */ 

	.index .sec02 .title02 p { font-size: 16px; }

}

@media screen and (max-width:360px){  /* mobile */ 

	.index .sec03 .global-tit { font-size: 21px; }
	.main-tit h3 { font-size: 24px; }

}