@charset "utf-8"; 

#main {overflow: hidden;}

/* 비주얼 슬라이드 */
#main .visual {position:relative; background: #f6f7f9;}
#main .visual .inner {position: relative;}

#main .visual-swiper {position:relative; padding: 20px 0 40px;}
#main .visual-swiper .swiper-slide {position:relative; width: 35%; height: 580px; padding: 25px; background: #fff; box-shadow: 5px 0 25px rgba(0,0,0,0.1); overflow: hidden;}
#main .visual-swiper .swiper-slide .slide-img {display: flex; align-items: center; justify-content: center; margin: 0 0 20px; overflow: hidden;}
#main .visual-swiper .swiper-slide .slide-img img.main_vis_img {width: 100%;}

#main .visual-swiper .swiper-slide .main_vis_tit {display: block; position:relative; z-index:3; border-top: 1px solid rgba(0,0,0,0.1); padding: 20px 0 0;}
#main .visual-swiper .swiper-slide .main_vis_tit em {font-size: 20px; line-height:1.4; font-weight: 500; color: #111; letter-spacing:-1px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical}
#main .visual-swiper .swiper-slide .main_vis_tit p {display: none; margin-top: 20px; margin-bottom: 50px; font-size: 14px; line-height:1.5; font-weight:300; cursor: context-menu;}

#main .visual-swiper .swiper-slide .bottom {position: absolute; bottom: 30px; left:0; display: flex; align-items:center; justify-content: space-between; width:100%; padding: 0 25px;}
#main .visual-swiper .swiper-slide .bottom .date {font-size: 14px; font-weight: 600; color: rgba(0,0,0,0.8);}
#main .visual-swiper .swiper-slide .bottom .visual-more {position: relative; z-index: 1; display: flex; align-items: center; font-size: 13px; font-weight: 400; color: rgba(0,0,0,0.8); padding: 10px 18px;}
#main .visual-swiper .swiper-slide .bottom .visual-more::after {content:""; z-index: -1; right:0; display: block; width: 40px; height: 40px; background: #f08200; border-radius: 40px; transition: all 0.4s cubic-bezier(0.87, 0, 0.13, 1);}
#main .visual-swiper .swiper-slide .bottom .visual-more img {margin: 0 0 0 10px;}
#main .visual-swiper .swiper-slide .bottom .visual-more:hover:after {width: 100%;}



#main .visual-swiper .visual-progress {position: relative; margin: 30px 0 0; height: 2px;}
#main .visual-swiper .visual-progress .swiper-pagination-progressbar {background: rgba(0,0,0,0.1);}
#main .visual-swiper .visual-progress .swiper-pagination-progressbar-fill {background: #111;}
#main .visual-swiper .visual-pagination {margin: 20px 0 0;}
#main .visual-swiper .visual-pagination .swiper-pagination-bullet {position: relative; font-size: 15px; color: #111; font-weight: 700; margin: 0 20px 0 0; width: auto; height: auto; background: unset;}
#main .visual-swiper .visual-pagination .swiper-pagination-bullet-active::after {content:""; left:0; bottom: -5px; display: block; width: 100%; height: 2px; background: #111;}


#main .visual-swiper .swiper-slide.swiper-slide-active, #main .visual-swiper .swiper-slide:hover {background: #5c3a93; transition: background 0.2s ease;}
#main .visual-swiper .swiper-slide.swiper-slide-active .main_vis_tit, #main .visual-swiper .swiper-slide:hover .main_vis_tit {border-color:#fff; transition: all 0.2s ease;}
#main .visual-swiper .swiper-slide.swiper-slide-active .main_vis_tit em, #main .visual-swiper .swiper-slide:hover .main_vis_tit em {color: #fff; transition: color 0.2s ease;}
#main .visual-swiper .swiper-slide.swiper-slide-active .bottom .date, #main .visual-swiper .swiper-slide:hover .bottom .date {color: rgba(255,255,255,0.6); transition: color 0.2s ease;}
#main .visual-swiper .swiper-slide.swiper-slide-active .bottom .visual-more, #main .visual-swiper .swiper-slide:hover .bottom .visual-more {color: #fff; font-weight: 300; transition: color 0.2s ease;}




#main .visual .ctrl {position:absolute; right: 0; bottom: 35px; z-index:2; transition:ease all 0.2s;}
#main .visual .ctrl button {display:inline-block; height:27px;}
#main .visual .ctrl button img {max-width: 100%;}
#main .visual .ctrl button.prev, #main .visual .ctrl button.next {width: 8px;}
#main .visual .ctrl button.pause, #main .visual .ctrl button.play {width: 9px; margin: 0 20px;}
#main .visual .ctrl button.play {display:none;}



@media(max-width: 1600px){
	#main .visual-swiper .swiper-slide {height: 520px; padding: 20px;}
	
	#main .visual-swiper .swiper-slide .bottom {bottom: 25px; padding: 0 20px;}
}
@media(max-width: 1440px){
	
	#main .visual-swiper .swiper-slide {height: 460px;}
	#main .visual-swiper .swiper-slide .slide-img {margin: 0 0 15px;}
	
	#main .visual-swiper .swiper-slide .main_vis_tit {padding: 15px 0 0;}
	#main .visual-swiper .swiper-slide .main_vis_tit em {font-size: 18px;}
	
}
@media(max-width: 1280px){
	#main .visual-swiper {padding: 20px 0 30px;}
	
	#main .visual-swiper .swiper-slide {width: 40%; height: 440px;}
	
	#main .visual-swiper .swiper-slide .bottom .date {font-size: 13px;}
	
	#main .visual-swiper .visual-pagination .swiper-pagination-bullet {margin: 0 15px 0 0;}
	#main .visual-swiper .visual-progress {margin: 20px 0 0;}
	
	#main .visual .ctrl {bottom: 25px;}
	
}
@media(max-width: 1024px){
	#main .visual-swiper {padding: 20px 0;}
	#main .visual-swiper .swiper-slide {width: 400px; padding: 15px;}
	
	#main .visual-swiper .swiper-slide .main_vis_tit em {font-size: 16px;}
	
	#main .visual-swiper .swiper-slide .bottom {padding: 0 15px;}
	#main .visual-swiper .swiper-slide .bottom .date {font-size: 12px;}
	#main .visual-swiper .swiper-slide .bottom .visual-more {font-size: 12px;}
    #main .visual-swiper .swiper-slide .bottom .visual-more::after {width: 36px; height: 36px; border-radius: 36px;}
    
    #main .visual-swiper .visual-pagination .swiper-pagination-bullet {font-size: 14px;}
    
	#main .visual .ctrl {bottom: 15px; right: 50px;}
	#main .visual .ctrl button.prev, #main .visual .ctrl button.next {width: 6px;}
	#main .visual .ctrl button.pause, #main .visual .ctrl button.play {width: 7px; margin: 0 15px;}
	
	
	
}
@media(max-width: 768px){
	#main .visual-swiper {padding: 20px 0 40px;}
	#main .visual-swiper .swiper-slide {height: 420px;}
	
	#main .visual-swiper .visual-pagination .swiper-pagination-bullet {margin: 0 15px 10px 0;}
		
	#main .visual .ctrl {right: 30px;}

	
}
@media(max-width: 576px){
	
	#main .visual-swiper .swiper-slide {width: 100%; height: calc(100vw); max-height: 500px;}
	#main .visual-swiper .swiper-slide .slide-img {height: auto;}
	
	#main .visual-swiper .swiper-slide .main_vis_tit em {font-size: 14px;}
	
	#main .visual-swiper .swiper-slide .bottom .date {font-size: 11px;}
    #main .visual-swiper .swiper-slide .bottom .visual-more::after {width: 30px; height: 30px; border-radius: 30px;}

	
	#main .visual .ctrl {right: 20px;}
	
	
}

