#main{background-color: #EFF8FF;}
#main .inner{width: 1520px;margin: 0 auto;}
#main .in_line{width: calc(100% - 80px);border: 2px solid #000000;border-radius: 10px;margin: 0 auto;}
#main .cont_w{overflow: hidden;}
#main .main_con01 .in_line{padding-top: 116px;padding-bottom: 110px;border-radius: 10px 10px 0 0 ;border-bottom: none;}

#main .main_con01 .inner{display: flex;justify-content: space-between;align-items: center;}
#main .main_con01 .swiper{width: 528px;}
#main .m_title h3{font-size: 60px;color: #FFFFFF;font-weight: 600;-webkit-text-stroke: 1.5px black;text-shadow: 4px 4px 0 #000;font-family: 'Ria';}
#main .m_title h3 b{color: #A1D9F1;font-family: 'Ria';}
#main .m_title p{display: block;margin-top: 30px;font-size: 20px;color: #222222;font-weight: 400;line-height: 34px;;}
#main .m_title p b{color: #429BE9;font-weight: inherit;position: relative;z-index: 5;}
#main .m_title p b:before{content: '';display: block;width: 100%;height: 15px;background-color: #D6ECFF;position: absolute;bottom: -3px;left: 0;;z-index: -1;transform: scaleX(0);transition-duration: 0.5s;}
#main .on .m_title p b:before{transform: scaleX(1);transition-delay: 1s;}
#main .main_con01{position: relative;z-index: 5;;}
#main .main_con01 .left{width: 890px;}
#main .main_con01 .list{margin-top: 40px;}
#main .main_con01 .list ul{display: flex;gap: 14px;flex-direction: column;}
#main .main_con01 .list ul li{display: flex;gap: 26px;align-items: center;}
#main .main_con01 .list ul li span{display: flex;width: 150px;height: 54px;background-color: #E1F1FE;border-radius: 8px;align-items: center;justify-content: center;font-size: 18px;color: #00438C;font-weight: 500;}
#main .main_con01 .list ul li p{font-size: 18px;color: #395144;font-weight: 500;}
#main .main_con01 .list ul li p{font-size: 18px;color: #395144;font-weight: 500;}
#main .main_con01 .txt{position: relative;padding-top: 40px;margin-top: 40px;;}
#main .main_con01 .txt:before{content: '';display: block;width: 100%;height: 1.5px;background: url(/earthday2026/img/main/dash_line.png);position: absolute;top: 0;left: 0;}
#main .main_con01 .txt ul {display: flex;flex-direction: column;gap: 30px;}
#main .main_con01 .txt ul li{display: flex;;font-size: 18px;color: #222222;line-height: 30px;;}
#main .main_con01 .txt ul li span{width: 138px;display: block;}
#main .main_con01 .txt ul li p{width: calc(100% - 138px);font-size: 18px;color: #222222;line-height: 30px;;}
#main .main_con01 .txt ul li span{font-weight: 600;}
#main .main_con01 .img{border-radius: 10px;overflow: hidden;;}
#main .main_con01 .img img{display: block;max-width: 100%}
#main .main_con01 .swiper-pagination{position: static;}
#main .main_con01 .swiper-pagination-bullet{background-color: #429BE9;width: 8px;height: 8px;margin: 0 4px;margin-top: 20px;}

	#main .main_con01 .left{transform: translateY(70px);opacity: 0;}
#main .main_con01.on .left{transform: translateY(0px);opacity: 1;transition-duration: 1s;}
#main .main_con01 .right{transform: translateY(70px);opacity: 0;}
#main .main_con01.on .right{transform: translateY(0px);opacity: 1;transition-duration: 1s;transition-delay: 0.3s;}



#main .popo{ padding-top: 140px; padding-bottom: 160px; }
#main .popo .swiper{ width: 596px }
#main .popo .list ul li{ align-items: flex-start; }
#main .popo .list ul li p{ line-height: 1.7em; margin-top: 12px;  }
#main .popo .list ul li span{ width: 220px; }
#main .popo .btn{ margin-top: 90px; }
#main .popo .in_line{ border-radius: 10px; border-bottom: 2px solid #000; }


