@charset "utf-8"; 
/****** Reset ******/
* { 
 margin: 0; 
 padding: 0; 
 box-sizing: border-box; 
}
html,
body { 
 width: 100%; 
}
html { 
 scroll-behavior: smooth; 
}
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
form,
fieldset,
p,
button { 
 margin: 0; 
 padding: 0; 
}

body,
h1,
h2,
h3,
h4,
input,
button { 
 font-family: "Noto Sans KR", sans-serif; 
 font-size: 14px; 
 font-weight: 400; 
 letter-spacing: 0px; 
 color: #333; 
}
body { 
 background: #fff; 
 word-break: keep-all; 
 padding: 0; 
 margin: 0; 
 position: relative; 
}
/* body.noScroll { position:fixed; width:100%; height:100%; left:0; top:0; overflow:hidden; } */
img,
fieldset,
iframe { 
 border: 0 none; 
}
div { 
 display: block; 
 box-sizing: border-box; 
}
li { 
 list-style: none; 
 box-sizing: border-box; 
}
input,
select,
button { 
 vertical-align: middle; 
 font-family: "Noto Sans KR", sans-serif; 
 font-size: 14px; 
 font-weight: 300; 
 letter-spacing: 0px; 
 outline: none; 
 color: #333; 
}
textarea { 
 font-family: "Noto Sans KR", sans-serif; 
}
input { 
 letter-spacing: 0; 
}
input,
select:focus { 
 outline: none; 
}
*:focus { 
 outline: none; 
 box-shadow: none; 
}
optgroup { 
 font-weight: bolder; 
}
img { 
 vertical-align: middle; 
 width: 100%; 
}
label,
button { 
 cursor: pointer; 
}
button { 
 margin: 0; 
 padding: 0; 
 border: 0; 
 background: none; 
 cursor: pointer; 
}
a { 
 color: #333; 
 text-decoration: none; 
}
a:hover { 
 text-decoration: none; 
}
legend { 
 visibility: hidden; 
 width: 0; 
 height: 0; 
 font-size: 0; 
 line-height: 0; 
}
caption { 
 display: none; 
 overflow: hidden; 
}
table { 
 border-collapse: collapse; 
 table-layout: fixed; 
 border-collapse: collapse; 
 border-spacing: 0; 
}
table caption { 
 display: none; 
}
.clearfix:after { 
 display: block; 
 clear: both; 
 height: 0px; 
 visibility: hidden; 
 content: "."; 
}
i,
em,
address { 
 font-style: normal; 
}

.ibm { 
 font-family: "IBM Plex Sans", sans-serif; 
}
/* .a1 { font-family: "Gothic A1", sans-serif; } */
.swiperFunc { 
 display: none; 
}

.wrap { 
 position: relative; 
}
.inner { 
 position: relative; 
 width: 100%; 
 max-width: 1100px; 
 margin: 0 auto; 
 z-index: 10; 
}
.section { 
 position: relative; 
}
.section .secTitle { 
 color: #fff; 
 font-size: 40px; 
 font-weight: 800; 
 line-height: 1.3; 
 text-align: center; 
 margin-bottom: 70px; 
 position: relative; 
 z-index: 10; 
}

.gloHeader { 
 position: fixed; 
 left: 0; 
 top: 0; 
 width: 100%; 
 z-index: 100; 
 background: rgba(255, 255, 255, 0); 
 transition: 0.4s all; 
}
.gloHeader .inner { 
 display: flex; 
 justify-content: space-between; 
 align-items: center; 
 padding: 60px 0; 
}
.gloHeader .inner .logo { 
 width: 160px; 
 height: 75px; 
 transition: 0.4s all; 
}
.gloHeader .inner .logo a { 
 display: block; 
 width: 100%; 
 height: 100%; 
 background: url(../img/logo.png) no-repeat 50% 50%; 
 background-size: 100%; 
 transition: 0.4s all; 
}
.gloHeader .inner .btnDonate a { 
 display: block; 
 color: #fff; 
 font-size: 24px; 
 font-weight: 400; 
 line-height: 1; 
 padding: 17px 40px; 
 background: #d41b66; 
 box-shadow: 0px 0px 21.2px 0px rgba(0, 0, 0, 0.2); 
 border-radius: 100px; 
 transition: 0.4s all; 
}
.gloHeader.on { 
 background: rgba(255, 255, 255, 0.8); 
}
.gloHeader.on .inner { 
 padding: 20px 0; 
}
.gloHeader.on .inner .logo { 
 width: 106px; 
 height: 50px; 
}
.gloHeader.on .inner .logo a { 
 background: url(../img/logo_g.png) no-repeat 50% 50%; 
 background-size: 100%; 
}
.gloHeader.on .inner .btnDonate a { 
 font-size: 18px; 
 padding: 14px 20px; 
}

