@charset "UTF-8";

/* SECTION 1 */
.st-1 { position:relative; width:100%; padding-top:140px; }
.st-1 > .wrap { width:100%; max-width:1920px; margin:0 auto; }
.st-1 > .wrap::after { content:''; display:table; clear:both; }
.st-1 > .wrap > .bg { float:left; width:calc(100% - 950px); height:546px; margin-top:-140px; overflow:hidden; }
.st-1 > .wrap > .bg > video { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); height:100%; }
.st-1 > .wrap > .content { float:left; width:950px; padding:0 50px; box-sizing:border-box; }
.st-1 > .wrap > .content > .en { font-size:65px; font-weight:800; font-family:'Unbounded',sans-serif; line-height:80px; }
.st-1 > .wrap > .content > .kr { font-size:18.5px; line-height:28px; margin-top:50px; }

/* SECTION TYPE-1 */
@media only screen and (max-width:1649px) {
	.st-1 { padding-top:130px; }
	.st-1 > .wrap > .bg { width:calc(100% - 850px); height:500px; margin-top:-130px; }
	.st-1 > .wrap > .content { width:850px; padding:0 40px; }
	.st-1 > .wrap > .content > .en { font-size:62px; line-height:74px; }
	.st-1 > .wrap > .content > .kr { font-size:17.5px; line-height:27px; margin-top:45px; }
}

/* SECTION TYPE-2 */
@media only screen and (max-width:1279px) {
	.st-1 { padding-top:110px; }
	.st-1 > .wrap > .bg { width:calc(100% - 700px); height:400px; margin-top:-110px; }
	.st-1 > .wrap > .content { width:700px; padding:0 30px; }
	.st-1 > .wrap > .content > .en { font-size:47px; line-height:57px; }
	.st-1 > .wrap > .content > .kr { font-size:15.5px; line-height:22.5px; margin-top:40px; }
}

/* SECTION TYPE-3 */
@media only screen and (max-width:1023px) {
	.st-1 { padding-top:0; }
	.st-1 > .wrap > .bg { float:none; position:absolute; width:100%; height:370px; top:0; margin-top:0; }
	.st-1 > .wrap > .bg > video { width:100%; height:auto; }
	.st-1 > .wrap > .content { float:none; width:100%; padding:410px 20px 0 20px; }
	.st-1 > .wrap > .content > .en { font-size:37px; line-height:45px; }
	.st-1 > .wrap > .content > .en > br.pc { display:none; }
	.st-1 > .wrap > .content > .kr { font-size:14px; line-height:20.5px; margin-top:30px; }
}

/* SECTION TYPE-4 */
@media only screen and (max-width:767px) {
	.st-1 > .wrap > .bg { height:250px; }
	.st-1 > .wrap > .content { padding:280px 10px 0 10px; }
	.st-1 > .wrap > .content > .en { font-size:27px; line-height:34px; }
	.st-1 > .wrap > .content > .kr { font-size:12px; line-height:17px; margin-top:25px; }
}

/* SECTION TYPE-5 */
@media only screen and (max-width:499px) {
	.st-1 > .wrap > .bg > video { width:140%; }
}

