#youtube {
    width: 60vw;
    height: 60vh;
}

.book-min-height {
    min-height: 450px;
}

@media(min-width: 580px) and (max-width: 1280px) {
    #youtube {
        width: 60vw;
        height: 60vh;
    }
    .book-min-height {
        min-height: unset;
    }
}

@media(max-width: 576px) {
    #youtube {
        width: 100vw;
        height: 300px;
    }
    .book-min-height {
        min-height: unset;
    }
}

.arrow-btn {
    position: absolute;
    bottom: 15px;
    margin-top: 15px;
    width: 40px;
    height: 40px; 
    background-image: linear-gradient(170deg, #0E37BD, #009BDB); 
    border: 0px solid white; 
    border-radius: 50%;
}

.book:hover h1 {
    color: white !important;
}
.book:hover span {
    color: white !important;
}
.book:hover p {
    color: white !important;
}
.book:hover .cursor-pointer {
    width: 40px !important;
    height: 40px !important;
    background: white !important;
    border: 2px solid white !important;
    border-radius: 50% !important;
}
.book:hover i {
    color:#0663bb !important;
    margin-left: 2px !important;
    margin-top: 12px !important;
}
.book:hover .arrow-btn {
    background-image: linear-gradient(170deg, white, white) !important; 
}

.book1-section {
    background-image: url(/img/book_1.png);
}
.book1-section:hover {
    background-image: url(/img/book_1_blue.png);
}
.book2-section {
    background-image: url(/img/book_2.png);
}
.book2-section:hover {
    background-image: url(/img/book_2_blue.png);
}
.book3-section {
    background-image: url(/img/book_3.png);
}
.book3-section:hover {
    background-image: url(/img/book_3_blue.png);
}
.book4-section {
    background-image: url(/img/book_4.png);
}
.book4-section:hover {
    background-image: url(/img/book_4_blue.png);
}
.book5-section {
    background-image: url(/img/book_5.png);
}
.book5-section:hover {
    background-image: url(/img/book_5_blue.png);
}
.book6-section {
    background-image: url(/img/book_6.png);
}
.book6-section:hover {
    background-image: url(/img/book_6_blue.png);
}
.book7-section {
    background-image: url(/img/book_7.png);
}
.book7-section:hover {
    background-image: url(/img/book_7_blue.png);
}

.book-hwhworld-section {
    background-image: url(/img/sharing_img_1.png);
}
.book-hwhworld-section:hover {
    background-image: url(/img/sharing_img_1_blue.png);
}
.book-rbc-section {
    background-image: url(/img/sharing_img_2.png);
}
.book-rbc-section:hover {
    background-image: url(/img/sharing_img_2_blue.png);
}

.book-aami-section {
    background-image: url(/img/securities_img_1.png);
}
.book-aami-section:hover {
    background-image: url(/img/securities_img_1_blue.png);
}
.book-alset-section {
    background-image: url(/img/securities_img_2.png);
}
.book-alset-section:hover {
    background-image: url(/img/securities_img_2_blue.png);
}


.home-banner-container .home-banner-div-1{
    padding-left: 350px;
    padding-right: unset;
}
.home-banner-container .home-banner-div-2{
    padding-left: 120px;
}

.home-banner-container .home-banner-div-1 span {
    font-size: 37.5px;
}

.home-banner-container .home-banner-div-2 span {
    font-size: 20px;
}
.home-banner-title {
    font-size: 48px;
}

.title-font-size {
    font-size: 32px;
}
.content-font-size {
    font-size: 16px;
}

.core-title-font-size {
    font-size: 37.5px;
}
.core-content-font-size {
    font-size: 20px;
}

@media(max-width: 1920px) {
    .home-banner-container .home-banner-div-1{
        padding-left: 250px;
        padding-right: 0;
    }
    .home-banner-container .home-banner-div-2{
        padding-left: 115px;
        padding-right: 0;
    }
    .home-banner-container .home-banner-div-1 span {
        font-size: 37.5px !important;
    }
    .home-banner-container .home-banner-div-2 span {
        font-size: 20px !important;
    }
    .title-font-size {
        font-size: 32px;
    }
    .content-font-size {
        font-size: 16px;
    }
    .core-title-font-size {
        font-size: 37.5px;
    }
    .core-content-font-size {
        font-size: 20px;
    }
}

@media(min-width: 1240px) and (max-width: 1520px) {
    .home-banner-container .home-banner-div-1{
        padding-left: 200px;
        padding-right: 0;
    }
    .home-banner-container .home-banner-div-2{
        padding-left: 80px;
        padding-right: 0;
    }
    .home-banner-container .home-banner-div-1 span {
        font-size: 32px !important;
    }
    .home-banner-container .home-banner-div-2 span {
        font-size: 20px !important;
    }
    .title-font-size {
        font-size: 32px;
    }
    .content-font-size {
        font-size: 16px;
    }
    .core-title-font-size {
        font-size: 32px;
    }
    .core-content-font-size {
        font-size: 18px;
    }
}

@media(min-width: 880px) and (max-width: 1240px) {
    .home-banner-container .home-banner-div-1{
        padding-left: 90px;
        padding-right: 0;
    }
    .home-banner-container .home-banner-div-2{
        padding-left: 75px;
        padding-right: 0;
    }
    .home-banner-container .home-banner-div-1 span {
        font-size: 32px !important;
    }
    .home-banner-container .home-banner-div-2 span {
        font-size: 20px !important;
    }
    .title-font-size {
        font-size: 32px;
    }
    .content-font-size {
        font-size: 16px;
    }
    .core-title-font-size {
        font-size: 32px;
    }
    .core-content-font-size {
        font-size: 18px;
    }
}

@media(min-width: 768px) and (max-width: 880px) {
    .home-banner-container .home-banner-div-1{
        padding-left: 20px;
        padding-right: 20px;
    }
    .home-banner-container .home-banner-div-2{
        padding-left: 0px;
        padding-right: 20px;
    }
    .home-banner-container .home-banner-div-1 span {
        font-size: 32px !important;
    }
    .home-banner-container .home-banner-div-2 span {
        font-size: 20px !important;
    }
    .home-banner-title {
        font-size: 38px;
    }
    .title-font-size {
        font-size: 32px;
    }
    .content-font-size {
        font-size: 16px;
    }
    .core-title-font-size {
        font-size: 32px;
    }
    .core-content-font-size {
        font-size: 18px;
    }
}

@media(max-width: 768px) {
    .home-banner-container .home-banner-div-1{
        padding-left: 0;
        padding-right: 0;
    }
    .home-banner-container .home-banner-div-2{
        padding-left: 0;
        padding-right: 0;
    }
    .home-banner-container .home-banner-div-1 span {
        font-size: 32px !important;
    }
    .home-banner-container .home-banner-div-2 span {
        font-size: 16px !important;
    }
    .home-banner-title {
        font-size: 32px;
    }
    .title-font-size {
        font-size: 32px;
    }
    .content-font-size {
        font-size: 16px;
    }
    .core-title-font-size {
        font-size: 32px;
    }
    .core-content-font-size {
        font-size: 18px;
    }
}