.mainVisual { 
 position: relative; 
 background: #015d59 url(../img/main_visual01_pc.png) no-repeat top center; 
 background-size: cover; 
 height: calc(100vh - 50px); 
}
.mainVisual .inner { 
 display: flex; 
 justify-content: flex-start; 
 align-items: center; 
 height: 100%; 
}
.mainVisual .inner .visualTxt { 
 color: #fff; 
}
.mainVisual .inner .visualTxt h2 { 
 font-size: 64px; 
 font-weight: 700; 
 line-height: 1.2; 
 color: #fff; 
}
.mainVisual .inner .visualTxt .desc { 
 font-size: 20px; 
 font-weight: 400; 
 line-height: 1.4; 
 margin-top: 40px; 
}

.section.vod { 
 padding: 120px 0; 
 background: #000; 
 overflow: hidden; 
}
.section.vod:after { 
 content: ""; 
 position: absolute; 
 right: -4px; 
 bottom: -60px; 
 width: 403px; 
 height: 453px; 
 background: url(../img/deco_vod_w.svg) no-repeat 50% 50%; 
 background-size: 100%; 
}
.section.vod .inner { 
 display: flex; 
 justify-content: flex-start; 
 align-items: center; 
 gap: 20px; 
}
.section.vod .inner .vodSec { 
 position: relative; 
 border-radius: 20px; 
 overflow: hidden; 
 width: 64%; 
 max-width: 897px; 
}
.section.vod .inner .vodSec:after { 
 content: ""; 
 display: block; 
 height: auto; 
 padding-bottom: 58.63%; 
 overflow: hidden; 
}
.section.vod .inner .vodSec iframe,
.section.vod .inner .vodSec video { 
 position: absolute; 
 left: 50%; 
 top: 50%; 
 transform: translate(-50%, -50%); 
 width: 100%; 
 height: 100%; 
}
.section.vod .inner .txtSec { 
 width: calc(36% - 20px); 
 text-align: right; 
 position: relative; 
 z-index: 10; 
}
.section.vod .inner .txtSec .vodTxt { 
 color: #fff; 
 font-size: 36px; 
 font-weight: 700; 
 line-height: 1.3; 
}
.section.vod .inner .txtSec .vodTxt span { 
 display: block; 
 color: #fff; 
 font-size: 42px; 
 font-weight: 800; 
}
.section.vod .inner .txtSec .desc { 
 color: #fff; 
 font-size: 18px; 
 line-height: 1.3; 
 font-weight: 400; 
 margin-top: 30px; 
}

.section.gds { 
 padding: 120px 0; 
 background: url(../img/sec02_bg.png) no-repeat 50% 50%; 
 background-size: cover; 
}
.section.gds .inner { 
 position: relative; 
}
.section.gds .inner .perGds { 
 display: block; 
 background: #fff; 
 border-radius: 0 20px 0 20px; 
 padding: 20px 20px 30px; 
 cursor: pointer; 
 transition: 0.4s all; 
}
.section.gds .inner .perGds .thumb { 
 display: block; 
 background: #fff; 
 border-radius: 0 20px 0 20px; 
 overflow: hidden; 
}
.section.gds .inner .perGds .thumb img { 
 max-width: 100%; 
}
.section.gds .inner .perGds .thumb.gray { 
 background: #eee; 
}
.section.gds .inner .perGds .gdsInfo { 
 margin-top: 30px; 
}
.section.gds .inner .perGds .gdsInfo .price { 
 color: #000; 
 font-size: 24px; 
 font-weight: 700; 
 line-height: 1; 
 margin-bottom: 20px; 
 text-align: center; 
 transition: 0.4s all; 
}
.section.gds .inner .perGds .gdsInfo .heart { 
 display: flex; 
 justify-content: center; 
 align-items: center; 
 text-align: center; 
 gap: 4px; 
 color: #d41b66; 
 font-size: 24px; 
 font-weight: 500; 
 margin: 20px 0 10px; 
 line-height: 1; 
}
.section.gds .inner .perGds .gdsInfo .heart img { 
 width: 24px; 
}
.section.gds .inner .perGds .gdsInfo .desc { 
 color: #000; 
 font-size: 18px; 
 font-weight: 400; 
 line-height: 1.5; 
 text-align: center; 
 transition: 0.4s all; 
}
.section.gds .inner .perGds .gdsInfo .desc strong { 
 font-weight: 700; 
}
.section.gds .inner .perGds:hover { 
 background: #2b9383; 
}
.section.gds .inner .perGds:hover .gdsInfo .price { 
 color: #fff; 
}
.section.gds .inner .perGds:hover .gdsInfo .desc { 
 color: #fff; 
}
.section.gds .inner .gds-paging { 
 display: none; 
}