.inner{max-width:1520px; margin:0 auto;}

@media(max-width: 1600px){
	.inner{max-width: 1260px;}
}
@media(max-width: 1440px){
	.inner{max-width: 1140px;}
}
@media(max-width: 1280px){
	.inner{max-width: 960px;}
}
@media(max-width: 1024px){
	.inner{max-width: 100%; padding: 0 50px;}
}
@media(max-width: 768px){
	.inner{padding: 0 30px;}
}
@media(max-width: 576px){
	.inner{padding: 0 20px;}
}





/* slide content common */
/* slide content common */
/* slide content common */
.slide-content {position: relative; display:flex; padding:10rem 0; overflow: hidden;}

.slide-textbox {position:relative; z-index: 2; display:flex; flex-direction: column; width: calc(((100vw - 1680px) / 2) + (1680px * 0.25)); padding-left: calc((100vw - 1680px) / 2);}
.slide-textbox .slide-title {font-family: 'Merriweather'; margin-bottom: 5rem; font-size: 4.5rem; line-height: 1.2; font-weight:700;}
.slide-textbox .slide-textbox-inner {position: relative;}

.slide-textbox a.more {display:flex; align-items:center; margin-top:5rem; font-size: 1.8rem; width: fit-content; font-weight:400;}
.slide-textbox a.more img {margin-left: 1rem;}

