@charset "utf-8";

#main {padding-top:12rem}
#main .contents {position:relative; width:calc(100% - 4.44%); max-width:1192px; margin:0 auto; padding-bottom:10rem}

/* .slick-arrow */
.control_box { text-align: center; }
.control_box .controller {float:left}
.control_box button {background-repeat: no-repeat; background-position: center; vertical-align: middle; display: inline-block; float: left; position: relative; bottom: 0;  width: 2.4rem;  height: 2.4rem; text-indent: -999999em; z-index: 2; }
.control_box .prev.slick-arrow { background-image: url(/international/img/layout/icon_slider_next.svg); transform: rotate(180deg); }
.control_box .next.slick-arrow { background-image: url(/international/img/layout/icon_slider_next.svg); margin:0 2.4rem}
.control_box .stop {background-image: url(/international/img/layout/icon_slider_pause.svg); }
.control_box .play {background-image: url(/international/img/layout/icon_slider_start.svg); }

.control_box .paging {color:transparent; display:inline-block; float:left; font-size:0; width:7rem; line-height:1.1; text-align:left; margin-right:1.5rem; margin-top:1px}
.control_box .paging span {color:#fff; display:inline-block; font-size:1.6rem; font-weight:900; letter-spacing:0.5px; line-height:2rem}
.control_box .paging .this:after {content:'/'; display:inline-block; margin:0 0.5rem}

/* .slick-dots */
.slick-dots { position: relative;  display: block; padding: 0; line-height: 1.6rem; }
.slick-dots li { float: none; position: relative; display: inline-block; width: 1.6rem; height: 1.6rem; cursor: pointer; margin-right: 4px; vertical-align: middle; }
.slick-dots li:last-child { margin-right: 0; }
.slick-dots li button { vertical-align: top; text-indent:-99999em; width: 1.6rem; height: 1.6rem; }
.slick-dots li:before { content: ""; width: 1.6rem; height: 1.6rem; background-color: #D5DADC; position: absolute; border-radius: 50%; }
.slick-dots li.slick-active:before { width: 1.6rem; height: 1.6rem; background-color: #00C2AE; box-sizing: border-box;}

/* visual */
.visual { position: relative; padding-top:4rem; margin-bottom:3rem}
.visual .item {float:left; display: block !important;} 
.visual .img {overflow:hidden; max-width:94rem; width: 100%; height:47rem; position: relative; overflow: hidden;}
.visual .img img {width: 100%; height: 100%; transform:scale(1); transition: all 6s; object-fit:cover;}
.visual .slick-current .img img { transform:scale(1.1); }
.visual .desc { position: absolute; right: 0; bottom:6rem; width:100%; max-width:68rem; height:18rem; padding:3rem; background-image: linear-gradient(139deg, rgba(7,185,156,0.80) 0%, rgba(0,51,100,0.95) 94%)}
.visual .desc .title {color:#fff; display:block; font-size:3.0rem; margin-bottom:1.2rem; width:99.9%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.1;}
.visual .desc .txt {color:#fff; display:block; font-size:1.6rem; height:7rem; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; word-break:keep-all}
.visual .control_box {background-color: #626F7B; overflow: hidden; padding:1.8rem 2.4rem; position: absolute; right: 0; bottom:0; min-width:24.5rem}

/* notice */
.notice {display:flex; flex-wrap:wrap; flex-direction:row-reverse; justify-content:space-between; width:100%; margin-bottom:12rem}
.popup {width:48rem; overflow:hidden; position:relative}
.popup .list {height:27rem}
.popup .list div {height:100%}
.popup .item {position:relative; display:none !important}
.popup .item:first-child {display:block !important}
.popup .item img { width: 100%; }
.popup .item a {height:100%}
.popup .item .title {color:#fff; font-size:4rem; font-weight:900; line-height:1.3; padding:3rem; position: absolute;  left: 0; top: 0; width:80%; height:100%}
.popup .custom-controls-wrap { position: absolute; right:3rem; bottom:3rem}
.popup .custom-controls-wrap .play-control { line-height: 1.6rem; margin-left: 0.8rem; }
.popup .custom-controls-wrap .play-control button { width:1.6rem; height: 1.6rem; }
.popup .slick-dots {position:absolute; bottom:3rem; right:5.5rem}
.popup .control_box {position:absolute; right:3rem; bottom:2.6rem}
.popup .paging {display:none}
.popup .slick-arrow {display:none !important}

.board {width:calc(100% - 51rem); margin-right:3rem; display:flex; flex-direction:column; justify-content:space-between}
.board .group {display:flex; flex-wrap:wrap; width:100%; position:relative}
.board .label {position:relative; width:24rem}
.board .label .title {color:#fff; height:20rem; line-height:1.2; padding:3rem}
.board .label .title .tt {font-size:3.2rem; font-weight:900; margin-bottom:1rem}
.board .label .title .stt {display:block; font-size:1.8rem}
.board .label .more {padding:2.3rem 3rem; height:7rem; width:100%}
.board .label .more a {color:#fff; display:inline-block}
.board .label .more .icon {vertical-align: middle; margin-top: -3px; margin-left:1rem}
.board .list {border:1px solid #D5DADC; border-left:0; background-color:#fafafa; width:calc(100% - 24rem)}
.board .list div {height:100%}
.board .item a {display:flex; flex-wrap:wrap; gap:2rem; height:100%; padding:3rem; position:relative}
.board .item .img {width:10rem}
.board .item .desc {width:calc(100% - 12rem); position:relative}
.board .item .title {font-size:2.2rem; font-weight:700; height:8.5rem; line-height:1.3; word-break:break-word; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3}
.board .item .date {color:#6D6D6D; display:block; position:absolute; left:0; bottom:2rem; font-size:1.8rem; letter-spacing:0}
.board .item .date::before { content: ''; position: absolute; width:4rem; height: 1px; background-color: #D5DADC; top: -2rem; left: 0; }
.board .slick-dots {position:absolute; bottom:3rem; right:3rem}
.board .control_box {display:none; position:absolute; right:3rem; bottom:2.6rem}
.board .paging {display:none}
.board .slick-arrow {display:none !important}


.board .trends .label {background-color:#115999}
.board .trends .more {background-color:#03366C}
.board .funded .label {background-color:#118F99}
.board .funded .more {background:#29758B}

/*공통*/
.section {border-top:3px solid #353535; margin-bottom:12rem; padding-top:2rem}
.section .label {color:#121212; font-size:3.2rem; font-weight:900; font-family:'Lato'; text-align:center; margin-bottom:6rem}
/* video contents */
.video .list {display:flex; flex-wrap:wrap; width:calc(100% + 3rem)}
.video .list .item {width:calc(25% - 3rem); margin-right:3rem}
.video .list .item a {display:block}
.video .list .item a:hover p { text-decoration: underline; }
.video .list .item .img {margin-bottom:1.5rem; overflow:hidden; position:relative; padding-top:60%}
.video .list .item .img img { max-width: 100%; min-height:100%; object-fit:cover; position:absolute; top:0; left:50%; transform:translateX(-50%)}
.video .list .item .title {font-size:2.2rem; font-weight:900; height:8.5rem; line-height:1.3; overflow:hidden; word-break:break-word; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3}

/* Recent Reports contents */
.reports .list ul {display:flex; flex-wrap:wrap; width:calc(100% + 3rem)}
.reports .list .item {border-bottom:1px solid #9CA3A6; width:calc(50% - 3rem); margin-right:3rem; padding:2rem 0}
.reports .list .item a {display:flex; flex-wrap:wrap}
.reports .list .item .img {border-radius:0 1.5rem 1.5rem 0; border:1px solid #ddd; float:left; width:13rem; height:18.5rem; overflow:hidden; position:relative}
.reports .list .item .img img {display:block; width:100%; height:100%}
.reports .list .item .desc {float:left; width:calc(100% - 13rem); padding-left:2rem; position:relative}
.reports .list .item .desc .cate {color:#29758B; font-size:1.6rem; font-weight:700; white-space:nowrap; width:99.9%; overflow:hidden; text-overflow:ellipsis}
.reports .list .item .desc .title {font-size:2.2rem; font-weight:700; height:11.5rem; line-height:1.3; overflow:hidden; text-overflow:ellipsis; word-break:break-word; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4}
.reports .list .item .desc .date {color:#6D6D6D; font-size:1.6rem; letter-spacing:0; position:absolute; left:2rem; bottom:0}
.reports .list a:hover .title {text-decoration:underline}

/* GET CONNECTED */
.twitter {margin-bottom:0}
.twitter .list ul {display:flex; flex-wrap:wrap; width:calc(100% + 3rem)}
.twitter .list .item {width:calc(25% - 3rem); margin-right:3rem}
.twitter .list .item a {display:block}
.twitter .list .item a:hover p { text-decoration: underline; }
.twitter .list .item .img {margin-bottom:1.5rem; overflow:hidden; position:relative; padding-top:60%}
.twitter .list .item .img img { max-width: 100%; min-height:100%; object-fit:cover; position:absolute; top:0; left:50%; transform:translateX(-50%)}
.twitter .list .item .icon {background-color:#3395d7; border-radius:100%; color:#fff; display:block; font-size:2.2rem; width:4rem; height:4rem; line-height:4rem; margin:0 auto 2rem; overflow:hidden; text-align:center; right:15px; bottom:15px; z-index:1}
.twitter .list .item .icon i {display:block; width:100%; height:100%; line-height:inherit}
.twitter .list .item .title {font-size:1.8rem; font-weight:700; line-height:1.6; word-break:break-word;}


/*cookies*/
.cookiespop-wrap { overflow-x: hidden; overflow-y: auto; position: fixed; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); left: 0px; top: 0px; z-index: 99999; }
.cookiespop-wrap .cookiespop { background:#ffffff;box-shadow:0 10px 24px 0 rgb(0 0 0 / 16%);border-top:4px solid #00C2AE; position:absolute; left:0; bottom:0; padding:32px 236px; }
.cookiespop-wrap .cookiespop .btn-wrap .tooltip-close { background:#6D6D6D; color:#ffffff; }
.cookiespop-wrap .cookiespop .btn-wrap .tooltip-close:hover { background: #03366c; border: 1px solid #03366C; }

.IR {font-size: 0; height: 0;line-height: 0; overflow: hidden;position: absolute; text-indent: -9999px; visibility: hidden;width: 0;}

/*배너*/
.banner-wrap {background-color:#0B0B0B}
.banner-wrap .banner {overflow:hidden; position:relative; padding:3rem 0px 3rem 18rem; width:calc(100% - 4.44%); max-width:1192px; margin:0 auto}    
.banner-wrap .banner .item { position:relative; margin-right:7.5rem}
.banner-wrap .banner .item a { display:block; font-size: 1.4rem; font-weight: 600; color: #fff}
.banner-wrap .banner .item a span {display:inline-block; vertical-align:middle}
.banner-wrap .banner .control_box {position:absolute; left:0; top:4.5rem}