.section.history { 
 position: relative; 
 background: #f8f8f8; 
 padding: 120px 0; 
 overflow: hidden; 
}
.section.history:after { 
 content: ""; 
 position: absolute; 
 right: 0; 
 top: 107px; 
 width: 535px; 
 height: 1199px; 
 background: url(../img/sec03_deco.svg) no-repeat 50% 50%; 
 background-size: 100%; 
}
.section.history .inner { 
 display: flex; 
 justify-content: flex-start; 
 align-items: flex-start; 
 flex-wrap: wrap; 
 gap: 30px; 
 margin-bottom: 120px; 
}
.section.history .inner .txtSec { 
 width: calc(50% - 15px); 
}
.section.history .inner .txtSec .img { 
}
.section.history .inner .cont { 
 position: absolute; 
 left: 0; 
 top: 50%; 
 width: calc(50% - 15px); 
}
.section.history .inner .cont .cTitle { 
 display: inline-block; 
 position: relative; 
 margin-bottom: 30px; 
}
.section.history .inner .cont .cTitle:after { 
 content: ""; 
 position: absolute; 
 left: 0; 
 bottom: 0; 
 width: 100%; 
 height: 16px; 
 background: rgba(0, 115, 74, 0.3); 
}
.section.history .inner .cont .cTitle em { 
 position: relative; 
 z-index: 1; 
 color: #222; 
 font-size: 40px; 
 font-weight: 700; 
}
.section.history .inner .cont .cDesc { 
 color: #222; 
 font-size: 16px; 
 font-weight: 400; 
 line-height: 1.4; 
}
.section.history .inner .imgSec { 
 width: calc(50% - 15px); 
 margin-top: 30px; 
}
.section.history .inner .imgSec .img { 
 margin-bottom: 30px; 
}
.section.history .inner .imgSec .img:last-child { 
 margin-bottom: 0; 
}

.section.history .tHis { 
 position: relative; 
 margin-bottom: 140px; 
}
.section.history .tHis:after { 
 content: ""; 
 position: absolute; 
 left: 0; 
 bottom: 10px; 
 width: calc(50% - 105px); 
 height: 1px; 
 background: rgba(0, 115, 74, 0.3); 
}
.section.history .tHis .title { 
 width: 100%; 
 max-width: 1100px; 
 margin: 0 auto; 
 color: rgba(0, 115, 74, 0.3); 
 font-size: 140px; 
 font-weight: 700; 
}
.section.history .conHisBox { 
 position: relative; 
 padding-bottom: 60px; 
}
.section.history .conHisBox .his-paging { 
 position: absolute; 
 left: 0; 
 bottom: 0; 
 width: 100%; 
 text-align: center; 
 margin: 0; 
}
.section.history .conHisBox .his-paging .swiper-pagination-bullet { 
 width: 8px; 
 height: 8px; 
 border-radius: 50%; 
 background: #d9d9d9; 
 opacity: 1; 
 margin: 0 5px; 
}
.section.history
 .conHisBox
 .his-paging
 .swiper-pagination-bullet.swiper-pagination-bullet-active { 
 background: #00734a; 
 opacity: 1; 
}