.slide-textbox .slide-button {display:flex; gap:1rem; margin-top: auto;}
.slide-textbox .slide-button button {display:block; width: 60px; height: 60px; border: 1px solid #fff; transition:all 0.2s ease;}
.slide-textbox .slide-button button svg {color: #fff; outline: none;}
.slide-textbox .slide-button button.prev {transform: rotateZ(180deg);}


.slide-wrap {position: relative; width: calc(1680px * 0.75);}

@media(max-width:1680px){
	.slide-textbox {width: 450px; padding-left: 5rem;}
	.slide-textbox .slide-title {font-size: 4rem;}
	.slide-textbox .slide-button button {width: 50px; height: 50px;}
	
	.slide-wrap {width: calc(100% - 450px); padding-right: 5rem;}
}
@media(max-width:1280px){
	.slide-textbox {width: 350px;}
	
	.slide-wrap {width: calc(100% - 350px);}
}
@media(max-width:1024px){
	.slide-content {display: block;padding: 8rem 0;}
	
	.slide-textbox {width: 100%; padding: 0 3rem 2rem;}
	.slide-textbox .slide-title {text-align: center;}
	.slide-textbox .slide-textbox-inner {display: flex;}
	.slide-textbox .slide-button {display: none;}
		
		
	.slide-wrap {width: 100%;padding: 0 3rem;}
}
@media(max-width:768px){
	.slide-content {padding: 6rem 0;}

	.slide-textbox .slide-title {margin-bottom: 2rem; font-size: 2.5rem;}
	.slide-textbox .slide-textbox-inner {position: relative; display: unset; text-align: center;}
	.slide-textbox a.more img {width: 10px;}
}



/* .texture-bg common */
.texture-bg {position: relative; z-index: 2; background: #ececec;}
.texture-bg::before {content:''; position:absolute; z-index:-1; top:0; left:0; display: block; width: 100%; height: 100%; background: url('/eng/img/main/bg-texture.png'); opacity: 0.05;}




/* 박스오피스 box office */
.box-office {background:#111;}

.box-office .slide-textbox {background:#111;}
.box-office .slide-textbox .slide-textbox-inner {margin:0 0 100px;}
.box-office .slide-textbox .slide-title {color:#fff;}


.box-office .slide-textbox .tab{}
.box-office .slide-textbox .tab button{position:relative; padding-right:2rem; margin-right:2rem; font-size:2rem; color:rgba(255,255,255,0.5);}
.box-office .slide-textbox .tab button::before{display:inline-block; width:0.5rem; height:0.5rem; border-radius:0.5rem; left:-1rem; top:0; background:#ee7d00; transition:all 0.2s ease; opacity:0;}
.box-office .slide-textbox .tab button.active{color:rgba(255,255,255,1);}
.box-office .slide-textbox .tab button::after{display:inline-block; width:2px; height:1rem; right:-1px; top:50%; margin-top:-0.5rem; background:rgba(255,255,255,0.2);}
.box-office .slide-textbox .tab button:last-child{padding-right:0; margin-right:0;}
.box-office .slide-textbox .tab button:last-child::after{display:none;}
.box-office .slide-textbox .tab button:hover::before, .box-office .slide-textbox .tab button.active::before{top:-1rem; opacity:1;}


.box-office .slide-textbox .period {font-size: 1.7rem; color:#fff; font-weight: 300; margin: 1.5rem 0 0;}

.box-office .slide-textbox a.more{color:#fff;}


.box-office .slide-textbox .slide-button button {border: 1px solid #fff;}
.box-office .slide-textbox .slide-button button svg {color: #fff;}
.box-office .slide-textbox .slide-button button:hover {background: #444;}





.box-office .rank {}
.box-office .rank ol {}
.box-office .rank ol li {position:relative; float:left; width: auto; background: #222;}
.box-office .rank ol li::after {content:""; position: absolute; top: 0; left: 0; display:block; transition:all 0.2s ease; border: 3px solid #923ffa; opacity: 0;}
.box-office .rank ol li .boxoffice_img {width: 100%;}
.box-office .rank ol li .boxoffice_content {position: relative; z-index: 1; padding: 3rem;}
.box-office .rank ol li .boxoffice_content .title {font-family: 'Merriweather'; color: #fff; font-size: 2.4rem; font-weight: 400; line-height: 1.2; margin: 0 0 1.5rem;}
.box-office .rank ol li .boxoffice_content .txt, .box-office .rank ol li .boxoffice_content .profit {font-size: 1.5rem; color: rgba(255,255,255, 0.5); font-weight: 400;}
.box-office .rank ol li .boxoffice_content .profit {display:flex; align-items:center; margin: 1rem 0 0;}
.box-office .rank ol li .boxoffice_content .profit::before {content:"";position:relative; display: flex; align-items:center; justify-content: center; width: 20px; height: 20px; border-radius: 20px; background: #555; font-size: 1.2rem; margin-right: 1rem; color:#fff; }
.box-office .rank .theater ol li .boxoffice_content .profit::before {content:"$";}
.box-office .rank .iptv ol li .boxoffice_content .profit::before {background-image: url("/eng/img/main/icon_view.svg"); background-repeat: no-repeat; background-position: center center; background-size: 16px;}

.box-office .rank ol li mark {display:flex; align-items: center; justify-content: center; width: 70px; height: 70px; color:#fff; background: rgba(146,63,250,0.6); font-size: 3rem; font-weight: 600; transition:all 0.2s ease;}
.box-office .rank .theater ol li mark {position:absolute; left:0; top:0; }


.box-office .rank ol li:hover::after {width: 100%; height: 100%; opacity: 1;}
.box-office .rank ol li:hover mark {background: #923ffa;}



@media(max-width:1680px){
	.box-office .slide-textbox .slide-textbox-inner {margin:0 0 80px;}
	.box-office .slide-textbox .period {font-size: 1.5rem;}
	
	.box-office .rank ol li .boxoffice_content .title {font-size: 2rem;}
	.box-office .rank ol li .boxoffice_content .txt, .box-office .rank ol li .boxoffice_content .profit {font-size: 1.4rem;}
	.box-office .rank ol li mark {width: 60px; height: 60px;font-size: 2.8rem;}
}

@media(max-width:1280px){
	.box-office .rank ol li .boxoffice_content {padding: 2.5rem;}
	.box-office .rank ol li .boxoffice_content .txt, .box-office .rank ol li .boxoffice_content .profit {font-size: 1.3rem;}
	
	.box-office .rank ol li mark {width: 55px; height: 55px;font-size: 2.5rem;}
}


@media(max-width:1024px){
	.box-office .slide-textbox .slide-textbox-inner {margin: 0;}
	.box-office .slide-textbox .period {margin: 0 0 0 5rem; font-size: 1.4rem;}
	.box-office .slide-textbox .tab button {font-size: 1.7rem;}
	
	.box-office .slide-textbox a.more {margin: 0 0 0 auto;}
		
    .box-office .rank ol li {width: 30vw;}
    .box-office .rank ol li::after {content:none;}
   	.box-office .rank ol li .boxoffice_content .profit::before {width: 18px; height: 18px;}
}

@media(max-width: 768px){
	.box-office .slide-textbox .period {margin: 1.5rem 0 0;font-size: 1.3rem;}
	.box-office .slide-textbox .tab button {font-size: 1.6rem;}
	
	.box-office .slide-textbox a.more {position: absolute; right:0; bottom:0;font-size: 1.3rem;}
	
	.box-office .rank ol li {width: 40vw;}
	.box-office .rank ol li mark {width: 45px; height: 45px;}
	.box-office .rank ol li .boxoffice_content {padding: 2rem;}
	.box-office .rank ol li .boxoffice_content .title {font-size: 1.6rem;}
	.box-office .rank ol li .boxoffice_content .profit::before {width: 16px; height: 16px; font-size: 1rem;}
}


.box-office .box-tab-contents {display:none;}
.box-office #theater{display:block;}








/* production */
.production {}
.production .slide-textbox .recent {color: #852ef1; font-size: 2rem; font-weight: 800; margin: 0 0 4rem;}

.production .slide-textbox a.more {font-weight: 500; color: #000;}
.production .slide-textbox a.more img {filter: grayscale(100%) brightness(0);}

.production .slide-textbox .button-box > ul > li:not(:last-child) {margin: 0 0 2.2rem;}
.production .slide-textbox .button-box > ul > li > button {font-family: 'Merriweather'; font-size: 2rem; font-weight: 400; color:rgba(0,0,0,0.3); transition: all 0.2s ease;}
.production .slide-textbox .button-box > ul > li.active > button {font-size: 4rem; font-weight: 700; color:rgba(0,0,0,1);}
.production .slide-textbox .button-box > ul > li:hover > button {color:rgba(0,0,0,1);}

.production .slide-textbox .slide-button button {border: 1px solid rgba(0,0,0,0.3);}
.production .slide-textbox .slide-button button svg {color: rgba(0,0,0,0.4);}
.production .slide-textbox .slide-button button:hover {background: #111;}
.production .slide-textbox .slide-button button:hover svg {color: #fff;}

.production .production-swiper:not(.active) {display: none;}
.production .production-swiper .swiper-wrapper {flex-flow: column wrap; height: 660px;}
.production .production-swiper .swiper-slide {position: relative; width: 350px; height: calc((100% - 60px) / 3); background:#fff;}
.production .production-swiper .swiper-slide a {display:block; width: 100%; height: 100%; padding: 3rem;}
.production .production-swiper .swiper-slide a .genre {font-size: 1.3rem; font-weight: 600; color: rgba(0,0,0,0.5); margin: 0 0 2rem;}
.production .production-swiper .swiper-slide a .title {font-family: 'Merriweather', 'Noto_Serif_KR', 'NanumMyeongjo'; font-size: 2.5rem; font-weight: 500; color: #000; line-height: 3.2rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.production .production-swiper .swiper-slide a ul {margin: 3rem 0 0;}
.production .production-swiper .swiper-slide a ul li {font-size: 1.5rem;overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.production .production-swiper .swiper-slide a ul li:not(:last-child) {margin: 0 0 1rem;}
.production .production-swiper .swiper-slide a ul li span {font-weight: 600; margin-right: 1rem;}

.production .production-swiper .swiper-slide::before, .production .production-swiper .swiper-slide::after, 
.production .production-swiper .swiper-slide a::before, .production .production-swiper .swiper-slide a::after {content:""; position: absolute; display: block; background: #ee7d00; transition: all 0.3s ease;}
.production .production-swiper .swiper-slide::before, .production .production-swiper .swiper-slide::after {top:0; left:0;}
.production .production-swiper .swiper-slide a::before, .production .production-swiper .swiper-slide a::after {bottom:0; right:0;}
.production .production-swiper .swiper-slide::before, .production .production-swiper .swiper-slide a::before {width: 2px; height: 0%;}
.production .production-swiper .swiper-slide::after, .production .production-swiper .swiper-slide a::after  {height: 2px; width: 0%;}
.production .production-swiper .swiper-slide:hover::before, .production .production-swiper .swiper-slide:hover a::before {height: 100%;}
.production .production-swiper .swiper-slide:hover::after, .production .production-swiper .swiper-slide:hover a::after {width: 100%;}




@media(max-width:1680px){
	.production .slide-textbox .button-box > ul > li > button {font-size: 1.8rem;}
	.production .slide-textbox .button-box > ul > li.active > button {font-size: 3.5rem;}
	
	.production .production-swiper .swiper-wrapper {height: 650px;}
	.production .production-swiper .swiper-slide {width: 320px; height: calc((100% - 50px) / 3);}
	.production .production-swiper .swiper-slide a .genre {margin: 0 0 1.5rem;}
	.production .production-swiper .swiper-slide a .title {font-size: 2.2rem;}
}
@media(max-width:1280px){
	.production .production-swiper .swiper-wrapper {height: 590px;}
}
@media(max-width:1024px){
	.production .slide-textbox .recent {font-size: 1.8rem;}
	
	.production .slide-textbox .button-box > ul {display: flex; align-items :center; overflow: auto;}
	.production .slide-textbox .button-box > ul::-webkit-scrollbar {display: none;}
	.production .slide-textbox .button-box > ul > li {position: relative; padding: 0 0 0.5rem;}
	.production .slide-textbox .button-box > ul > li:not(:last-child) {margin: 0 2rem 0 0;}
	.production .slide-textbox .button-box > ul > li::after {content:""; position: absolute; left:0; bottom: 0; display: block; width: 0; height: 1px; background: #000; transition: all 0.2s ease;}
	.production .slide-textbox .button-box > ul > li.active::after {width: 100%;}
	.production .slide-textbox .button-box > ul > li > button {font-size: 1.6rem; white-space: nowrap;}
	.production .slide-textbox .button-box > ul > li.active > button {font-size: 1.6rem; font-weight: 400;}
	
	.production .slide-textbox a.more {margin: 3rem 0 0 auto;}
	
	.production .production-swiper .swiper-wrapper {height: 570px;}
	.production .production-swiper .swiper-slide {height: calc((100% - 30px) / 3);}
}
@media(max-width:768px){
	.production .slide-textbox .recent {font-size: 1.6rem;}
	.production .slide-textbox a.more {font-size: 1.3rem;}
	
	.production .production-swiper .swiper-wrapper {height: 450px;}
	.production .production-swiper .swiper-slide {width: 250px;}
	.production .production-swiper .swiper-slide a {padding: 2.5rem;}
	.production .production-swiper .swiper-slide a .genre {margin: 0 0 1rem;}
	.production .production-swiper .swiper-slide a .title {font-size: 2rem;}
	.production .production-swiper .swiper-slide a ul {margin: 2rem 0 0;}
	.production .production-swiper .swiper-slide a ul li {font-size: 1.3rem;}
	.production .production-swiper .swiper-slide a ul li:not(:last-child) {margin: 0 0 0.5rem;}
}









/* New Korean Films */
.films {background: #111;}
.films .slide-textbox {background: #111;}
.films .slide-textbox .slide-title {color: #fff;}
.films .slide-textbox .slide-title span {display: block; font-weight: 100;}
.films .slide-textbox a.more {color: #fff;}

.films .slide-textbox .slide-button button {border: 1px solid #fff;}
.films .slide-textbox .slide-button button svg {color: #fff;}
.films .slide-textbox .slide-button button:hover {background: #444;}


.films .films-swiper .swiper-wrapper{}
.films .films-swiper .swiper-wrapper .swiper-slide {background : #222;}
.films .films-swiper .swiper-wrapper .swiper-slide a.thumbs {display:flex; align-items: center; justify-content:center; overflow: hidden;}
.films .films-swiper .swiper-wrapper .swiper-slide a.thumbs img {width: 100%; height: auto; transition:all 1s ease;}

.films .films-swiper .swiper-wrapper .swiper-slide .text-box {display: flex; flex-direction: column; padding: 3rem; color:#fff;}
.films .films-swiper .swiper-wrapper .swiper-slide .text-box .title {font-family: 'Merriweather', 'Noto_Serif_KR', 'NanumMyeongjo'; font-size: 2.5rem; font-weight: 300;}
.films .films-swiper .swiper-wrapper .swiper-slide .text-box .content {margin: 1.5rem 0 2rem; font-size: 1.5rem; line-height: 1.3; text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.films .films-swiper .swiper-wrapper .swiper-slide .text-box-inner {display: flex; align-items: center; justify-content: space-between; margin: auto 0 0;font-size: 1.4rem; font-weight: 500; }
.films .films-swiper .swiper-wrapper .swiper-slide .text-box-inner .date {opacity: 0.5;}
.films .films-swiper .swiper-wrapper .swiper-slide .text-box-inner .more {display:flex; align-items:center; font-family: 'Merriweather'; color: #fff; opacity: 0.5;}
.films .films-swiper .swiper-wrapper .swiper-slide .text-box-inner .more img {display:block; width: 10px; margin-left: 1rem;}

.films .films-swiper .swiper-wrapper .swiper-slide:hover a.thumbs img {transform: scale(1.1);}


@media(max-width:1680px){
	.films .films-swiper .swiper-wrapper .swiper-slide .text-box .title {font-size: 2.2rem;}
}
@media(max-width:1280px){
	.films .films-swiper .swiper-wrapper .swiper-slide .text-box-inner {font-size: 1.3rem;}
}
@media(max-width:1024px){
	.films .slide-textbox .slide-title {margin-bottom: 0rem;}
	.films .slide-textbox a.more {margin: 3rem 0 0 auto;}
	
    .films .films-swiper .swiper-wrapper .swiper-slide {width: 350px;}
}
@media(max-width:768px){
    .films .slide-textbox a.more {font-size: 1.3rem;}
    
    .films .films-swiper .swiper-wrapper .swiper-slide {width: 250px;}
   	.films .films-swiper .swiper-wrapper .swiper-slide .text-box {padding: 2.5rem;}
	.films .films-swiper .swiper-wrapper .swiper-slide .text-box .title {font-size: 2rem;}
	.films .films-swiper .swiper-wrapper .swiper-slide .text-box .content {font-size: 1.3rem;}

}




/* LATEST NEWS 뉴스 & Database 데이터베이스 */
.content-division {display: flex;}


/* LATEST NEWS */
.news {display: block; width: 60%;}
.news .slide-textbox {width: 100%; padding-right: calc((100vw - 1680px) / 2);}
.news .slide-textbox .slide-title {display:flex; align-items:center; justify-content: space-between; color: rgba(0,0,0,1);}
.news .slide-textbox .slide-title .more {position: relative; justify-content: center; width: 55px; height: 55px; border: 1px solid #000; margin: 0; border-radius: 60px; transition: all 0.2s ease;}
.news .slide-textbox .slide-title .more::before, .news .slide-textbox .slide-title .more::after {content:""; position: absolute; display: block; background: #000;}
.news .slide-textbox .slide-title .more::before {width: 17px; height: 3px;}
.news .slide-textbox .slide-title .more::after {width: 3px; height: 17px;}
.news .slide-textbox .slide-title .more:hover {transform: rotateZ(180deg);}

.news .slide-textbox .slide-textbox-inner {display: flex; align-items: center; margin: 4rem 0 0;}
.news .slide-textbox .slide-button button {border: 1px solid rgba(0,0,0,0.3);}
.news .slide-textbox .slide-button button svg {color: rgba(0,0,0,0.4);}
.news .slide-textbox .slide-button button:hover {background: #111;}
.news .slide-textbox .slide-button button:hover svg {color: #fff;}

.news .news-pagination {position: absolute; top: auto; bottom: auto; display: flex; justify-content: center; align-items: center; height: 0;}
.news .news-pagination .news-bullets {padding: 0.5rem; margin: 0 0.5rem; opacity: 0.3; cursor: pointer;}
.news .news-pagination .news-bullets::after {content:""; position: relative; display: block; width: 0.6rem; height: 0.6rem; border-radius: 0.6rem; background: #000; transition: width 0.2s ease;}
.news .news-pagination .news-bullets-active {opacity: 1;}
.news .news-pagination .news-bullets-active::after {width: 3rem;}

.news .news-swiper {margin: 0 calc((100vw - 1680px) / 2); overflow:hidden;}
.news .news-swiper .swiper-wrapper .swiper-slide {display: flex; flex-direction: column; height: unset;}
.news .news-swiper .swiper-wrapper .swiper-slide a.thumbs {display: flex; align-items: center; justify-content: center; overflow: hidden;}
.news .news-swiper .swiper-wrapper .swiper-slide a.thumbs img {width: 100%; height: auto; transition: all 1s ease;}
.news .news-swiper .swiper-wrapper .swiper-slide:hover a.thumbs img {transform: scale(1.1);}


.news .news-swiper .swiper-wrapper .swiper-slide .text-box {flex: 1; display: flex; flex-direction: column; padding: 3rem 0 0;}
.news .news-swiper .swiper-wrapper .swiper-slide .text-box .title {font-family: 'Merriweather', 'Noto_Serif_KR', 'NanumMyeongjo'; font-size: 2rem; color: #000; font-weight: 400; line-height: 1.3; text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.news .news-swiper .swiper-wrapper .swiper-slide .text-box .content {margin: 1.5rem 0 2rem; font-size: 1.5rem; line-height: 1.3; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.news .news-swiper .swiper-wrapper .swiper-slide .text-box .text-box-inner {display: flex; align-items: center; justify-content: space-between; margin: auto 0 0; font-size: 1.4rem; font-weight: 500;}
.news .news-swiper .swiper-wrapper .swiper-slide .text-box .text-box-inner .date {color: rgba(0,0,0,0.5);}
.news .news-swiper .swiper-wrapper .swiper-slide .text-box .text-box-inner .more {display: flex; align-items: center; font-family: 'Merriweather'; color: #000; opacity: 0.5;}
.news .news-swiper .swiper-wrapper .swiper-slide .text-box .text-box-inner .more img {display: block; width: 10px; margin-left: 1rem; filter: grayscale(100%) brightness(0);}


@media(max-width:1680px){
	.news .slide-textbox {padding-right: 5rem;}
	.news .slide-textbox .slide-title {margin-bottom: 4rem;}
	.news .slide-textbox .slide-title .more {width: 45px; height: 45px;}
	
	.news .news-swiper {margin: 0 5rem;}
	.news .news-swiper .swiper-wrapper .swiper-slide .text-box {padding: 2rem 0 3rem;}
	.news .news-swiper .swiper-wrapper .swiper-slide .text-box .title {font-size: 1.8rem;}
}
@media(max-width:1280px){
	.news .slide-textbox .slide-title {margin-bottom: 3rem;}
}
@media(max-width:1024px){
	.content-division {display: block;}
	
	.news {width: 100%;}
	.news .slide-textbox {padding: 0 3rem;}
	.news .slide-textbox .slide-textbox-inner {display: flex; align-items: center; margin: 2rem 0 0;}

	.news .news-swiper {margin: 0 3rem;}
	.news .news-swiper .swiper-wrapper .swiper-slide .text-box .title {font-size: 1.6rem;}
	.news .news-swiper .swiper-wrapper .swiper-slide .text-box .content {margin: 1rem 0 2rem; font-size: 1.4rem;}
	.news .news-swiper .swiper-wrapper .swiper-slide .text-box .text-box-inner {font-size: 1.3rem;}
	.news .news-swiper .swiper-wrapper .swiper-slide .text-box .text-box-inner .more img {display: block; width: 8px;}
}
@media(max-width:768px){
	.news .slide-textbox .slide-textbox-inner {margin: 1rem 0 0;}
	
	.news .slide-textbox .slide-title {margin-bottom: 2rem;}
	.news .slide-textbox .slide-title .more {width: 40px; height: 40px;}
	.news .slide-textbox .slide-title .more::before {width: 14px; height: 2px;}
	.news .slide-textbox .slide-title .more::after {width: 2px; height: 14px;}
}




/* Database 데이터베이스 */
.database {width: 40%; padding: 10rem calc((100vw - 1680px) / 2); background: #222;}
.database .database-wrap {}
.database .title {font-family: 'Merriweather'; margin-bottom: 5rem; font-size: 4.5rem; line-height: 1.2; font-weight: 700; color: #fff;}
.database .title span {display: block; font-weight: 100;}

.database .tab {margin: 0 0 3rem;}
.database .tab button {display:inline-flex; align-items: center; font-size: 1.8rem;color: rgba(255,255,255,0.5);}
.database .tab button:not(:last-child)::after {position: relative; display: block; width:1px; height: 10px; background: rgba(255,255,255,0.2); margin: 0 2rem;}
.database .tab button.active {color: #fff; font-weight: 500;}


/* database contents common */
.database .kobiz-tab-contents > ul {display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; gap: 1.5rem;}
.database .kobiz-tab-contents > ul > li {}

.database .kobiz-tab-contents > ul > li .select, .database .kobiz-tab-contents > ul > li input:not([type="radio"]), .database .kobiz-tab-contents > ul > li button:not(.select){height:4.8rem;}

.database .kobiz-tab-contents > ul > li .radio {width: 100%;}
.database .kobiz-tab-contents > ul > li .radio .check label i {color: #fff;}
.database .kobiz-tab-contents > ul > li .radio .check input[type="radio"]:checked + label i::before {border-color: #a0a0a0;}

.database .kobiz-tab-contents > ul > li .selectArea {position: relative; width: 100%;}
.database .kobiz-tab-contents > ul > li .selectArea button.select {position:relative; width:100%; height:4.8rem; padding:0 4rem 0 1.5rem; background-color:#f3f3f3; border:1px solid #cacaca; text-align:left; font-size:1.4rem; color:#666;}
.database .kobiz-tab-contents > ul > li .selectArea button.select::after {display:inline-block; width:0.8rem; height:0.8rem; right:1.5rem; top:50%; margin-top:-0.5rem; border-top:2px solid #6F36B6; border-right:2px solid #6F36B6; transform:rotate(135deg);}
.database .kobiz-tab-contents > ul > li .selectArea button.select.focus::before {display:inline-block; width:100%; height:100%; left:-1px; top:-1px; box-sizing:content-box; border:1px solid #6F36B6; border-bottom:0;}

.database .kobiz-tab-contents > ul > li .selectArea button.select + ul {display:none; position:absolute; width:100%; max-height: 30rem; overflow-x: auto; top:calc(4.8rem + 0.5rem); z-index:2; background:#fff; border:1px solid #6F36B6; z-index:4;}
.database .kobiz-tab-contents > ul > li .selectArea button.select + ul li{}
.database .kobiz-tab-contents > ul > li .selectArea button.select + ul li button{display:block; width:100%; height:4rem; padding:0 2rem; text-align:left; font-size:1.3rem; color:#111;}
.database .kobiz-tab-contents > ul > li .selectArea button.select + ul li button:hover{background:#6F36B6; color:#fff;}
.database .kobiz-tab-contents > ul > li .selectArea button.select.focus::after{transform:rotate(-45deg); margin-top:0;}


.database .kobiz-tab-contents > ul > li.contents-input {display:flex; flex-wrap: wrap; width: 100%; gap: 1.5rem;}
.database .kobiz-tab-contents > ul > li.contents-input .selectArea {width: calc((100% - 3rem) * (1 / 3));}
.database .kobiz-tab-contents > ul > li.contents-input input {flex: 1; border-left: 0; border-right: 0; padding: 0.5rem 1.5rem;}
.database .kobiz-tab-contents > ul > li.contents-input input:focus {border-color: #afafaf;}

.database .kobiz-tab-contents > ul > li.contents-input > button:not(.select) {width: 100%; background:#6F36B6; color:#fff; transition:all 0.2s ease;}
.database .kobiz-tab-contents > ul > li.contents-input > button:not(.select):hover {background:#5f29a2;}
.database .kobiz-tab-contents > ul > li.contents-input > button:not(.select) span {display:inline-block; line-height:1.3;}


.database #film.kobiz-tab-contents ul li.contents-radio {width: 100%; margin: 0 0 1rem;}
.database #film.kobiz-tab-contents ul li.contents-genre {width: calc((100% - 3rem) * (1 / 3));}
.database #film.kobiz-tab-contents ul li.contents-year {width: calc(((100% - 3rem) * (2 / 3)) + 1.5rem); display: flex; gap: 1.5rem}

.database #people {display: none;}
.database #people.kobiz-tab-contents ul li.contents-type {width: calc((100% - 1.5rem) * (1 / 2));}

.database a.opinion {display:flex; align-items:center; justify-content: center; width: 100%; height: 6rem; font-family: 'Merriweather-italic'; color: #fff; font-size: 2rem; background: #ee7d00; font-weight: 100; margin: 3rem 0 0;}
.database a.opinion span {font-family: 'Merriweather-italic'; font-weight: 400; margin-right: 0.5rem;}
.database a.opinion img {margin-left: 1rem;}



@media(max-width:1680px){
	.database {padding: 10rem 5rem;}
	.database .title {font-size: 4rem; margin-bottom: 4rem;}
	
	.database .tab button {font-size: 1.6rem;}
	
	.database .kobiz-tab-contents > ul {gap: 1rem;}
	.database .kobiz-tab-contents > ul > li.contents-input {gap: 1rem;}
	.database .kobiz-tab-contents > ul > li.contents-input .selectArea {width: calc((100% - 2rem) * (1 / 3));}
	
	.database #film.kobiz-tab-contents ul li.contents-genre {width: calc((100% - 2rem) * (1 / 3));}
	.database #film.kobiz-tab-contents ul li.contents-year {width: calc(((100% - 2rem) * (2 / 3)) + 1rem); gap: 1rem;}
	
	.database a.opinion {font-size: 1.8rem;}
}
@media(max-width:1280px){
	.database .kobiz-tab-contents > ul > li .selectArea button.select {padding: 0 3rem 0 1rem;}
	.database .kobiz-tab-contents > ul > li .selectArea button.select + ul li button {padding: 0 1rem;}
	
}
@media(max-width:1024px){
	.database {width: 100%; padding: 8rem 3rem;}
}
@media(max-width:768px){
	.database {padding: 6rem 3rem;}
	.database .title {margin-bottom: 2rem; font-size: 2.5rem;}
	
	.database .kobiz-tab-contents > ul {gap: 0.5rem;}
	.database .kobiz-tab-contents > ul > li.contents-input {gap: 0.5rem;}
	.database .kobiz-tab-contents > ul > li.contents-input .selectArea {width: calc((100% - 1rem) * (1 / 3));}
	
	.database #film.kobiz-tab-contents ul li.contents-genre {width: calc((100% - 1rem) * (1 / 3));}
	.database #film.kobiz-tab-contents ul li.contents-year {width: calc(((100% - 1rem) * (2 / 3)) + 0.5rem); gap: 0.5rem;}
	
	
	
	.database .kobiz-tab-contents > ul > li .selectArea button.select {font-size: 1.3rem; margin: 0;}
	.database .kobiz-tab-contents > ul > li .selectArea button.select + ul li button {font-size: 1.2rem;}
	
	.database a.opinion {font-size: 1.6rem; margin: 2rem 0 0;}
	.database a.opinion img {width: 25px;}
	
	
}















/* Kofic's Choice */
.choice {padding:0 0 10rem 0;}
.choice .inner{}

.choice .inner{position:relative; padding-left:84rem;}

.choice .inner .thumbs{position:absolute; width:84rem; height:100%; left:0; top:0; overflow:hidden;}
.choice .inner .thumbs mark{position:absolute; left:0; top:0; padding:4.5rem; font-size:2rem; color:#fff; background:#EE7D00; z-index:1;}
.choice .inner .thumbs img{position:absolute; max-width:initial; min-height:100%; min-width:100%; left:50%; top:50%; transform:translate(-50%, -50%);}

@media(max-width:1680px){
    .choice .inner{padding-left:60rem; margin:0 1rem;}
    .choice .inner .thumbs{width:60rem;}
}

@media(max-width:1280px){
    .choice .inner{padding-left:55.5rem;}
    .choice .inner .thumbs{width:55.5rem;}
}

@media(max-width:1180px){
    .choice .inner{padding-left:0;}
    .choice .inner .thumbs{position:relative; width:100%; height:auto;}
    .choice .inner .thumbs mark{padding:2.5rem; font-size:1.7rem;}
    .choice .inner .thumbs img{position:relative; max-width:100%; left:0; top:0; transform:initial;}
}




.choice .inner .el{position:relative;}
.choice .inner .el h3{margin-bottom:3rem; font-size:2rem; font-weight:700;}
.choice .inner .el h3 mark{display: inline-block; color:#6f36b6;}

.choice .inner .el .tab{position:absolute; right:6rem; top:4.5rem;}

@media(max-width:640px){
    .choice .inner .el .tab{position:relative; right:auto; top:auto; margin-bottom:3rem;}
}


.choice .inner .el .tab button{position:relative; padding-right:2rem; margin-right:2rem; font-size:1.5rem; color:#9a9a9a;}
.choice .inner .el .tab button::before{display:inline-block; width:0.5rem; height:0.5rem; border-radius:0.5rem; left:-1rem; top:0; background:#ee7d00; transition:all 0.2s ease; opacity:0;}
.choice .inner .el .tab button.active{font-weight:700; color:#111;}
.choice .inner .el .tab button::after{display:inline-block; width:1px; height:1rem; right:-1px; top:50%; margin-top:-0.5rem; background:#d9d9d9;}
.choice .inner .el .tab button:last-child{padding-right:0; margin-right:0;}
.choice .inner .el .tab button:last-child::after{display:none;}

.choice .inner .el .tab button:hover::before,
.choice .inner .el .tab button.active::before{top:-1rem; opacity:1;}


.choice .inner .el .kobiz-tab-contents{display:none;}
.choice .inner .el #film{display:block;}



.choice .inner .el .now {position:relative; padding:4rem 6rem; background:#f0f0f0; overflow:hidden;}

@media(max-width:1280px){
    .choice .inner .el .now{padding:4rem;}
}

@media(max-width:768px){
    .choice .inner .el .now{padding:3rem;}

    .choice .inner .el .database .kobiz-tab-contents > ul > li:nth-child(2),
    .choice .inner .el .database .kobiz-tab-contents > ul > li:nth-child(3){width:100%;}

    .choice .inner .el .database .kobiz-tab-contents > ul > li:nth-child(2){margin-bottom:1rem;}

    .choice .inner .el .database .kobiz-tab-contents > ul > li:last-child button.select{width:100%; margin-bottom:1rem;}
    .choice .inner .el .database .kobiz-tab-contents > ul > li:last-child button.select + ul{width:100%;}

    .choice .inner .el .database .kobiz-tab-contents > ul > li:last-child > input{width:calc(100% - 13rem); border-left:1px solid #cacaca;}
    
    .choice .inner .el .database #film>ul> li:nth-child(2), .choice .inner .el .database #film>ul> li:nth-child(3), 
    .choice .inner .el .database #film>ul> li:nth-child(4), .choice .inner .el .database #people>ul> li:nth-child(2) { width: 100%; margin: 1rem 0 0 0; }
    .choice .inner .el .database #film>ul> li:nth-child(1), .choice .inner .el .database #people>ul> li:nth-child(1) { width: 100%; }
    
    .choice .inner .el .database #people>ul> li:nth-child(1){ margin-top: 1.6rem; }
}


.choice .inner .now-swiper{}
.choice .inner .now-swiper .swiper-slide{}
.choice .inner .now-swiper .swiper-slide a{position:relative; display:block; height:21rem; line-height:21rem; padding-left:17rem;}
.choice .inner .now-swiper .swiper-slide a span.thumbs{position:absolute; width:15rem; height:inherit; left:0; top:0;  box-shadow:0 0 1rem rgba(0,0,0,0); transition:all 0.35s ease;}
.choice .inner .now-swiper .swiper-slide a:hover span.thumbs{transform:scale(1.03); box-shadow:0 0 1rem rgba(0,0,0,0.7);}
.choice .inner .now-swiper .swiper-slide a dl{display:inline-block; line-height:1; vertical-align:middle;}
.choice .inner .now-swiper .swiper-slide a dl dt{margin-bottom:2rem; font-size:2rem; font-weight:700;}
.choice .inner .now-swiper .swiper-slide a dl dt + dd{margin-bottom:2.5rem;}
.choice .inner .now-swiper .swiper-slide a dl dd{font-size:1.3rem; color:#666; line-height:1.35;}

.choice .func{position:absolute; right:6rem; top:4.5rem; z-index:2;}
.choice .func::before{display:inline-block; width:1px; height:1rem; left:50%; top:50%; margin-top:-0.5rem; background:#cacaca;}
.choice .func button{width:5rem; height:2rem; font-size:0; opacity:0.5; transition:all 0.3s ease;}
.choice .func button img{vertical-align:middle;}
.choice .func button:hover{opacity:1;}

@media(max-width:1280px){
    .choice .func{right:2rem;}
}

@media(max-width:1280px){
    .choice .inner .now-swiper{overflow:hidden;}
}













/* KOREAN ACTORS 200 */

.actors{margin-bottom:10rem;  overflow:hidden;}
.actors .inner{position:relative; height:248px; line-height:248px; padding:0 7rem; background:#000 url(../img/main/actors_bg.jpg) no-repeat right top; background-size:cover; font-size:0;}
.actors .inner > i{position:absolute; width:28rem; height:28rem; border-radius:28rem; right:50rem; top:-18rem; border:1px solid rgba(255,255,255,0.18); z-index:3;}
.actors .inner > i::after{display:inline-block; width:1.2rem; height:1.2rem; border-radius:1.2rem; right:4rem; bottom:2.8rem; background:#ee7d00;}

.actors .inner .el{position:relative; display:inline-block; vertical-align:middle; line-height:1; z-index:2;}
.actors .inner sup{ color:#cb9a63; font-size:1.4rem; font-weight: 400; }
.actors .inner h3{margin:1rem 0 3rem 0; font-size:3.6rem; color:#fff;}
.actors .inner h3 i{ margin-right: 5px; font-family: "TimesNewerRoman"; font-style:italic;}
.actors .inner h3 em{}

.actors .inner a.more{position:relative; display:inline-block; padding-right:4rem; font-size:1.4rem; color:#fff;}
.actors .inner a.more::after{display:inline-block; width:3rem; height:3rem; border-radius:3rem; right:0; top:50%; margin-top:-1.5rem; background:#ee7d00 url(../img/main/icon_actors_more.svg) no-repeat center;}

.actors .inner .actors-swiper{position:absolute; width:689px; height: 248px; right:0; top:0; font-size:0; overflow:hidden; text-align:right; background: url(../img/main/actors200/actors_bg.png) no-repeat right top;}
.actors .inner .actors-swiper .swiper-slide{position:relative;}
.actors .inner .actors-swiper .swiper-slide>img{min-height:248px; max-width:initial;}
.actors .inner .actors-swiper .swiper-slide .name{position:absolute; left:15rem; top:40%;  line-height:1;}
.actors .inner .actors-swiper .swiper-slide .name em{display:block; margin-bottom:1rem; font-size:2rem; color:#fff; font-family: "TimesNewerRoman"; font-weight:400; text-shadow: 0 0 10px #444;}
/* .actors .inner .actors-swiper .swiper-slide .name sub{font-size:1.2rem; color:rgba(255,255,255,0.5); letter-spacing:1px;} */
.actors .inner .actors-swiper .swiper-slide .name sub>img{ position: relative; }


@media(max-width:1280px){
    .actors .inner{padding:0 3rem; background-position:80% top}

    .actors .inner > i{right:40rem;}
    .actors .inner h3 i{display:block;}

    .actors .inner .actors-swiper .swiper-slide .name{left:25rem;}
}

@media(max-width:1024px){
    .actors .inner i{right:30rem;}

    .actors .inner h3{font-size:3rem;}

    .actors .inner .actors-swiper .swiper-slide .name{left:35rem;}
}

@media(max-width:768px){
    .actors{padding-top:20rem;}

    .actors .inner .el{top:-20rem; width:100%; vertical-align:top; text-align:center; background:#fff;}

    .actors .inner h3{color:#111;}
    .actors .inner h3 i{display:block; margin-bottom:0.5rem;}
    .actors .inner a.more{color:#111;}

    
    .actors .inner i{display:none;}

    .actors .inner .actors-swiper{width:100%; right:0;}
    .actors .inner .actors-swiper .swiper-slide{position:relative; height:248px;}
    .actors .inner .actors-swiper .swiper-slide img{position:absolute; right:0; top:0;}
    .actors .inner .actors-swiper .swiper-slide .name{left:2rem; bottom:5rem; top:auto;}
}




















/* Korea News */
.korea{padding:10rem 0 14rem 0; overflow:hidden;}

.korea h3{margin-bottom:5rem; font-size:2.4rem; color:#4b4b4b; text-align:center; font-weight:700;}
.korea .inner{}
.korea .inner ul{}
.korea .inner ul li{position:relative; float:left; width:calc(25% - 7.5rem); margin-right:10rem;}
.korea .inner ul li::after{display:inline-block; width:1px; height:100%; right:-5rem; top:0; background:#cacaca;}
.korea .inner ul li:last-child{margin-right:0;}
.korea .inner ul li:last-child::after{display:none;}
.korea .inner ul li a{}
.korea .inner ul li a em{font-size:2rem; color:#323232;}
.korea .inner ul li a span{margin:2rem 0; font-size:1.3rem; color:#666; line-height:1.3;}
.korea .inner ul li a sub{display:block; font-size:1.2rem; color:#666; text-align:right;}


.korea a.more{display:block; height:3rem; margin-top:5rem; background:url(../img/main/icon_rank_more.svg) no-repeat center;}

@media(max-width:1680px){
    .korea .inner{margin:0 1rem;}

    .korea .inner ul li{width:calc(25% - 4.5rem); margin-right:6rem;}
    .korea .inner ul li::after{right:-2rem;}
}


@media(max-width:1024px){
    .korea{padding:5rem 0;}

    .korea .inner ul{position:relative;}
    .korea .inner ul::before{display:inline-block; width:100%; height:1px; left:0; top:50%; background:#eee;}
    .korea .inner ul li{width:calc(50% - 3rem);}
    .korea .inner ul li:nth-child(2n){margin-right:0;}
    .korea .inner ul li:nth-child(n + 3){margin-top:6rem;}
}

@media(max-width:640px){
    .korea .inner ul::before{display:none;}
    .korea .inner ul li{width:100%; margin-right:0; padding-bottom:3rem; margin-bottom:3rem; border-bottom:1px solid #eee;}
    .korea .inner ul li:nth-child(n + 2){margin-top:0;}

    .korea .inner ul li:last-child{padding-bottom:0; margin-bottom:0; border-bottom:0;}
}