/* SECTION 2 */
.st-2 { margin-top:100px; }
.st-2 > .wrap { position:relative; width:100%; max-width:1920px; margin:0 auto; padding:0 50px; box-sizing:border-box; }
.st-2 > .wrap::after { content:''; display:table; clear:both; }
.st-2 > .wrap > .content { width:calc(100% + 40px); margin-left:-20px; }
.st-2 > .wrap > .content::after { content:''; display:table; clear:both; }
.st-2 > .wrap > .content > .box { position:relative; float:left; width:calc(50% - 40px); margin:0 20px 40px 20px; cursor:pointer; }
.st-2 > .wrap > .content > .box::after { content:''; display:table; clear:both; }
.st-2 > .wrap > .content > .box > .thumb { position:relative; float:left; width:350px; height:520px; overflow:hidden; }
.st-2 > .wrap > .content > .box > .thumb > img { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); height:100%; transition:all 0.6s ease-in-out; }
.st-2 > .wrap > .content > .box:hover > .thumb > img { height:120%; }
.st-2 > .wrap > .content > .box > .title { position:relative; float:left; width:calc(100% - 350px); height:520px; background:#f5f5f5; transition:all 0.3s ease-in-out; }
.st-2 > .wrap > .content > .box:hover > .title { background:#ffb428; }
.st-2 > .wrap > .content > .box > .title > .top { position:absolute; top:0; padding:60px 50px; box-sizing:border-box; }
.st-2 > .wrap > .content > .box > .title > .top > .en { }
.st-2 > .wrap > .content > .box > .title > .top > .en > .box { height:19.5px; overflow:hidden; }
.st-2 > .wrap > .content > .box > .title > .top > .en > .box > .depth { position:relative; display:block; height:100%; top:0%; font-size:19.5px; font-weight:700; line-height:19.5px; font-family:'Unbounded',sans-serif; transition:0.3s; }
.st-2 > .wrap > .content > .box:hover > .title > .top > .en > .box > .depth { top:-100%; }
.st-2 > .wrap > .content > .box > .title > .top > .kr { font-size:30.5px; line-height:40px; margin-top:22px; }
.st-2 > .wrap > .content > .box > .title > .bottom { position:absolute; bottom:0; padding:60px 50px; box-sizing:border-box; }
.st-2 > .wrap > .content > .box > .title > .bottom > .date { }
.st-2 > .wrap > .content > .box > .title > .bottom > .date > .box { height:14.5px; overflow:hidden; }
.st-2 > .wrap > .content > .box > .title > .bottom > .date > .box > .depth { position:relative; display:block; height:100%; top:0%; font-size:13.5px; font-weight:500; line-height:12px; font-family:'Unbounded',sans-serif; transition:0.3s; }
.st-2 > .wrap > .content > .box:hover > .title > .bottom > .date > .box > .depth { top:-100%; }

/* SECTION TYPE-1 */
@media only screen and (max-width:1649px) {
	.st-2 { margin-top:90px; }
	.st-2 > .wrap { padding:0 40px; }
	.st-2 > .wrap > .content { width:calc(100% + 34px); margin-left:-17px; }
	.st-2 > .wrap > .content > .box { width:calc(50% - 34px); margin:0 17px 34px 17px; }
	.st-2 > .wrap > .content > .box > .thumb { width:290px; height:480px; }
	.st-2 > .wrap > .content > .box > .title { width:calc(100% - 290px); height:480px; }
	.st-2 > .wrap > .content > .box > .title > .top { padding:52px 42px; }
	.st-2 > .wrap > .content > .box > .title > .top > .en > .box { height:18.5px; }
	.st-2 > .wrap > .content > .box > .title > .top > .en > .box > .depth { font-size:18.5px; line-height:18.5px; }
	.st-2 > .wrap > .content > .box > .title > .top > .kr { font-size:29px; line-height:38px; margin-top:20px; }
	.st-2 > .wrap > .content > .box > .title > .bottom { padding:52px 42px; }
	.st-2 > .wrap > .content > .box > .title > .bottom > .date > .box { height:13.5px; }
	.st-2 > .wrap > .content > .box > .title > .bottom > .date > .box > .depth { font-size:12.5px; line-height:12.5px; }
}

/* SECTION TYPE-2 */
@media only screen and (max-width:1279px) {
	.st-2 { margin-top:70px; }
	.st-2 > .wrap { padding:0 30px; }
	.st-2 > .wrap > .content { width:calc(100% + 30px); margin-left:-15px; }
	.st-2 > .wrap > .content > .box { width:calc(50% - 30px); margin:0 15px 30px 15px; }
	.st-2 > .wrap > .content > .box > .thumb { float:none; width:100%; height:220px; }
	.st-2 > .wrap > .content > .box > .thumb > img { width:100%; height:auto; }
	.st-2 > .wrap > .content > .box:hover > .thumb > img { width:120%; height:auto; }
	.st-2 > .wrap > .content > .box > .title { width:100%; height:240px; }
	.st-2 > .wrap > .content > .box > .title > .top { padding:32px 32px; }
	.st-2 > .wrap > .content > .box > .title > .top > .en > .box { height:15.5px; }
	.st-2 > .wrap > .content > .box > .title > .top > .en > .box > .depth { font-size:15.5px; line-height:15.5px; }
	.st-2 > .wrap > .content > .box > .title > .top > .kr { font-size:22.5px; line-height:29px; margin-top:15px; }
	.st-2 > .wrap > .content > .box > .title > .bottom { padding:32px 32px; }
	.st-2 > .wrap > .content > .box > .title > .bottom > .date > .box { height:12.5px; }
	.st-2 > .wrap > .content > .box > .title > .bottom > .date > .box > .depth { font-size:11.5px; line-height:11.5px; }
}

/* SECTION TYPE-3 */
@media only screen and (max-width:1023px) {
	.st-2 { margin-top:90px; }
	.st-2 > .wrap { padding:0 20px; }
	.st-2 > .wrap > .content { width:calc(100% + 20px); margin-left:-10px; }
	.st-2 > .wrap > .content > .box { width:calc(50% - 20px); margin:0 10px 20px 10px; }
	.st-2 > .wrap > .content > .box > .thumb { height:170px; }
	.st-2 > .wrap > .content > .box > .title { height:190px; }
	.st-2 > .wrap > .content > .box > .title > .top { padding:25px 25px; }
	.st-2 > .wrap > .content > .box > .title > .top > .en > .box { height:12.5px; }
	.st-2 > .wrap > .content > .box > .title > .top > .en > .box > .depth { font-size:12.5px; line-height:12.5px; }
	.st-2 > .wrap > .content > .box > .title > .top > .kr { font-size:18.5px; line-height:24px; margin-top:12px; }
	.st-2 > .wrap > .content > .box > .title > .bottom { padding:25px 25px; }
	.st-2 > .wrap > .content > .box > .title > .bottom > .date > .box { height:11px; }
	.st-2 > .wrap > .content > .box > .title > .bottom > .date > .box > .depth { font-size:10px; line-height:10px; }
}

/* SECTION TYPE-4 */
@media only screen and (max-width:767px) {
	.st-2 { margin-top:70px; }
	.st-2 > .wrap { padding:0 10px; }
	.st-2 > .wrap > .content { width:100%; margin-left:0; }
	.st-2 > .wrap > .content > .box { width:100%; margin:0 0 10px 0; }
	.st-2 > .wrap > .content > .box > .thumb { height:150px; }
	.st-2 > .wrap > .content > .box > .title { height:120px; }
	.st-2 > .wrap > .content > .box > .title > .top { padding:20px 15px; }
	.st-2 > .wrap > .content > .box > .title > .top > .en > .box { height:10.5px; }
	.st-2 > .wrap > .content > .box > .title > .top > .en > .box > .depth { font-size:10.5px; line-height:10.5px; }
	.st-2 > .wrap > .content > .box > .title > .top > .kr { font-size:15.5px; line-height:20px; margin-top:8px; }
	.st-2 > .wrap > .content > .box > .title > .bottom { padding:20px 15px; }
	.st-2 > .wrap > .content > .box > .title > .bottom > .date > .box { height:9.5px; }
	.st-2 > .wrap > .content > .box > .title > .bottom > .date > .box > .depth { font-size:8.5px; line-height:8.5px; }
}

/* SECTION TYPE-5 */
@media only screen and (max-width:499px) {
	.st-2 > .wrap > .content > .box > .title { height:140px; }
}

/* JOURNAL */
.journal { display:none; position:fixed; width:100vw; height:100vh; top:0; left:0; right:0; bottom:0; padding:0; background:rgba(0,0,0,0.8); justify-content:center; align-items:center; z-index:9900; }
.journal > .journal-box { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:800px; height:650px; background:#fff; padding:30px 30px; box-sizing:border-box; }
.journal > .journal-box > .journal-content { position:relative; width:100%; height:100%; border:2px solid #000; padding:30px 30px; box-sizing:border-box; }
.journal > .journal-box > .journal-content > .journal-title { position:absolute; top:0; left:0; width:100%; height:80px; padding:0 30px; line-height:79px; border-bottom:2px solid #000; overflow:hidden; white-space:nowrap; box-sizing:border-box; }
.journal > .journal-box > .journal-content > .journal-title::after { content:''; display:table; clear:both; }
.journal > .journal-box > .journal-content > .journal-title > .title { position:relative; font-size:20.5px; font-weight:600; }
.journal > .journal-box > .journal-content > .journal-title > .title > .gradation { position:absolute; top:0; right:-30px; width:100%; height:100%; background:rgba(255,255,255,0); z-index:10; }
.journal > .journal-box > .journal-content > .journal-title > .title > .cate { float:left; font-size:16px; font-weight:500; font-family:'Unbounded',sans-serif; color:#fff; background:#000; margin-left:-30px; margin-right:17px; padding:0 15px; box-sizing:border-box; }
.journal > .journal-box > .journal-content > .journal-text { position:absolute; bottom:0; left:0; width:100%; height:calc(100% - 80px); font-size:17px; line-height:24px; padding:25px; overflow-y:auto; box-sizing:border-box; }
.journal > .journal-box > .journal-content > .journal-text > span { font-size:14px; font-weight:500; font-family:'Unbounded',sans-serif; }
.journal > .journal-box > .journal-content > .journal-text > p { font-size:17px; font-weight:600; line-height:24px; margin-top:40px; }
.journal > .journal-box > .journal-close { position:absolute; top:0px; right:0px; width:66px; height:66px; background:#fff; cursor:pointer; z-index:100; }
.journal > .journal-box > .journal-close > i { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-size:20px; font-weight:900; color:#000; line-height:66px; margin:-2px 0 0 2px; box-sizing:border-box; }

/* JOURNAL TYPE-1 */
@media only screen and (max-width:1649px) {
	.journal > .journal-box { width:750px; height:600px; padding:25px 25px; }
	.journal > .journal-box > .journal-content { padding:25px 25px; }
	.journal > .journal-box > .journal-content > .journal-title { height:75px; padding:0 25px; line-height:74px; }
	.journal > .journal-box > .journal-content > .journal-title > .title { font-size:19.5px; }
	.journal > .journal-box > .journal-content > .journal-title > .title > .gradation { right:-25px; }
	.journal > .journal-box > .journal-content > .journal-title > .title > .cate { font-size:15px; margin-left:-25px; margin-right:15px; padding:0 12px; }
	.journal > .journal-box > .journal-content > .journal-text { height:calc(100% - 75px); font-size:16px; line-height:22px; padding:22px; }
	.journal > .journal-box > .journal-content > .journal-text > span { font-size:13px; }
	.journal > .journal-box > .journal-content > .journal-text > p { font-size:16px; line-height:22px; margin-top:37px; }
	.journal > .journal-box > .journal-close { width:62px; height:62px; }
	.journal > .journal-box > .journal-close > i { font-size:18.5px; line-height:62px; margin:0 0; }
}

/* JOURNAL TYPE-2 */
@media only screen and (max-width:1279px) {
	.journal > .journal-box { width:650px; height:550px; padding:20px 20px; }
	.journal > .journal-box > .journal-content { padding:20px 20px; }
	.journal > .journal-box > .journal-content > .journal-title { height:66px; padding:0 20px; line-height:65px; }
	.journal > .journal-box > .journal-content > .journal-title > .title { font-size:18px; }
	.journal > .journal-box > .journal-content > .journal-title > .title > .gradation { right:-20px; }
	.journal > .journal-box > .journal-content > .journal-title > .title > .cate { font-size:14px; margin-left:-20px; margin-right:14px; padding:0 9px; }
	.journal > .journal-box > .journal-content > .journal-text { height:calc(100% - 66px); font-size:15.5px; line-height:22px; padding:20px; }
	.journal > .journal-box > .journal-content > .journal-text > span { font-size:12.5px; }
	.journal > .journal-box > .journal-content > .journal-text > p { font-size:15.5px; line-height:22px; margin-top:34px; }
	.journal > .journal-box > .journal-close { width:50px; height:50px; }
	.journal > .journal-box > .journal-close > i { font-size:16px; line-height:50px; }
}

/* JOURNAL TYPE-3 */
@media only screen and (max-width:1023px) {
	.journal > .journal-box { width:500px; height:500px; padding:15px 15px; }
	.journal > .journal-box > .journal-content { padding:15px 15px; }
	.journal > .journal-box > .journal-content > .journal-title { height:57px; padding:0 15px; line-height:56px; }
	.journal > .journal-box > .journal-content > .journal-title > .title { font-size:15.5px; }
	.journal > .journal-box > .journal-content > .journal-title > .title > .gradation { right:-15px; }
	.journal > .journal-box > .journal-content > .journal-title > .title > .cate { font-size:12px; margin-left:-15px; margin-right:12px; padding:0 7px; }
	.journal > .journal-box > .journal-content > .journal-text { height:calc(100% - 57px); font-size:14px; line-height:19px; padding:17px; }
	.journal > .journal-box > .journal-content > .journal-text > span { font-size:11px; }
	.journal > .journal-box > .journal-content > .journal-text > p { font-size:14px; line-height:19px; margin-top:30px; }
	.journal > .journal-box > .journal-close { width:40px; height:40px; }
	.journal > .journal-box > .journal-close > i { font-size:14px; line-height:40px; }
}

/* JOURNAL TYPE-4 */
@media only screen and (max-width:767px) {
	.journal > .journal-box { width:400px; height:400px; padding:12px 12px; }
	.journal > .journal-box > .journal-content { padding:12px 12px; }
	.journal > .journal-box > .journal-content > .journal-title { height:48px; padding:0 12px; line-height:47px; }
	.journal > .journal-box > .journal-content > .journal-title > .title { font-size:13.5px; }
	.journal > .journal-box > .journal-content > .journal-title > .title > .gradation { right:-12px; background:linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,0) 70%, rgba(255,255,255,0.75) 80%, rgba(255,255,255,1) 90%, rgba(255,255,255,1)); }
	.journal > .journal-box > .journal-content > .journal-title > .title > .cate { font-size:10px; margin-left:-12px; margin-right:10px; padding:0 5px; }
	.journal > .journal-box > .journal-content > .journal-text { height:calc(100% - 48px); font-size:12px; line-height:16px; padding:14px; }
	.journal > .journal-box > .journal-content > .journal-text > span { font-size:9.5px; }
	.journal > .journal-box > .journal-content > .journal-text > p { font-size:12px; line-height:16px; margin-top:25px; }
	.journal > .journal-box > .journal-close { width:35px; height:35px; }
	.journal > .journal-box > .journal-close > i { font-size:12.5px; line-height:35px; }
}

/* JOURNAL TYPE-5 */
@media only screen and (max-width:499px) {
	.journal > .journal-box { width:calc(100% - 40px); }
}

/* JOURNAL TYPE-6 */
@media only screen and (max-height:399px) {
	.journal > .journal-box { height:calc(100% - 40px); }
}