.section.history .yrHistory { 
 width: 100%; 
 max-width: 1100px; 
 margin: 0 auto; 
 position: relative; 
 padding: 0 80px; 
 overflow: hidden; 
}
.section.history .yrHistory:after { 
 content: ""; 
 position: absolute; 
 left: 0; 
 bottom: 65px; 
 width: 100%; 
 height: 3px; 
 background: #00734a; 
}
.section.history .yrHistory .his-prev { 
 position: absolute; 
 left: 0; 
 bottom: 44px; 
 width: 48px; 
 height: 48px; 
 border-radius: 50%; 
 background: #00734a; 
 z-index: 10; 
 cursor: pointer; 
}
.section.history .yrHistory .his-prev:after { 
 content: ""; 
 position: absolute; 
 left: 50%; 
 top: 50%; 
 transform: translate(-50%, -50%); 
 width: 13px; 
 height: 16px; 
 background: url(../img/ar_his.svg) no-repeat 50% 50%; 
 background-size: 100%; 
}
.section.history .yrHistory .his-next { 
 position: absolute; 
 right: 0; 
 bottom: 44px; 
 width: 48px; 
 height: 48px; 
 border-radius: 50%; 
 background: #00734a; 
 z-index: 10; 
 cursor: pointer; 
}
.section.history .yrHistory .his-next:after { 
 content: ""; 
 position: absolute; 
 left: 50%; 
 top: 50%; 
 transform: translate(-50%, -50%) rotate(180deg); 
 width: 13px; 
 height: 16px; 
 background: url(../img/ar_his.svg) no-repeat 50% 50%; 
 background-size: 100%; 
}
.perHis { 
 display: flex; 
 justify-content: flex-start; 
 align-items: stretch; 
 position: relative; 
 height: 253px; 
}
.perHis:after { 
 content: ""; 
 position: absolute; 
 left: 23px; 
 top: 0; 
 width: 6px; 
 height: 6px; 
 background: #00734a; 
 border-radius: 50%; 
}
.perHis .yrs { 
 position: relative; 
 text-align: center; 
 color: #00734a; 
 font-size: 22px; 
 font-weight: 700; 
 padding-bottom: 10px; 
 width: 52px; 
 height: 100%; 
 display: flex; 
 justify-content: center; 
 align-items: flex-end; 
}
.perHis .yrs:after { 
 content: ""; 
 position: absolute; 
 left: 50%; 
 bottom: 53px; 
 transform: translate(-50%, 0); 
 width: 20px; 
 height: 20px; 
 background: #fff; 
 border: 4px solid #00734a; 
 border-radius: 50%; 
}
.perHis .yrs:before { 
 content: ""; 
 position: absolute; 
 left: 50%; 
 top: 0; 
 transform: translate(-50%, 0); 
 width: 1px; 
 height: calc(100% - 80px); 
 background: #00734a; 
}
.perHis .perHisCont { 
 margin: 13px -10px 0 0; 
}
.perHis .perHisCont .phTitle { 
 color: #222; 
 font-size: 16px; 
 font-weight: 700; 
 margin-bottom: 7px; 
}
.perHis .perHisCont .phCon { 
 color: #222; 
 font-size: 14px; 
 font-weight: 400; 
 line-height: 1.5; 
}

.section.change { 
 position: relative; 
 background: url(../img/sec04_bg.jpg) no-repeat 50% top; 
 background-size: cover; 
 padding: 120px 0; 
}
.section.change .secTitle { 
 margin-bottom: 80px; 
}
.partChange { 
 display: flex; 
 justify-content: flex-start; 
 align-items: stretch; 
 flex-wrap: wrap; 
 gap: 30px; 
 margin-bottom: 100px; 
}
.partChange .perChange { 
 width: calc(33.33334% - 20px); 
 display: block; 
}
.partChange .perChange .headCon { 
 display: flex; 
 justify-content: center; 
 align-items: center; 
 flex-direction: column; 
 gap: 30px; 
 padding: 0 16px 20px; 
 margin-bottom: 24px; 
}
.partChange .perChange .headCon .ico { 
 display: block; 
 width: 110px; 
 height: 110px; 
}
.partChange .perChange .headCon .perHead { 
 display: flex; 
 justify-content: space-between; 
 align-items: flex-start; 
 padding-bottom: 20px; 
 border-bottom: 1px solid rgba(255, 255, 255, 0.5); 
 width: 100%; 
}
.partChange .perChange .headCon .perHead .pTitle { 
 color: #fff; 
 font-size: 24px; 
 font-weight: 600; 
}
.partChange .perChange .headCon .perHead .count { 
 display: flex; 
 justify-content: flex-start; 
 align-items: center; 
 gap: 8px; 
 color: #00b5ad; 
 font-size: 24px; 
 font-weight: 600; 
}
.partChange .perChange .headCon .perHead .count em { 
 font-size: 34px; 
 font-weight: 600; 
 line-height: 1; 
}
.partChange .perChange .headCon .pSubTxt { 
 display: flex; 
 justify-content: flex-start; 
 align-items: flex-start; 
 flex-direction: column; 
 gap: 16px; 
 width: 100%; 
}
.partChange .perChange .headCon .pSubTxt .perSub { 
 display: flex; 
 justify-content: space-between; 
 align-items: center; 
 color: #fff; 
 font-size: 18px; 
 font-weight: 500; 
 width: 100%; 
}
.partChange .perChange .headCon .pSubTxt .perSub em { 
 color: #00b5ad; 
 font-size: 26px; 
 font-weight: 600; 
}
.partChange .perChange .perDesc { 
 display: block; 
 padding: 14px 0; 
 text-align: center; 
 color: #fff; 
 font-size: 16px; 
 font-weight: 400; 
 line-height: 1; 
 border-radius: 100px; 
 border: 1px solid rgba(255, 255, 255, 0.5); 
 margin-bottom: 14px; 
}
.partChange .perChange .perDesc:last-child { 
 margin-bottom: 14px; 
}

