@charset "utf-8";

.hallymer-recent{padding: 122px 0 255px 0; position: relative; max-width: 1920px; margin: 0 auto;}
.hallymer-recent::after{content:""; display: block; position: absolute; left: -119px; bottom: 0; width: 794px; height: 794px; background: url(../images/hallymer_background.png) no-repeat center center / cover; z-index: -1;}
.hallymer-inner{max-width: 1780px; padding: 0 30px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between;}
.hallymer-title{width: 33.14%; margin-left: -100px; opacity: 0; position: sticky; top: 122px; align-self: flex-start; height: 1180px;}
.hallymer-title h2{font-size: 36px; letter-spacing: -.05em; color: #000000; font-family: "SBA Medium"; margin-bottom: -36px; max-width: 400px; text-align: justify; position: relative;}
.hallymer-title h2 i{display: none;}
.hallymer-title h2::after{content:""; width: 100%; display: inline-block;}
.hallymer-title .hallymer-text{text-align: justify; max-width: 400px; text-align-last: justify;}
.hallymer-title .hallymer-text::after{content:""; display: inline-block; width: 100%;}
.hallymer-title h1{font-size: 70px; line-height: 92px; letter-spacing: -.05em; color: #000000; font-family: "SBA Light";  display: inline-block;}
.hallymer-title h1 .bold{font-family: "SBA Medium"; color: #000000;}
.hallymer-link{border: 1px solid #000000; display: inline-block; font-size: 17px; color: #000000; font-family: "SBA Light"; position: relative; padding: 22px 112px 22px 25px; margin-top: 18px; background-color: white;}
.hallymer-link::after{content:""; display: block; position: absolute; width: 67px; height: 11px; right: 24px;top: 50%; margin-top: -6px; background: url(../images/hallymer_arrow.png) no-repeat center center / cover;}
.hallymer-link:hover{background-color: #1174ff; color: white; border: 1px solid #1174ff;}
.hallymer-link:hover::after{background: url(../images/hallymer_arrow_hover.png) no-repeat center center / cover;}
.hallymer-list{width: 66.86%;}
.hallymer-list > button{display: none;}
.hallymer-list .list ul{display: flex; flex-wrap: wrap; margin: 0 -25px; align-items: start;}
.hallymer-list .list li{width: 33.3333%; padding: 0 25px; margin-top: 50px; position: relative; opacity: 0; transition: all 1s;}
.hallymer-list .list li:nth-child(3n+1){top: 277px;}
.hallymer-list .list li:nth-child(3n+2){top: 71px;}
.hallymer-list .list li:nth-child(3n+3){top: 167px;}
.hallymer-list .list li a{width: 100%; height: 100%; display: block; position: relative; border-radius: 20px; overflow: hidden;}
.hallymer-list .list li a::before{content:""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(0deg,rgba(0, 0, 0, .65) 0%,rgba(255, 255, 255, .0) 75%, rgba(255, 255, 255, 0) 100%); z-index: 1;}
.hallymer-list .list .thumb{position: relative; border-radius: 20px; overflow: hidden; padding-bottom: 525px;}
.hallymer-list .list .thumb img{position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; transition: all .5s;}
.hallymer-list .list .con{position: absolute; left: 0; bottom: 0; width: 100%; padding: 0 34px 36px; z-index: 2;}
.hallymer-list .list .con .subjectText > span{font-size: 22px; line-height: 30px; color: white; font-family: "SBA Medium"; display: block; margin-bottom: 10px;}
.hallymer-list .list .con .content {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis;}
.hallymer-list .list .con .content  > span{font-size: 16px; line-height: 22px; color: white; display: block;}

.hallymer-list .list .con .subjectText span span{background-image: linear-gradient(#ffffff, #ffffff); background-repeat: no-repeat; background-position: left 0 bottom 0; background-size: 0 1px; transition: background-size .5s;}

.hallymer-list .list .subject:hover .thumb img{transform: scale(1.1);}
.hallymer-list .list .subject:hover .subjectText span span{background-size: 100% 1px;}

.hallymer-inner .hallymer-list .list li.active{opacity: 1;}
.hallymer-inner .hallymer-list .list li.active:nth-child(3n+1){top: 177px;}
.hallymer-inner .hallymer-list .list li.active:nth-child(3n+2){top: -31px;}
.hallymer-inner .hallymer-list .list li.active:nth-child(3n+3){top: 67px;}

@media screen and (max-width: 1350px) {
	.hallymer-title{width: 40%;}
	.hallymer-list{width: 60%;}
}

@media screen and (max-width: 1200px) {
	.hallymer-recent{padding: 70px 0 210px 0;}
	.hallymer-recent::after{width: 479px; height: 479px; background: url(../images/tablet_hallymer_background.png) no-repeat center center / cover; bottom: -12px; left: -58px;}
	.hallymer-title{height: 1000px;}
	.hallymer-title h2{font-size: 26px; margin-bottom: -34px; max-width: 285px;}
	.hallymer-title h1{font-size: 50px; line-height: 60px;}
	.hallymer-title .hallymer-text{max-width: 285px;}
	.hallymer-link{font-size: 17px; line-height: 24px; max-width: 290px; padding: 15px 22px 15px 25px}
	.hallymer-link::after{margin-top: 8px;}
	.hallymer-list .list ul{margin: 0 -15px;}
	.hallymer-list .list li{width: 50%; padding: 0 15px;}
	.hallymer-list .list .thumb{padding-bottom: 375px;}
	.hallymer-inner .hallymer-list .list li.active:nth-child(3n+1),
	.hallymer-inner .hallymer-list .list li.active:nth-child(3n+2),
	.hallymer-inner .hallymer-list .list li.active:nth-child(3n+3){top: auto;}
	.hallymer-inner .hallymer-list .list li:nth-child(odd){top: 171px !important;}
	.hallymer-inner .hallymer-list .list li:nth-child(even){top: 61px !important;}
	.hallymer-inner .hallymer-list .list li:nth-child(n+7){display: none;}
	.hallymer-list .list .con{padding: 0 25px 28px;}
	.hallymer-list .list .con .subjectText span{font-size: 18px; line-height: 24px;}
	.hallymer-list .list .con .content span{font-size: 14px; line-height: 20px;}

    .hallymer-inner .hallymer-list .list li.active:nth-child(odd){top: 71px !important;}
    .hallymer-inner .hallymer-list .list li.active:nth-child(even){top: -41px !important;}
}

@media screen and (max-width: 768px) {
	.hallymer-recent{padding: 60px 0 138px 0;}
	.hallymer-inner{flex-direction: column; padding: 0;}
	.hallymer-recent::after{background: url(../images/mobile_hallymer_background.png) no-repeat center center / cover; width: 463px; height: 479px; bottom: 3px; left: -57px;}
	.hallymer-title{position: static; height: auto;}
	.hallymer-title{width: 100%; padding: 0 20px;}
	.hallymer-title h1 i{display: none;}
	.hallymer-title h2{max-width: none; margin-bottom: -37px;}
	.hallymer-title h2 i{display: inline;}
	.hallymer-title .hallymer-text{max-width: none;}
	.hallymer-title h1{font-size: 45px; line-height: 60px;}
	.hallymer-title h1 span{white-space: nowrap;}
	.hallymer-title h1 span br{display: none;}
	.hallymer-list{width: 100%; position: relative;}
	.hallymer-list > button{display: block; position: absolute; background: url(../images/hallymer_button.png) no-repeat; width: 100px; height: 100px; z-index: 10; font-size: 0; top: 50%; margin-top: -50px;}
	.hallymer-list > button.hallymer-prev{left: 10px; background-position: left center;}
	.hallymer-list > button.hallymer-next{background-position: right center; right: 10px;}
	.hallymer-list .list li{top: 0 !important; margin-top: 0; opacity: 1 !important;}
	.hallymer-inner .hallymer-list .list li.active:nth-child(odd),
	.hallymer-inner .hallymer-list .list li.active:nth-child(even){top: 0 !important;}
	.hallymer-inner .hallymer-list .list li:nth-child(n+7){display: block;}
	.hallymer-list .list .thumb{padding-bottom: 525px;}
	.hallymer-list .list .con .subjectText span{font-size: 22px; line-height: 30px;}
	.hallymer-list .list .con .content span{font-size: 16px; line-height: 22px;}
	.hallymer-link{position: absolute; left: 20px; bottom: 30px; width: calc(100% - 40px); max-width: none; padding: 29px 25px 25px;}
	.hallymer-link::after{margin-top: -4px;}
}