.btn{ display: flex; justify-content: center;  }
.btn a{ width: 225px; height: 64px; display:flex; align-items: center; justify-content: center; position: relative; border-radius: 60px; background-color: #429BE9; overflow: hidden; }
.btn a ul li{ font-size: 20px; line-height: 1.5em; font-weight: 600; color:#FFFFFF; letter-spacing: -0.02em; transition: transform .5s; }
.btn a ul li:last-child{ color: #429BE9; }
.btn a ul{ height: 30px; overflow: hidden; position: relative; z-index: 1; }
.btn a:after{ content:""; display: block; width: calc(100% + 32px); aspect-ratio: 1 / 1;  position: absolute; left: 50%; top: 100%; transform: translate(-50%,0); background-color: #fff; border-radius: 50%; transition: top .5s, transform .5s; }

.btn a:hover ul li{ transform: translateY(-100%); }
.btn a:hover:after{ transform: translate(-50%,-50%); top: 50%; }

#main .popo:nth-child(1){padding-top: 140px;}
#main .popo{padding-bottom: 0px;margin-bottom: 0;padding-top: 0;}
#main .main_con01 .in_line{margin-bottom: 40px;border-bottom: 2px solid #000000;    border-radius: 10px  }
.attr_btn{position: fixed;left: 22px;top: 50%;transform: translateY(-50%);display: flex;flex-direction: column;gap: 20px;
    z-index: 99;background: #fff;padding: 25px 15px;border-radius: 30px}
.attr_btn button{display: block;background: #429BE9;width: 7px;height: 7px;border-radius: 50%;opacity: 0.3;
    text-indent: -9999px;}
.attr_btn button.on{opacity: 1}
	@media (max-width: 1560px) {
    #main .inner{width: 100%;padding: 0 20px;}
    #main .in_line{width: calc(100% - 20px);}
    #main .m_title h3{font-size: 50px;line-height: 1.2;}
    #main .m_title p{font-size: 18px;line-height: 1.5;;}
    #main .main_con01 .list ul li span {
        width: 110px;
        height: 44px;font-size: 15px;}
    #main .main_con01 .list ul li{gap:10px }
    #main .main_con01 .list ul li p{font-size: 16px;}
    #main .main_con01 .txt ul li p, #main .main_con01 .txt ul li span{font-size: 15px;line-height: 1.5;;}
    #main .main_con01 .left{width: 680px;}
    #main .main_con01 .txt ul li p br{display: none;}
    #main .main_con01 .txt ul li p{word-break: keep-all;}
        .attr_btn{padding: 15px 10px;left: 20px}
        #main .main_con01 .left{padding-left: 25px}


}
@media (max-width: 1160px) {
	#main .inner{ flex-direction: column-reverse; }
    #main .main_con01 .swiper-pagination-bullet{margin-top: 5px;width: 5px;height: 5px}
    #main .main_con01 .left{width: 100%;}
    #main .m_title h3{font-size: 40px;}
    #main .m_title h3 br{display: none;}
    #main .m_title p{font-size: 16px;margin-top: 20px;word-break: keep-all;}
    #main .m_title p br{display: none;}
    #main .main_con01 .list ul{gap: 7px}
    #main .main_con01 .txt{margin-top: 20px;padding-top: 20px;;}
    #main .main_con01 .in_line{padding: 60px 0;}
    #main .main_con01 .list{margin-top: 20px;}
    #main .main_con01 .txt ul li p, #main .main_con01 .txt ul li span{font-size: 14px;}
    #main .main_con01 .txt ul{gap: 10px}
    #main .main_con01 .inner{gap: 40px}
    #main .main_con01 .img img, #main .main_con01 .swiper{max-width: 100%;}
    #main .main_con01 .right{max-width: 100%;}
    .attr_btn button{width: 4px;height: 4px}
    .attr_btn{gap: 10px;left: 4px;padding: 10px 5px}
}
@media (max-width: 1160px) {
    #main .popo:nth-child(1) {
        padding-top: 80px;
    }
}


@media (max-width: 776px) {
    #main .main_con01 .left{padding-left: 0}
    #main .m_title h3{font-size: 32px;}
    #main .m_title h3 br{display: block;}
    #main .m_title p{font-size: 13px;}
    #main .main_con01 .list ul li{flex-direction: column;justify-content: flex-start;align-items: flex-start;}
    #main .main_con01 .list ul li span{width: 100%;justify-content: flex-start;padding: 0 10px;font-size: 13px;height: 30px;}
    #main .main_con01 .list ul li p{font-size: 13px;line-height: 1.5;;}
    #main .main_con01 .txt ul li{flex-direction: column;gap: 10px;}
    #main .main_con01 .txt ul li p, #main .main_con01 .txt ul li span{width: 100%;font-size: 13px;}
    #main .main_con01 .txt ul li span br{display: none;}
}


	
	@media (max-width: 1160px) {
		#main .popo:nth-child(1){
            padding-top: 80px;}
		#main .popo{ padding-top: 0px; padding-bottom: 0px; }
	}

	@media (max-width: 660px) {
		#main .popo .list ul li span{ width: 100%; }
		#main .popo .list ul li p{ margin-top: 0; padding-left: 10px; }
		#main .popo .btn{ margin-top: 40px; }
		.btn a ul li{ font-size: 15px; }
		.btn a ul{ height: 22px; }
		.btn a{ width: 170px; height:50px; }
		#main .popo{ padding-top: 0px; padding-bottom: 0px; }
		#main .popo .m_title h3 br { display: none; }
		#main .popo .m_title h3{ word-break: keep-all; }
        #main .popo:nth-child(1){
            padding-top: 80px;}

	}