.nowStats { 
 display: flex; 
 justify-content: flex-start; 
 align-items: stretch; 
 gap: 30px; 
 flex-wrap: wrap; 
 background: rgba(255, 255, 255, 0.1); 
 border: 1px solid #fff; 
 border-radius: 20px; 
 padding: 37px 0; 
}
.nowStats .perStats { 
 position: relative; 
 width: calc(33.33334% - 20px); 
 display: flex; 
 justify-content: center; 
 align-items: center; 
 flex-direction: column; 
 gap: 24px; 
 padding: 16px 0; 
}
.nowStats .perStats:after { 
 content: ""; 
 position: absolute; 
 right: -15px; 
 top: 0; 
 width: 1px; 
 height: 100%; 
 background: rgba(255, 255, 255, 0.5); 
}
.nowStats .perStats:last-child:after { 
 display: none; 
}
.nowStats .perStats .txt { 
 text-align: center; 
 color: #fff; 
 font-size: 18px; 
 font-weight: 700; 
 line-height: 1.3; 
}
.nowStats .perStats .txt .raTxt { 
 display: block; 
 text-align: center; 
 color: #fff; 
 font-size: 14px; 
 font-weight: 400; 
 opacity: 0.8; 
 margin-top: 8px; 
}
.nowStats .perStats .countTxt { 
 text-align: center; 
 color: #fff; 
 font-size: 28px; 
 font-weight: 700; 
 line-height: 1; 
}
.nowStats .perStats .countTxt em { 
 color: #00b5ad; 
 font-weight: 600; 
}

.yrsStats.swiper-container { 
 margin-top: 80px; 
}
.yrsStats .swiper-slide { 
 display: flex; 
 justify-content: space-between; 
 align-items: center; 
 width: 100% !important; 
 height: auto !important; 
}
.yrsStats .swiper-slide .yrsTxt { 
 position: relative; 
 padding: 0 0 40px 40px; 
}
.yrsStats .swiper-slide .yrsTxt:before { 
 content: ""; 
 position: absolute; 
 left: 0; 
 top: 0; 
 width: 3px; 
 height: 100%; 
 background: #fff; 
}
.yrsStats .swiper-slide .yrsTxt .period { 
 color: #fff; 
 font-size: 20px; 
 font-weight: 500; 
 line-height: 1; 
 margin-bottom: 20px; 
}
.yrsStats .swiper-slide .yrsTxt .location { 
 color: #fff; 
 font-size: 30px; 
 font-weight: 600; 
 line-height: 1; 
}
.yrsStats .swiper-slide .detailTxt { 
 position: relative; 
 width: 100%; 
 max-width: 540px; 
}
.yrsStats .swiper-slide .detailTxt .subject { 
 color: #fff; 
 font-size: 20px; 
 font-weight: 600; 
 margin-bottom: 10px; 
}
.yrsStats .swiper-slide .detailTxt ul { 
 display: block; 
}
.yrsStats .swiper-slide .detailTxt ul li { 
 display: block; 
 line-height: 1.5; 
 color: rgba(255, 255, 255, 0.5); 
 font-size: 16px; 
 font-weight: 400; 
}
.yrsStats .swiper-slide .detailTxt ul li strong { 
 color: rgba(255, 255, 255, 1); 
 font-weight: 700; 
}

