/* test */
.section{
  padding: 0;
  margin:0;
}
.inner {margin: 10vh auto;  position: relative; }
.inner.center {text-align: center;}
.inner.normal {display: flex; width:100%; max-width: 192rem; height:100%; padding:10vh 8vw; margin:0 auto; flex-wrap: wrap; justify-content: space-between; align-content: space-between;}
.section-chart.pp-scrollable .inner.normal {height: unset;}
.inner.normal.video { align-content: flex-start; }
.inner figure img {width:100%; height:100%;object-fit: cover; object-position: 60% top;}
.inner figure::before {content:""; display: block; width:14vw; height:1.4vh; background-color: #005EB8; position: absolute; bottom:-1.4vh; left:0; }
.inner figure {position: relative;width: 44vw; height: 80vh; margin: auto;}
.inner figure figcaption {position: absolute; bottom:0; right:50%; margin-right:-22vw; font-size: 1.2rem; margin-bottom: -1vw;}
.inner figure p {position: absolute; bottom: 12vh; right:-11vh; text-align: left; color:#005EB8; font-size:1.56vh; font-weight: 900; line-height: 3.4vh; text-decoration-line: underline; text-decoration-thickness: 0.4vh;text-underline-offset : 0.5vh;}
.section > em,
.inner > em {position: absolute; top:3vh; right:2.5vw; z-index: 100; font-weight: 800;}
em.white {color:#fff;}
.hide {display: none;}

.center .title { position: absolute; top:-15vh; left:75vw; text-align: left; transform: rotate(90deg); transform-origin: bottom left; }
.title h1 {font-weight: 900; margin: 2vh 0;}
.title h1 img {max-width: 112%;}
.title h2 {font-size: 3vh; font-weight: 700; color:#005EB8}
.title h3 { display: flex; font-size: 2.2vh; white-space: nowrap; color:#005EB8;font-weight: 800; align-items: center;}
.title h3 strong { color:#000; margin: 0 0.6vw}
.title h3 span { color:#999; font-weight: 600;font-size: 2vh; }

.title.vw { position: absolute; top:0; left:50%; margin-left: 34vw; text-align: left; transform: rotate(90deg); transform-origin: top left; }
.title.vw h1 {font-size: 5.8vw; font-weight: 900; margin: 0.4vw 0;}
.title.vw h2 {font-size: 2vw; font-weight: 700; color:#005EB8}
.title.vw h3 { display: flex; font-size: 1.5vw; white-space: nowrap; color:#005EB8;font-weight: 800; align-items: center;}
.title.vw h3 strong { color:#000; margin: 0 0.8vw}
.title.vw h3 span { color:#999; font-weight: 600;font-size: 1.3vw; }

.s1 .topper {display: flex;}
.ybg.pp-scrollable .inner.normal {height:unset;}
.ybg.pp-scrollable .vw100 {margin-top: 4.8rem;}
.vw64 {width:64%;display: flex; flex-wrap: nowrap; flex-direction: column; justify-content: center; background: #000; }
.vw32 {width:32%;}
.flexsb {display: flex; flex-direction: column; justify-content: space-between;}
.youtube { position:relative; height:0; padding-bottom:56.25%;}
.youtube iframe {position: absolute;top:0;left:0; width:100%; height:100%;}
.normal h2{ font-size: 3.6rem; line-height: 4.8rem; color:#005EB8; font-weight: 800;}
.normal h3 {font-size: 2.4rem; line-height: 3.6rem; color:#003B78; font-weight: 800;}
.normal p {font-size: 1.5rem; line-height: 2.4rem; color:#242424; margin-bottom: 1.2rem; }
.normal p:last-child{margin-bottom: 0;}
.vw100 {display: flex;  flex-wrap: nowrap; justify-content: space-between; width:100%; }
.sign {text-align: right;}
.sign p {display: flex; justify-content: flex-end; padding-right: 0.8vw; font-size: 0.7vw;}
.sign p strong{ font-size: 1.2vw; padding-left: 0.8vw;}
.sign img {width:12vw; height: auto; margin-top: 0.6vw;}
.logo {position: absolute; bottom:5vh; left:5vw; width:10vw; height:auto;}
.w14p {width:14%;}
.w16p {width:16%;}
.w18p {width:18%;}
.w28p {width:28%;}
.w30p {width:30%;}
.w32p {width:32%;}
.w34p {width:34%;}
.w36p {width:36%;}
.w38p {width:38%;}
.w40p {width:40%;}
.w42p {width:42%;}
h3.w14p {line-height: 1.8vw; }
h3.w14p span{margin-top: 0.6vh;font-size: 0.9vw; line-height: 1.2; font-weight: 400; display: block;}
dl {display: flex; flex-wrap:wrap; font-size: 0.8vw;line-height: 1.8vw;}
dl dt{width:20%; font-weight: 600;}
dl dd {width:80%; color:#595656}
dl dd strong{ margin-right: 0.4vw;}
dl.w38p dt {width:12%}
dl.w38p dd {width:88%}

.map-wrap {width:192rem; margin:0 auto;}



.bbg .normal h2 { color: #fff; font-weight: 600; font-size: 2.8rem; line-height: 3.8rem;}
.bbg .normal p {color:#fff; text-align: center;}
.bbg .normal h2 span {font-size: 2rem; display: block; font-weight: 600;}
.bbg .normal h2 b {font-size: 3.2rem; font-weight: 900; position: relative;}
.bbg .normal h2 b::before {content:""; position: absolute; background:#013974; width:100%; height:1vh; bottom:0.3vh; left:0;z-index: -1;}
.bbg .flexsb {justify-content: start; }
.bbg .flexsb h2 {color: #72BDDF; font-size: 2.4rem; line-height: 3.6rem; font-weight: 700; margin:0 0 1.2rem}
.bbg .flexsb h2.alt {color:#fff; margin-top: 2.4rem;}
.bbg .flexsb p {text-align: left; color:#72BDDF; font-size: 1.3rem; line-height: 2rem;}
.bbg .lefter{width:10%; margin-bottom: 10vh;}
.bbg ul {display: flex; text-align: center; margin-top: 2.4rem;}
.bbg ul.cla li:first-child {flex:.8}
.bbg ul.cla li {flex:1}
.bbg ul.cla p {text-align: center; color:#fff; font-weight: bold;}
.bbg ul li {padding: 0}
.bbg ul li h3 {font-size: 2vh;color:#fff; font-weight: 500;margin-bottom: 2vh;}
.bbg ul li h3 b{font-size: 3.4vh;margin-right: .4vh;}
.bbg ul li p {font-size:1.4vh;line-height: 1.8vh; }
.bbg ul li p .tt {font-size: 1rem; line-height: 1.2rem; color:#CCDFEE; margin-top: .6rem;}
.bbg ul li p span { display: block; color:#CCDFEE;font-size: 1.2rem;line-height: 1.8rem;margin-top: .8rem}
.bbg .vw100 { position: relative; padding-top: 3.2rem; justify-content: space-between;flex-wrap: wrap}
.bbg .vw100  p {font-size: 1.6rem; line-height: 2.4rem;}
.bbg .vw100 .righter {width:90%;}
.bbg .vw100 .righter ul { margin-top: 1.2rem; height:20rem; background-image: url(../images/b_bg.png); width:100%; background-repeat: no-repeat; background-size: contain; background-position: right 70%; justify-content: space-between;}
.bbg .vw100 ul.cl img {height:100%; width:auto; margin-bottom: -1.6vh;}
.bbg .vw100 ul.cl li {padding:0 5.2rem}
.bbg .vw100 .letter {position: absolute;bottom:-1.6vh; right:-1.6vh; width:34%; height: fit-content;}

.normal.grid h3 {font-size: 1.8rem; line-height: 2.4rem; color:#005EAD;}
.normal.grid .v_top { display: flex; height:20%; justify-content: space-between;  width:100%}
.normal.grid .v_bot { display: flex; height:80%}
.normal.grid .v_top h2 {font-size: 3.6rem; line-height: 4.8rem; display: inline-block; word-wrap: normal;white-space: nowrap; }
.normal.grid .v_top p {width:64%; font-size: 1.4rem; line-height: 2.4rem; color:#005EAD; padding-top: 1rem;}
.normal.grid .v_bot.left .pic {flex:.36; }
.normal.grid .v_bot.left .pic img {margin-left: -8vw; max-width:calc(100% + 8vw);width:calc(100% + 8vw); padding-right: 1vw;height: 100%;object-fit: cover;}
.normal.grid .v_bot.left ul {flex:.64; display: flex; flex-wrap: wrap; border-top:1px solid #005EAD; }
.normal.grid .v_bot.left ul li {width:50%; padding:2vh 1vw 1.6vh; position: relative;}
.normal.grid .v_bot.left ul li::before {content:"";background-color: #005ead; width:1px; height:86%; position: absolute;right:0; top:7%;}
.normal.grid .v_bot.left ul li::after {content:"";background-color: #005ead; width:93%; height:1px; position: absolute;left:0; bottom:0;}
.normal.grid .v_bot.left ul li:nth-child(even) {padding-left: 1.8vw;}
.normal.grid .v_bot.left ul li:nth-child(even)::before{content:none}
.normal.grid .v_bot.left ul li:nth-child(even)::after {content:"";background-color: #005ead; width:93%; height:1px; position: absolute;left:7%; bottom:0;}
.normal.grid .v_bot.left ul li:last-child::after {width:107%; height:1px; position: absolute;left:-7%; bottom:0;}
.normal.grid .v_bot.left ul li h3 {color: #005EAD;}
.normal.grid .v_bot.left ul li img {position: absolute;width:4.6vh; height:auto;  top:1.4vh; right:1vh;}
.normal.grid .v_bot.left ul li p {margin-top: 2.4rem; font-size: 1.2rem; line-height: 1.8rem;;}
.normal.grid .v_bot.left ul li:nth-child(even) {border-right: 0;}
.normal.grid .v_bot.right ul.bbg {background-color:#D9EFFC;flex:.36; text-align: center;}
.normal.grid .v_bot.right ul.bbg li {height:25%;border-bottom:1px solid #005EAD; margin: 0 1.6vw; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.normal.grid .v_bot.right ul.bbg li h3 {margin: 1rem auto;}
.normal.grid .v_bot.right ul.bbg li p {color:#005EAD; font-size: 1.2rem; line-height: 1.6rem;}
.normal.grid .v_bot.right ul.bbg li:last-child {border:none;}
.normal.grid .v_bot.right ul.bbg img {width:25%; height:auto;}
.normal.grid .v_bot.right ul.bbg_con {flex:.7; margin-left: 1.2vw; border-top: 1px solid #003B78;}
.normal.grid .v_bot.right ul.bbg_con li:first-child {height:25%; color:#005EAD; padding:2vh 1vw; font-size: 1.3vh; line-height: 2.4vh;}
.normal.grid .v_bot.right ul.bbg_con li:first-child span {font-size: 1.2vh;}
.normal.grid .v_bot.right ul.bbg_con li:last-child { position: relative; height:75%; display: flex; align-items: stretch; flex-direction: column; justify-content: space-between;}
/* .normal.grid .v_bot.right ul.bbg_con li:last-child::after {content: "\e93e"; display: block; font-size: 1vw; font-family: xeicon; color: #FFF107; position: absolute; left: 22%; top: -.74vh;} */
.normal.grid .v_bot.right ul.bbg_con .graph {max-width: 100%; height:auto; object-fit: contain;}
.normal.grid .v_bot.right ul.bbg_con .graph_desc {padding:0 1vw 2vh; border-bottom: 1px solid #005ead; }
.normal.grid .v_bot.right ul.bbg_con .graph_desc p {font-size: 1.2rem; line-height: 1.8rem;}
.normal.grid h2 strong {display: block;position: relative;}
.normal.grid h2 strong::before {content:""; position: absolute; background:#FFF107; width:100%; height:1.6vh; bottom:.6vh; left:0;z-index: -1;}


.normal.grid .full .v_top {position: relative;}
.normal.grid .full .v_top p {width:80%;}
.nurture {display: flex; flex-direction: row; gap:2vw}
.nurture li {flex:1}
.nurture p {line-height: 2.2vh; margin-bottom: 1vh;}
.nurture h3 {margin-bottom: 2vh;}
.nurture li.center {flex:2}
.nurture li.center .ti {width:90%;}
.nurture li.topper .ti {margin-top: -34%;}
.nurture li .ti {width:80%; height: auto;}
.nurture li .id {width:5vw; height: auto; margin-top: 2vh; margin-bottom: 3vh;}
.nurture li:last-child {flex:.8}
.nurture li:last-child .ti {width:100%; margin-top: -43%;}
.popup { display: block; font-family: xeicon; font-size: 1.8vw; text-align: center; line-height: 2.4vw; width: 2.4vw; height: 2.4vw; border-radius: 100%; background-color: #FEEBAA; color: #000;}
.inner img.rightop {position: absolute;top:-1vh; right:0; width:16vw; height:auto; z-index: -1;}

.complement {display: flex; justify-content: space-evenly; }
.complement ul {display: flex; gap:1vw; width:100% }
.complement ul li {text-align: center; flex: 1; color:#005EAD; font-weight: 500; }
.complement ul li span { display: block; border-top: 1px solid #005EAD;padding-top: 1.2vh; margin-top: 1.2vh; color:#000; font-size: 2vh;}
.grid .comple {width:100%; justify-content: space-between;}
.grid .comple .half{position: relative; width:48%}
.grid .comple .half img {position: absolute;left:28%; width:72%; height:auto; z-index: -1;}

.comple .upper {position: relative;}
.grid .comple .upper .bg { position: absolute;top:0; right:0;  width:72%; height:100%; background-size: cover; background-repeat: no-repeat; background-image: url(../images/p_a_01.png); z-index: -1;}
.grid .comple .upper .bg.a2 {background-image: url(../images/p_a_02.png)}


.grid .comple .half div {width:100%; display: flex; overflow: hidden; height:54%;}


.grid .comple .half .lower {height:46%;width:100%; margin-top: 2.8rem;}
.grid .comple .half .lower blockquote {width:28%;}
.grid .comple .half .lower p {width:72%; line-height: 2.4vh;}
.grid .comple h3 {position: relative; }
.site-main .section.gbg h2::before,
.grid .comple h3::before {content:""; position: absolute; display: block; width:9.3rem; height:1px; background-color: #72BDDF; top:5.6rem; left:0;}
.site-main .section.gbg h2 span,
.grid .comple h3 span {display: block; font-size: 1.5rem; font-weight: 400;margin-top: 6.6rem; margin-bottom: 1.6rem;color:#72BDDF; font-weight: bold; }
.site-main .section.gbg h2 span {line-height: 2rem;}
blockquote {font-size: 1.4rem; line-height: 2.4rem; color:#72BDDF; padding-right: 5%;}
blockquote span {display: block; font-size:1.2rem; margin-top: 0.9vh; line-height: 1.8vh;}

.site-main .section.gbg {background-image: url(../images/gbg.jpg);}
.site-main .section.gbg h2 {color:#00356F;margin-bottom: 2.4rem;}
.site-main .section.gbg p {color:#000; margin-bottom: 0;}
.site-main .section.gbg p.desc {color: #000; line-height: 1.8rem; font-size: 1.2rem; margin-top: 2rem;width:100%;}
.site-main .section.gbg .full {justify-content: space-around;}
.site-main .section.gbg img {width:100%; height: auto;}
.site-main .section.gbg .lefter{ width:36%; display: flex; align-items: center;}
.site-main .section.gbg .righter{ width:50%; display: flex; flex-direction: column; justify-content: space-around;}
.site-main .section.gbg .righter ul {display: flex; flex-direction: row;}
.site-main .section.gbg .righter ul li {flex: 1; text-align: center;}
.site-main .section.gbg .righter ul.q1 li:nth-child(2) {flex:2;}
.site-main .section.gbg .righter ul.q1 {gap:1vw}
.site-main .section.gbg .righter ul.q1 li { border-top:0.2vh solid #00356F; padding-top: 2vh;}
.site-main .section.gbg .righter ul.q1 li b { display: block; color:#00356F; font-size: 1.6vh; margin-bottom: 1.6vh;}
.site-main .section.gbg .righter ul.q1 li p {font-size: 2.6vh; font-weight:800; text-align: center; color:#00356F;}
.site-main .section.gbg .righter ul.q1 li p span {font-size: 2.2vh; font-weight: 500;}
.site-main .section.gbg .righter .q2 ul {padding:5% 2%;}
.site-main .section.gbg .righter .q2 ul li {font-size: 1.4rem; line-height: 2.4rem;}

.gbg .grid .half {align-content: space-between;}
.gbg .topper {width:100%; display: flex; margin-bottom: 4.8rem;overflow: hidden;}
.gbg .topper .bg3 {width:60%; position: relative; height: 36rem;}
.gbg .topper .bg3 img {position: absolute; top: 0; right: 3%; z-index: -1; width: 70%; height: 100%; object-fit: cover;}
.gbg .topper ul {display: flex; width:40%; align-items: flex-end;gap: 1rem;}
.gbg .topper p { display: flex; width:40%; padding-left: 4.8rem;align-items: center;    }
.gbg .lower {width:100%; display: flex;align-items: flex-end;}
.gbg .lower blockquote{width:16%; padding:0 3% 0 0;}
.gbg .lower p{width:44%; padding-right: 5%;}
.gbg .lower .table {width:40%}
.gbg .lower .table table {width:100%}
.gbg .lower .table table {font-size: 1.2rem;}
.gbg .info-wrap.active .info {max-height: 80vh;}
.gbg .info-wrap .complement {gap:4.8rem}
.gbg .info-wrap .complement table tbody th {text-align: center; font-size: 1.3rem;}
.gbg blockquote {text-align: left; color:#00356F; width:100%; padding: 0 0 0 3%; margin: 0 auto; font-weight: 600;}
.gbg blockquote span {font-weight: 400; font-size: 1.2rem;margin-top: 1.2rem;}
.gbg blockquote + ul {display: flex; gap:1vh}
.gbg blockquote + ul li {flex:1;}
table { font-size: 1.2rem; line-height: 1.6rem;border-top:1px solid #005EAD;}
table caption {text-align: right; padding-bottom: .4rem; font-size: 1rem; color:#777}

table th, table td {border-bottom:1px solid #005EAD; padding: .4rem .1rem; vertical-align: middle;}
table th {color:#00356F; font-size: 1.2rem;}
.gbg table th:first-child {text-align: left; padding:0 3rem}
.gbg .lower table tr:last-child {font-weight: bold;}
.complement table tbody th {font-weight: bold;color:#005ead}
.complement table td:last-child {text-align: right;}

table.ct {width:38%; margin-bottom: 32rem;}
table.ct thead th {background-color: #005ead; color:#fff;margin-right: .2rem; border-right: .1rem solid #fff;}
table.ct.alt thead th {background-color: #00356F;}
.chart-top-wrap h2.dark {color:#00356F}
table.ct thead th:first-child {width:60%;}
table.ct thead th:last-child {width:22%;}
table.ct tbody th  {text-align: left; text-indent: 1.8rem; color:#585858}
table.ct tbody th strong {display: block; text-indent: 0; color:#005EAD}
table.ct tbody th em {display: block; text-indent: .9rem; color:#005EAD}
table.ct td, table.ct th {padding:.4rem .1rem ;font-size: 1rem; line-height: 1.4rem;}
table.ct td strong {color:#005ead;}
table.ct td {font-size: 1rem; letter-spacing:-.1rem}
table.ct tbody tr:last-child * {font-size: 1.2rem!important; border:none; line-height: 2.4rem; padding-bottom: 7vh; vertical-align: top;}


.report .full {justify-content: space-between;}
.report .full div {width:31%; position: relative;}
.report .full div h2 {position: absolute;top:0; left:0;}
.report table {border-top-width: 3px; margin-top: 2.4rem;  width: 100%;margin-top: 6rem;}
.report .full div:first-child table {margin-bottom: 10vh;}
.report table caption {text-align: right; font-size: 1.2rem;}
.report table thead th {font-weight: 800; font-size:1.3rem;padding:.6rem 1.2rem}
.report table tbody th, .report table tbody td {font-size: 1.2rem; padding:.6rem 1.2rem; text-wrap:nowrap}
.report table tbody th {width:24%; text-align:left; text-indent: 1.2rem; color:#585858;}
.report table tbody th h3 {font-size: 1.2rem; text-indent: 0; letter-spacing: -.1rem; line-height: 1.6rem;}
.report table tbody th strong {text-indent:.4rem;text-wrap: nowrap; color:#000;display: block;}
.report table tbody th em {color:#000;display: block; text-indent: .8rem;}
.report table tbody .ti {background-color: rgba(255, 255, 255, .5); color:#000; font-weight: 900}
.report h3.sjt {margin: 2.4rem 0 1.6rem; font-size: 1.4rem; color:#005EAD}
.report h3.sjt + p {font-size: 1.2rem; line-height: 2.2rem; color:#000; margin-bottom: 1.6rem;}
.report ul {margin-bottom: 2.4rem;}
.report ul li {margin-bottom: .4rem; font-size: 1.1rem; line-height: 1.8rem;padding-left: 1.2rem;position: relative; }
.report ul li::before {content:""; display: block; position: absolute; top: 0.8rem; left: 0; width: 0.6rem; height: 0.2rem; background-color: #999;}
.report p.sjp {font-size: 1.2rem; line-height: 1.8rem; }
.report .full .sj {    display: flex; width: 100%; gap: 1rem; align-items: center; justify-content: flex-end; margin: 3.2rem 0 8vh; }
.report .full .sj p {font-size: 1.2rem;}
.report .full .sj img {width:9.2rem; height:auto; margin-right: -.8rem;}


.happy .inner.normal.grid {flex-direction: column; height: unset;}
.happy .normal.grid .v_top { height:50%; }
.happy .normal.grid .v_top h2 {flex:.15}
.happy .normal.grid .v_top .img {flex:.5; align-self: flex-end;}
.happy .normal.grid .v_top .img img {height: auto;}
.happy .normal.grid .v_top p {flex:.35;align-self: flex-end; padding-left: 3vw; color:#000;}
.happy .normal.grid .v_bot.box { display: block; border:1px solid #005EAD; padding: 2.4rem ; height:unset}
.happy .normal.grid .v_bot.box h3 {display: block; float: left; margin-right: 2vw; margin-bottom: 1.2vh;line-height: 2.8rem;}
.happy .box ul li {word-break: keep-all; display: block; word-wrap: normal; font-size: 1.1rem; line-height: 2rem; float: left; margin-left: 0.5rem; color:#777; font-weight: 400;}

.letter .inner.normal {height:unset;}
.letter .inner.normal div {width:27%; }
.letter .inner.normal dl {display: flex; flex-direction: row; border-top:1px solid #005EAD; margin-bottom: 1.2vh; font-size: 1.4rem;}
.letter .inner.normal dl dt {border-bottom:1px solid #005EAD; color:#005EAD; width:60%; padding-left: .6vw; line-height: 3vh; font-weight: 600;}
.letter .inner.normal dl dd {border-bottom:1px solid #005EAD; width:40%; text-align: center;line-height: 3vh; font-weight: 800;}
.letter .inner.normal div:nth-child(3) {width:40%; overflow: hidden;}
.letter .inner.normal div:nth-child(3) img {width:100%; height:100%; object-fit: cover;}
.letter .inner.normal div:last-child img { height: auto;}
.letter .l1 {float:right; margin-left: 16px;width:40%;}
.letter .l2 {float:left; margin: 0 32px 0 24px; width:30%}
.letter .l3 {width:40% }
.letter .inner.normal div ul.list {display: flex;flex-direction: column; justify-content: space-between; height: 100%; gap:2vh}
.letter .inner.normal h3 { font-size: 2.2rem; color:#005EAD; font-weight: 400; margin: 0 0 1rem; font-family: NotoSerifKR;}
.letter .inner.normal h3 strong {font-weight: 800; font-family:'Pretendard', serif}
.letter .inner.normal h3 span {display: block; font-size: 1.3rem; margin-top:0;line-height: 2.2rem;font-family:'Pretendard', serif ;font-weight: 600;}
.letter .inner.normal p {font-size: 1.3rem; line-height: 1.8rem;}
.letter .inner.normal p.desc {font-size: 1.2rem; line-height: 1.6rem; color:#777}
.letter .inner.normal ul li {font-size: 1.2rem; color:#777; line-height: 1.6rem;}
.letter img.lefter{ float:left; margin-right: 1vw;}
.letter img.righter{ float:right; margin-left: 1vw;}

.movie .half:first-child {justify-content: center;position: relative;}
.movie .half:first-child::before {content: ""; display: block; position: absolute; top: -10vh; left: -8vw; width: calc(100% + 16vw); height: calc(100% + 20vh); z-index: -1; background-color: #000;}
.movie .half:first-child img { height:100%; width:auto;}
.movie .half:last-child {position: relative;}
.movie .credit {position: absolute; bottom:0; right:0; width: 33rem;}
.movie .credit .title {margin-bottom: 2rem;}
.movie .credit .title h3 {font-size: 1.4rem;}
.movie .credit .title h3 strong { margin: 0 .6rem;}
.movie .credit .title h3 span {font-size: 1.2rem;}
.movie .credit .title h1 {font-size: 4.6rem; line-height: 1; margin: 1rem 0 .8rem;}
.movie .credit h2 { font-size: 2rem; line-height: 1; }
.movie .credit dl {font-size: 1.3rem; line-height: 2.2rem;}
.movie .credit a {display: block; font-size: 1.4rem; text-decoration: underline; margin-top: 1rem; font-weight: 600;}
.logo.last {position: static; margin-top: 4rem;}

.pp-viewing-page15 .menu-btn i,
.pp-viewing-page2 .menu-btn i {color:#ccc;}
/* 
@media only screen and (max-width: 1023px){
  .title {transform: none; top:20px; left:30px}
  .title h1 {font-size: 12vw;}
  .title h2 {font-size: 5vw;}
  .title h3 {font-size: 3.4vw;;}
  .title h3 span {font-size: 3vw;}
  .inner figure {width: 70vw; margin-right:auto; margin-left: 0; }
  .inner figure img {margin-top: 50%; height:70%}
  .inner p {bottom:20vh;font-size:1.8vh; line-height: 3.8vh;}
  .inner figure figcaption {display: none;}
  .logo {width:32vw; left:30px; bottom:4vh}
  .inner figure::before {bottom:6.5vh; width:20vw;}

} */

/*  */
.section-chart img{
  width: auto;
  height: auto;
  object-fit: contain;
  object-position: unset;
}
.section-chart .inner.normal{
  height: 100vh;
}
.section-chart .grid .half{
  flex-direction: column;
  width: calc(50% - 48px);
}
.align-self-start{
  align-self: flex-start;
}
.policy-top-wrap{
  display: flex;
  width: 100%;
  height: 80px;
  justify-content: space-between;
  margin-bottom: 6%;
  border-bottom: 1px solid #005EAD;
}
.policy-top-wrap h2{
  font-size: 3.6rem;
  line-height: 4.8rem;
  color: #005EAD;
}
.policy-top-wrap .image{
  margin-right: 10px;
}
.policy-top-wrap .desc{
  font-size: 1.3rem;
  line-height: 2rem;
  color: #005EAD;
  text-align: right;
}
.policy-bottom-wrap{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  height: 80%;
}
.question-wrap{
  display: flex;
  align-items: flex-start;
}
.question{
  position: relative;
  width: 40.5%;
  font-size: 2.2vh;
  line-height: 3.3vh;
  font-weight: 800;
  color: #005EAD;
  margin-right: 5.3vh;
  padding: 2.3vh;
  border: 1px solid #005EAD;
}
.question::before{
  content: "";
  position: absolute;
  top: 2.9vh;
  right: -17px;
  border-top: 10px solid transparent;
  border-left: 18px solid #FFFDF1;
  border-bottom: 10px solid transparent;
  z-index: 1;
}
.question::after{
  content: "";
  position: absolute;
  top: calc(2.9vh - 1px);
  right: -20px;
  border-top: 11px solid transparent;
  border-left: 20px solid #005EAD;
  border-bottom: 11px solid transparent;
}
.answer{
  flex: 1;
}
.answer .answer-title{
  font-size: 1.4vh;
  line-height: 2.2vh;
  font-weight: 800;
  color: #005EAD;
  margin-bottom: 1.1vh;
}
.answer .answer-desc{
  font-size: 1.3vh;
  line-height: 1.8vh;
  color: #312927;
}
.answer .answer-desc .highlight{
  text-decoration: underline #fff107 6px solid;
  text-underline-offset: -3px;
  text-underline-position: from-font;
  text-decoration-skip-ink: none;
}
.answer img{
  margin-top: 2.7vh;
}
.chart-top-wrap{
  width: 100%;
  border-bottom: 1px solid #005EAD;
}
.chart-bottom-wrap{
  height: 74.1vh;
}
.chart-top-wrap h2{
  margin-bottom: 1.4vh;
}
.chart-container{
  display: flex;
  flex-direction: column;
  margin-right: auto;
}
.chart-wrap{
  position: relative;
  width: 80%;
  margin: 68px 50px 80px;
  height: 270px;
}
.chart-wrap .number{
  position: absolute;
  top: calc(50% - 1.7vh);
  right: 0;
  font-size: 3.4rem;
  font-weight: 800;
  color: #005EB8;
  line-height: 3.5vh;
}
.chart-wrap:before{
  content: '';
  position: absolute;
  top: calc(50% - 1.5vw);
  right: 2.8vw;
  width: 6rem;
  height: 3vw;
  background-color: #FFFDF1;
}
.chart-wrap .number span{
  font-size: 2.5vh;
  font-weight: 400;
}
.chart-wrap #chart-2 + .number{
  color: #003B78;
}

.text-right{
  text-align: right;
}
.flex{
  display: flex;
}
.height-100{
  height: 100%;
}
.flex-1{
  flex: 1;
}

.grid-list{
  margin: 0 -3%;
}
.grid-sizer, .grid-item{
  width: 33.333%;
}
.grid-item{
  padding: 0 3%;
  margin-bottom: 10vh;
}
.grid-item-w-3{
  width: 100%;
  margin-bottom: 6.4rem;
}
.grid-item .cal{
  width: 100%;
  margin:0 auto;
  height: auto;
  object-fit: contain;
}

.map-wrap{position: relative;	padding-bottom: 28.5rem; margin-top: -3.2rem;}
.mi_top {position: absolute; top:10vh; left:8vw; color:#005EAD}
.mi_top h2 {font-size: 5.2rem; line-height: 1; margin-bottom: 2.4rem;}
.mi_top h2 strong {font-weight: 900; position: relative; z-index: 1;}
.mi_top h2 strong::before{content: ""; position: absolute; background: #FFF107; width: 100%; height: 2rem; bottom: .4rem; left: 0; z-index:-1; }
.mi_top h3 {font-size: 2.4rem; line-height: 1.4; font-weight: 800;}
.mi_bot {position: absolute; top:54rem; left:8vw;color:#005EAD; width:26rem}
.mi_bot p {font-size: 1rem;}
.mi_bot ul li {border-top:1px solid #005EAD; margin:1rem 0 1.8rem; padding-top: 1.2rem; display: flex; }
.mi_bot ul li p {font-size: 2.8rem;}
.mi_bot ul li p strong{font-weight: 800; font-size: 3.2rem;}
.mi_bot ul li p span {display: block; font-size: 1.1rem;margin-top: 1rem;    text-align: right;}
.map-wrap .mi_bot h4 {font-size: 1.2rem;line-height: 1.8rem; letter-spacing: -.1rem; flex:1; margin-bottom: 0;}
.map-wrap .mi_bot h4 span {display: block; font-size: .9rem;  margin-top:.4rem; font-weight: 400;}

.wbg { position: absolute; bottom:0; left: 50%; margin-left: -100%; width: 200%;background-color: #fff; text-align: center; }

.map-wrap .icon{
  position: absolute;
  cursor: pointer;
  height: auto;
}
.map-wrap .icon::before{
  content: "";
  position: absolute;
  background-size: cover;
  display: block;
  pointer-events: none;
  
}
.map-wrap .icon.me{
  top: 27rem;
  left: 42rem;
  width:6rem;
}
.map-wrap .icon.me::before{
  top:6rem;
  left:49%;
  background-image: url(../images/ic_gu_l.png) ;
  background-position: bottom;
  width: .5rem;
  height:5rem;
}
.map-wrap .icon.gu{
  top: 30.6rem;
  left: 48.4rem;
  width:6.6rem;
}
.map-wrap .icon.gu::before{
  top:6.6rem;
  left:49%;
  background-image: url(../images/ic_gu_l.png) ;
  background-position: bottom;
  width: .5rem;
  height:5rem;
}
.map-wrap .icon.ha{
  top: 20.5rem;
  left: 54.5rem;
  width:10.8rem;
}
.map-wrap .icon.ha::before{
  top:10.8rem;
  left:49%;
  background-image: url(../images/ic_gu_l.png) ;
  background-position: bottom;
  width: .5rem;
  height:10rem;
}
.map-wrap .icon.dr{
  top: 30.9rem;
  left: 62.5rem;
  width: 6.4rem;
}
.map-wrap .icon.dr::before{
  top: 4.8rem;
  left: -1rem;
  background-image: url(../images/ic_dr_l.png);
  background-position: bottom;
  width: 1.4rem;
  height: 5.6rem;
}
.map-wrap .icon.es{
  top: 39rem;
  left: 43.6rem;
  width: 6.4rem;
}
.map-wrap .icon.ho{
  top: 39.4rem;
  left: 52.8rem;
  width: 6rem;
}
.map-wrap .icon.ec{
  top: 36.6rem;
  left: 66rem;
  width: 8.4rem;
}
.map-wrap .icon.ec::before{
  top: 5.2rem;
  left: -8.4rem;
  background-image: url(../images/ic_ec_l.png);
  background-position: bottom;
  width: 8.6rem;
  height: 9.4rem;
}
.map-wrap .icon.ni{
  top: 47.3rem;
  left: 47rem;
  width: 7.6rem;
}
.map-wrap .icon.ni::before{
  top: -3.2rem;
  left: 3.9rem;
  background-image: url(../images/ic_ni_l.png);
  background-position: top;
  width: 3.4rem;
  height: 3.4rem;
}
.map-wrap .icon.pe{
  top: 53.6rem;
  left: 52.2rem;
  width: 8.4rem;
}
.map-wrap .icon.co{
  top: 44.6rem;
  left: 59rem;
  width: 12rem;
}
.map-wrap .icon.br{
  top: 50.3rem;
  left: 71.4rem;
  width: 6.4rem;
}
.map-wrap .icon.br::before{
  top: 6.4rem;
  left: 49%;
  background-image: url(../images/ic_gu_l.png) ;
  background-position: bottom;
  width: .5rem;
  height:2.4rem;
}
.map-wrap .icon.bo{
  top: 59.6rem;
  left: 58.6rem;
  width: 10.8rem;
}
.map-wrap .icon.bo::before{
  top: -1.8rem;
  left: 49%;
  background-image: url(../images/ic_bo_l.png) ;
  background-position: top;
  width: .5rem;
  height:1.9rem;
}
.map-wrap .icon.bf{
  top: 21.8rem;
  left: 89.6rem;
  width: 15.1rem;
}
.map-wrap .icon.bf::before{
  top: 15.1rem;
  left: 49%;
  background-image: url(../images/ic_gu_l.png) ;
  background-position: bottom;
  width: .5rem;
  height:7.9rem;
}
.map-wrap .icon.tg{
  top: 54.6rem;
  left: 92.4rem;
  width: 10.8rem;
}
.map-wrap .icon.tg::before{
  top: -7.8rem;
  left: 49%;
  background-image: url(../images/ic_bo_l.png);
  background-position: top;
  width: 0.5rem;
  height: 7.9rem;
}
.map-wrap .icon.gh{
  top: 43.3rem;
  left: 81.6rem;
  width:13.4rem;
}
.map-wrap .icon.gh::before{
  top: 3.1rem;
  left: 100%;
  background-image: url(../images/ic_gh_l.png) ;
  background-position: bottom;
  width: 1.73rem;
  height:4.21rem;
}
.map-wrap .icon.ug{
  top: 36rem;
  left: 98.6rem;
  width: 13.6rem;
}
.map-wrap .icon.ug::before{
  top: 9.1rem;
  left: 97%;
  background-image: url(../images/ic_ug_l.png);
  background-position: bottom;
  width: 1.52rem;
  height: 4.56rem;
}
.map-wrap .icon.rw{
  top: 67rem;
  left: 95.6rem;
  width: 13.6rem;
}
.map-wrap .icon.rw::before{
  top: -13.6rem;
  left: 84%;
  background-image: url(../images/ic_rw_l.png);
  background-position: top right;
  width: 5.4rem;
  height: 17.4rem;
}
.map-wrap .icon.et{
  top: 30rem;
  left: 113rem;
  width: 18.2rem;
}
.map-wrap .icon.ke{
  top: 53rem;
  left: 117.6rem;
  width: 13.6rem;
}
.map-wrap .icon.ke::before{
  top: -2.9rem;
  left: -11%;
  background-image: url(../images/ic_ke_l.png);
  background-position: top left;
  width: 2rem;
  height: 12rem;
}
.map-wrap .icon.tz{
  top: 63.6rem;
  left: 112.9rem;
  width: 13.6rem;
}
.map-wrap .icon.tz::before{
  top: -8.9rem;
  left: 14%;
  background-image: url(../images/ic_bo_l.png);
  background-position: top;
  width: 0.5rem;
  height: 10.9rem;
}
.map-wrap .icon.bd{
  top: 27rem;
  left: 136.8rem;
  width: 6.6rem;
}
.map-wrap .icon.bd::before{
  top:6.6rem;
  left:49%;
  background-image: url(../images/ic_gu_l.png) ;
  background-position: bottom;
  width: .5rem;
  height:5rem;
}
.map-wrap .icon.lk{
  top: 51rem;
  left: 133.4rem;
  width: 4.4rem;
}
.map-wrap .icon.lk::before{
  top: -4.4rem;
  left: 49%;
  background-image: url(../images/ic_bo_l.png);
  background-position: top;
  width: 0.5rem;
  height: 4.5rem;
}
.map-wrap .icon.th{
  top: 39rem;
  left: 138.4rem;
  width: 12rem;
}
.map-wrap .icon.ph{
  top: 11.8rem;
  left: 143.6rem;
  width: 24rem;
}
.map-wrap .icon.ph::before{
  top: 24rem;
  left: 49%;
  background-image: url(../images/ic_gu_l.png);
  background-position: bottom;
  width: 0.5rem;
  height: 8.6rem;
}
.map-wrap .icon.ioid{
  top: 50.8rem;
  left: 142rem;
  width: 24rem;
}





.map-wrap .icon .desc{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 185px;
  padding: 17px;
  background: #fff;
  border: 1px solid #005EB8;
  border-radius: 12px;
  visibility: hidden;
  opacity: 0;
  transition: all 0.5s;
  z-index: 1;
}
.map-wrap .icon .desc .xi-close{
  position: absolute;
  top: 17px;
  right: 17px;
  cursor: pointer;
}
.map-wrap h4 {font-size: 1.6rem; font-weight: bold; margin-bottom: 1.2rem;}
.map-wrap .icon .desc li{
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.map-wrap .icon .desc li p{
  flex:1;
  font-size: 1.2rem;
  line-height: 2rem;
  color:#585858;
  margin-bottom: 0;
}
.legend { font-size: .8rem; color:#005EAD; margin-top: 2rem;}
.legend ul{display: flex; flex-direction: column}
.legend ul li{display: flex; align-items: center; margin-bottom: .8rem;}
.legend ul li::before {content: ""; display: block; width:.6rem; height:.6rem; background-color: #000; border-radius: 100%; margin-right: .3rem; }
.map-wrap .icon .desc li::before {content: ""; display: block; width:.7rem; height:.7rem; background-color: #000; border-radius: 100%; margin-right: .4rem; }
.legend ul li:first-child::before,
.map-wrap .icon .desc li:first-child::before {background-color: #9C263A;}
.legend ul li:nth-child(2)::before,
.map-wrap .icon .desc li:nth-child(2)::before {background-color: #F6A700;}
.legend ul li:last-child::before,
.map-wrap .icon .desc li:last-child::before {background-color: #15A59A;}
.map-wrap .icon .desc li .num{
  font-size: 1.2rem;
  font-weight: 800;
  flex:.4;
  text-align: right;
  margin-left: 0;
}
.map-wrap .icon.active .desc{
  visibility: visible;
  opacity: 1;
}
.map-info-wrap{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}
.map-title{
  position: absolute;
  top: -30px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 16px;
  line-height: 42px;
  padding: 0 25px;
  background: #fff;
}
.map-info{
  max-height: 36px;
  background: #fff;
  transition: all 0.5s;
}
.map-info-wrap.active .map-info{
  max-height: 500px;
}
.pc{
  display: block;
}
.mo{
  display: none
}
/* mo */
@media only screen and (max-width: 1023px){
  .mo{
    display: block;
  }
  .pc{
    display: none;
  }
  .map-wrap{
    width: 2000px;
  } 
  .map-title{    
    position: relative;
    top: 0;
    left: 0;
    transform: none;
    width: 100%;
    text-align: left;
  }
  .map-info-wrap{
    position: relative;
    top: 0;
    left: 0;
  }
  .map-info{
    max-height: none !important;
  }
}