.section.celeb { 
 position: relative; 
 background: #f8f8f8; 
 padding: 120px 0; 
 overflow: hidden; 
}
.section.celeb .deco { 
 position: absolute; 
}
.section.celeb .deco.left { 
 left: -10px; 
 top: 17%; 
 color: #ebf1ef; 
 font-size: 130px; 
 font-weight: 700; 
}
.section.celeb .deco.right { 
 right: -10px; 
 bottom: 0px; 
 color: #ebebeb; 
 font-size: 130px; 
 font-weight: 700; 
}
.section.celeb .secTitle { 
 color: #222; 
}
.section.celeb .celebBox.swiper-container { 
 overflow: visible; 
}
.section.celeb .celebBox .swiper-wrapper { 
 display: flex; 
 justify-content: flex-start; 
 align-items: stretch; 
}
.section.celeb .celebBox .swiper-slide { 
 position: relative; 
 display: flex; 
 justify-content: flex-start; 
 align-items: stretch; 
 flex-direction: column; 
 height: auto; 
}
.section.celeb .celebBox .swiper-slide .thumb { 
 padding: 0; 
 position: relative; 
 display: block; 
 width: calc(100% - 26px); 
 margin: 0 auto; 
}
.section.celeb .celebBox .swiper-slide .thumb:after { 
 content: ""; 
 display: block; 
 height: auto; 
 padding-bottom: 110%; 
}
.section.celeb .celebBox .swiper-slide .thumb img { 
 position: absolute; 
 left: 50%; 
 top: 0; 
 transform: translate(-50%, 0); 
 width: 100%; 
 height: auto; 
}
.section.celeb .celebBox .swiper-slide .celebInfo { 
 position: relative; 
 background: #fff; 
 border-radius: 10px; 
 padding: 30px; 
 box-shadow: 0px 0px 31.1px 0px rgba(0, 0, 0, 0.1); 
 margin-top: -26px; 
 height: 100%; 
}
.section.celeb .celebBox .swiper-slide .celebInfo .cName { 
 color: #222; 
 font-size: 30px; 
 font-weight: 700; 
 padding-bottom: 10px; 
 border-bottom: 1px solid #00734a; 
}
.section.celeb .celebBox .swiper-slide .celebInfo .carrier { 
 margin: 20px 0 30px; 
 color: #222; 
 font-size: 16px; 
 font-weight: 500; 
}
.section.celeb .celebBox .swiper-slide .celebInfo .desc { 
 display: flex; 
 justify-content: flex-start; 
 align-items: flex-start; 
 flex-direction: column; 
 gap: 10px; 
 color: #222; 
 font-size: 16px; 
 font-weight: 400; 
 line-height: 1.5; 
}
.section.celeb .celebBox .swiper-slide .celebInfo .desc:before { 
 content: ""; 
 width: 37px; 
 height: 25px; 
 background: url(../img/ico_quot.svg) no-repeat 50% 50%; 
 background-size: 100%; 
}

.section.graph { 
 position: relative; 
 background: url(../img/bg_graph.jpg) no-repeat center/cover; 
 background-size: cover; 
 padding: 120px 0; 
 overflow: hidden; 
}
.section.graph .inner { 
 display: flex; 
 justify-content: flex-start; 
 align-items: stretch; 
 gap: 100px; 
 flex-wrap: wrap; 
}
.perGraph { 
 width: calc(50% - 50px); 
}
.perGraph .grSec { 
 position: relative; 
 margin-bottom: 60px; 
}
.perGraph .grSec .pieGrTxt { 
 position: absolute; 
 left: 0; 
 top: 0; 
}
.perGraph .acntInfo { 
 border-radius: 10px; 
 padding: 30px 40px; 
 border: 1px solid rgba(255, 255, 255, 0.3); 
 background: rgba(255, 255, 255, 0.05); 
 box-shadow: 0px 0px 31.1px 0px rgba(0, 0, 0, 0.1); 
}
.perGraph .acntInfo ul { 
 display: flex; 
 justify-content: flex-start; 
 align-items: flex-start; 
 gap: 20px; 
 flex-direction: column; 
}
.perGraph .acntInfo ul li { 
 display: flex; 
 justify-content: space-between; 
 align-items: center; 
 gap: auto; 
 width: 100%; 
 color: #fff; 
 position: relative; 
}
.perGraph .acntInfo ul li .item { 
 font-size: 18px; 
 font-weight: 400; 
}
.perGraph .acntInfo ul li .rate { 
 font-size: 18px; 
 font-weight: 400; 
}
.perGraph .acntInfo ul li .rate.first { 
 font-size: 20px; 
 font-weight: 700; 
 position: absolute; 
 right: 0; 
 top: 50%; 
 transform: translate(0, -50%); 
}
.perGraph .acntInfo.multi { 
 display: flex; 
 justify-content: flex-start; 
 align-items: stretch; 
 gap: 40px; 
}
.perGraph .acntInfo.multi ul { 
 width: calc(50% - 20px); 
}

.section.together { 
 position: relative; 
 background: url(../img/sec07_bg.jpg) no-repeat center/cover; 
 background-size: cover; 
 padding: 145px 0; 
 overflow: hidden; 
}
.section.together .inner { 
 display: flex; 
 justify-content: center; 
 align-items: center; 
 flex-direction: column; 
 gap: 60px; 
}
.section.together .inner .txtSec { 
 text-align: center; 
}
.section.together .inner .txtSec .desc { 
 color: rgba(255, 255, 255, 0.7); 
 font-size: 24px; 
 font-weight: 500; 
 line-height: 1.3; 
 margin-bottom: 16px; 
}
.section.together .inner .txtSec .title { 
 color: #fff; 
 font-size: 48px; 
 font-weight: 800; 
 line-height: 1.2; 
}
.section.together .inner .txtSec .title span { 
 color: #ffcd03; 
}
.section.together .inner .btnTogether { 
 display: inline-block; 
}
.section.together .inner .btnTogether a { 
 display: flex; 
 justify-content: center; 
 align-items: center; 
 gap: 10px; 
 background: #fff; 
 border-radius: 100px; 
 padding: 24px 40px; 
 color: #222; 
 font-size: 24px; 
 font-weight: 700; 
 line-height: 1; 
}
.section.together .inner .btnTogether a:after { 
 content: ""; 
 display: block; 
 width: 24px; 
 height: 24px; 
 background: url(../img/btn_tail_b.svg) no-repeat 50% 50%; 
 background-size: 100%; 
}

.section.news { 
 position: relative; 
 background: #f8f8f8; 
 padding: 120px 0; 
 overflow: hidden; 
}
.section.news:after { 
 content: ""; 
 position: absolute; 
 left: 0; 
 top: 120px; 
 width: calc(50% - 460px); 
 height: 340px; 
 background: #00734a; 
}
.section.news .inner { 
 display: flex; 
 justify-content: flex-start; 
 align-items: flex-start; 
 gap: 64px; 
 flex-wrap: wrap; 
}
.section.news .inner .titleSec { 
 width: 248px; 
 height: 340px; 
 background: #00734a; 
 display: flex; 
 justify-content: center; 
 align-items: flex-start; 
 flex-direction: column; 
 flex: 0 0 auto; 
}
.section.news .inner .titleSec .subTxt { 
 color: #fff; 
 font-size: 20px; 
 font-weight: 700; 
 margin-bottom: 5px; 
 line-height: 1; 
}
.section.news .inner .titleSec .title { 
 color: #fff; 
 font-size: 42px; 
 font-weight: 800; 
 line-height: 1; 
}
.section.news .inner .titleSec .newsFunc { 
 margin-top: 30px; 
 display: flex; 
 justify-content: flex-start; 
 align-items: flex-start; 
 gap: 32px; 
}
.section.news .inner .titleSec .newsFunc .news-prev { 
 position: relative; 
 display: block; 
 width: 48px; 
 height: 48px; 
 background: #fff; 
 border-radius: 50%; 
 cursor: pointer; 
}
.section.news .inner .titleSec .newsFunc .news-prev:after { 
 content: ""; 
 position: absolute; 
 left: 50%; 
 top: 50%; 
 transform: translate(-50%, -50%) rotate(180deg); 
 width: 16px; 
 height: 18px; 
 background: url(../img/ico_dir_on.svg) no-repeat 50% 50%; 
 background-size: 100%; 
}
.section.news .inner .titleSec .newsFunc .news-prev:before { 
 content: ""; 
 position: absolute; 
 right: -16px; 
 top: 50%; 
 transform: translate(0, -50%); 
 width: 1px; 
 height: 30px; 
 background: #fff; 
 opacity: 0.5; 
}
.section.news
 .inner
 .titleSec
 .newsFunc
 .news-prev.swiper-button-disabled:after { 
 background: url(../img/ico_dir_off.svg) no-repeat 50% 50%; 
 background-size: 100%; 
}
.section.news .inner .titleSec .newsFunc .news-next { 
 position: relative; 
 display: block; 
 width: 48px; 
 height: 48px; 
 background: #fff; 
 border-radius: 50%; 
 cursor: pointer; 
}
.section.news .inner .titleSec .newsFunc .news-next:after { 
 content: ""; 
 position: absolute; 
 left: 50%; 
 top: 50%; 
 transform: translate(-50%, -50%); 
 width: 16px; 
 height: 18px; 
 background: url(../img/ico_dir_on.svg) no-repeat 50% 50%; 
 background-size: 100%; 
}
.section.news
 .inner
 .titleSec
 .newsFunc
 .news-next.swiper-button-disabled:after { 
 background: url(../img/ico_dir_off.svg) no-repeat 50% 50%; 
 background-size: 100%; 
}
.section.news .inner .newsSec { 
 width: calc(100% - 302px); 
 padding: 18px; 
 margin: 51px -18px -18px; 
}
.section.news .inner .newsSec .swiper-slide { 
 position: relative; 
 background: #fff; 
 box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.1); 
}
.section.news .inner .newsSec .swiper-slide a { 
 display: block; 
 padding: 67px 24px; 
 position: relative; 
 transition: 0.4s all; 
}
.section.news .inner .newsSec .swiper-slide a .btnMore { 
 position: absolute; 
 right: 0; 
 top: 0; 
 width: 60px; 
 height: 60px; 
 background: #00734a url(../img/ico_more.svg) no-repeat 50% 50%; 
 opacity: 0; 
 transition: 0.2s all; 
}
.section.news .inner .newsSec .swiper-slide a .date { 
 color: #00734a; 
 font-size: 14px; 
 font-weight: 700; 
}
.section.news .inner .newsSec .swiper-slide a .subject { 
 color: #222; 
 font-size: 18px; 
 font-weight: 500; 
 margin: 14px 0; 
 overflow: hidden; 
 text-overflow: ellipsis; 
 white-space: nowrap; 
}
.section.news .inner .newsSec .swiper-slide a .newsCont { 
 color: #666; 
 font-size: 14px; 
 font-weight: 400; 
 line-height: 1.5; 
 height: 63px; 
 display: -webkit-box; 
 -webkit-line-clamp: 3; 
 -webkit-box-orient: vertical; 
 overflow: hidden; 
 text-overflow: ellipsis; 
 word-break: break-word; 
}
.section.news .inner .newsSec .swiper-slide a:hover .btnMore { 
 opacity: 1; 
}
.section.news .inner .newsSec .swiper-slide a:hover:after { 
 content: ""; 
 position: absolute; 
 left: 0; 
 top: 0; 
 width: 100%; 
 height: 100%; 
 border: 2px solid #00734a; 
 box-sizing: border-box; 
}
.section.news .inner .newsSec .swiperFunc { 
 display: block; 
 margin-top: 50px; 
}
.section.news .inner .newsSec .swiperFunc .news-paging { 
 display: block; 
 text-align: center; 
}
.section.news
 .inner
 .newsSec
 .swiperFunc
 .news-paging
 .swiper-pagination-bullet { 
 width: 8px; 
 height: 8px; 
 border-radius: 50%; 
 background: #d9d9d9; 
 opacity: 1; 
 margin: 0 5px; 
}
.section.news
 .inner
 .newsSec
 .swiperFunc
 .news-paging
 .swiper-pagination-bullet.swiper-pagination-bullet-active { 
 background: #00734a; 
 opacity: 1; 
}
.section.news .inner .newsSec .swiperFunc .dir { 
 display: none; 
}

.footer { 
 position: relative; 
 background: #333; 
 padding: 50px 0; 
}
.footer .inner { 
 display: flex; 
 justify-content: flex-start; 
 align-items: flex-start; 
 gap: 40px; 
}
.footer .inner .logo { 
 width: 120px; 
 height: 56px; 
 background: url(../img/logo.png) no-repeat 50% 50%; 
 background-size: 100% auto; 
 opacity: 0.5; 
}
.footer .inner .corpInfo { 
 display: flex; 
 justify-content: flex-start; 
 align-items: flex-start; 
 flex-direction: column; 
 gap: 20px; 
}
.footer .inner .corpInfo .infoBox { 
 display: flex; 
 justify-content: flex-start; 
 align-items: flex-start; 
 flex-wrap: wrap; 
 gap: 10px 20px; 
 width: 100%; 
 max-width: 880px; 
}
.footer .inner .corpInfo .infoBox .txt { 
 color: #ccc; 
 font-size: 14px; 
 font-weight: 400; 
 position: relative; 
}
.footer .inner .corpInfo .infoBox .txt:after { 
 content: ""; 
 position: absolute; 
 right: -10px; 
 top: 50%; 
 transform: translate(0, -50%); 
 width: 1px; 
 height: 12px; 
 background: #fff; 
 opacity: 0.5; 
}
.footer .inner .corpInfo .infoBox .txt:nth-child(4):after { 
 display: none; 
}
.footer .inner .corpInfo .infoBox .txt:last-child:after { 
 display: none; 
}
.footer .inner .corpInfo .copyright { 
 color: #858585; 
 font-size: 14px; 
 font-weight: 400; 
}

.floatBtn { 
 position: fixed; 
 left: 0; 
 bottom: 34px; 
 width: 100%; 
 text-align: center; 
 z-index: 500; 
 opacity: 1; 
 transition: 0.3s all; 
}
.floatBtn.hide { 
 opacity: 0; 
 z-index: -1; 
}
.floatBtn.posAbs { 
 position: absolute; 
 bottom: -34px; 
}
/* .floatBtn.posAbs { position:absolute; bottom:auto; } */
.floatBtn a { 
 display: inline-block; 
 border-radius: 100px; 
 background: #d41b66; 
 box-shadow: 0px 0px 21.2px 0px rgba(0, 0, 0, 0.2); 
 padding: 24px 0; 
 text-align: center; 
 color: #fff; 
 font-size: 32px; 
 font-weight: 400; 
 line-height: 1; 
 width: 100%; 
 max-width: 360px; 
}