/******** EU Cookie Top Info Banner START ********/

.eu_cookies_container {
    background-color: #f4f3f8;
    position: relative;
    display: none;
}

.top_info_banner_eu_cookies {
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

.eu_cookies_text {
    color: #404050;
    font-size: 14px;
    padding: 16px 64px 16px 24px;
    font-family: Helvetica, Arial, "&#12513; &#12452; &#12522; &#12458; ", Meiryo, "&#12498; &#12521; &#12462; &#12494; &#35282; &#12468; Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
}

.eu_cookies_text a {
    font-weight: bold;
    color: #000;
}

.close_button_eu_cookies {
    height: auto;
    position: absolute;
    cursor: pointer;
    width: 12px;
    right: 35px;
    top: 20px;
}

.eu_cookies_container_mobile{
	display:none;
	background-color:#f4f3f8;
	padding:20px;
	position:relative;
	box-sizing: border-box;
}

.close_button_eu_cookies_mobile{
	width:16px;
	height: auto;
	position:absolute;
	right:20px;
	top:50%;
	margin-top: -10px;
}

.top_info_banner_eu_cookies{
	word-wrap: break-word;
}

.top_info_banner_eu_cookies a{
	display:inline-block;
	font-weight: bold;
	text-decoration: underline;
	color:#404050;
	margin-top:5px;
}

.ha.top_info_banner_eu_cookies a {
	margin-top: 0;
}

.eu_cookies_container_mobile .eu_cookies_text{
    color:#404050;
    padding: 0px 30px 0px 0px;
    text-align: left;
}

/******** EU Cookie Top Info Banner END ********/

/*
Header Banner
*/
html:lang(jp) #floated_bottom_campaign_banner_japan {
    height: 100px;
    width: 100%;
    position: fixed;
    bottom: 0;
    z-index: 2;
}

html:lang(jp) #floated_bottom_campaign_banner_japan.bg_jp {
    background: url('https://file.veltra.com/jp/promotion/onlineacademy/bnr/MO_veltra_online-academy-bg.jpg') repeat center top;
    background-size: cover;
    background-position: 0px 60px;
    height: 60px;
    box-sizing: border-box;
}

html:lang(jp) #floated_bottom_campaign_banner_japan .container {
    text-align: left;
}

html:lang(jp) #floated_bottom_campaign_banner_japan .container img {
    height: auto;
    box-sizing: border-box;
}

html:lang(jp) #floated_bottom_campaign_banner_japan .container img {
    margin: 0 auto;
    margin-right: 15px;
    width: 205px;
}

html:lang(jp) #floated_bottom_campaign_banner_close img {
    opacity: 1;
}

html:lang(jp) #floated_bottom_campaign_banner_japan .container {
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2);
    margin-top: -1px;
}

html:lang(jp) #floated_bottom_campaign_banner_close {
    top: calc(50% - 8px);
    top: -webkit-calc(50% - 8px);
    right: 10px;
}

html:lang(jp) #floated_bottom_campaign_banner_japan.jp-coupon {
    position: static;
    height: auto;
}

html:lang(jp) #floated_bottom_campaign_banner_japan.jp-coupon .floated_bottom_campaign_banner_wrapper {
    position: relative;
    background: url(/_tr/vt/1/img/header-sp-branding-july-2025.png) no-repeat;
    background-color: #FFEE57;
    background-size: auto 100%;
    background-position: top center;
    width: 100%;
    height: 50px;
}

html:lang(jp) #floated_bottom_campaign_banner_japan.jp-coupon .floated-header-banner.even .floated_bottom_campaign_banner_wrapper {
    background-image: url('/_tr/vt/1/img/header-sp-branding-may-2025.png');
    background-color: #FF5C8A;
}

html:lang(jp) #floated_bottom_campaign_banner_japan.jp-coupon .floated-header-banner.non-jp-header .floated_bottom_campaign_banner_wrapper {
    background-image: url('/_tr/vt/1/img/header-sp-branding-june-2025.png');
}

html:lang(jp) #floated_bottom_campaign_banner_japan.jp-coupon .container img {
    width: 100%;
}

html:lang(jp) #mobile_footer.showing_bottom_floated_banner {
    padding-bottom: 120px;
}

#floated_bottom_campaign_banner {
    background: #FF403B url(/_tr/vt/1/img/mobile/mobile_new_year_bg_2018.jpg) repeat center top;
    display: none;
    height: 100px;
    width: 100%;
    position: fixed;
    bottom: 0;
    z-index: 2;
}

.floated_bottom_campaign_banner_wrapper {
    position: relative;
}

#floated_bottom_campaign_banner_close {
    position: absolute;
    right: 10px;
    text-align: center;
    height: 30px;
    width: 40px;
    top: 0;
}

#floated_bottom_campaign_banner_close img {
    height: auto;
    width: 16px;
    opacity: 0.6;
}

#floated_bottom_campaign_banner .container {
    margin-top: 10px;
    text-align: center;
}

#floated_bottom_campaign_banner .container img {
    height: auto;
    box-sizing: border-box;
    margin: 0 25px;
    /*max-width: 85%;*/
}

#floated_bottom_campaign_banner_close img {
    height: auto;
    width: 16px;
}

#ha-banner-grid-list-container {
    background-color: #fff;
    padding-left: 24px;
    padding-right: 24px;
    padding-bottom: 40px;
}

.ha-banner-grid-list {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: .75rem .75rem;
}

.ha-banner-grid-list img {
    width: 100%;
}

/* Portal Content START */

.cs-portal-modal-button {
    background: #EFF4FA;
    border: 1px solid #0077D9;
    cursor: pointer;
    color: #0077D9;
}

.cs-portal-modal-button:hover {
    border-color: #376DAB;
    color: #376DAB;
}

.collapse-link {
    gap: 8px;
    grid-row-gap: 8px;
    grid-column-gap: 8px;
    overflow: hidden;
}

.collapse-link.short {
    height: 200px;
}

.collapse-link a:visited {
    color: #484848;
}

.border-blue {
    border: 1px solid #0077D9;
}

.border-light-gray {
    border: 1px solid #D9D9D9;
}

.height-30 {
    height: 30px;
}

.height-32 {
    min-height: 32px;
}

.height-36 {
    min-height: 36px;
}

.line-height-19 {
    line-height: 19.6px;
}

.mb-18 {
    margin-bottom: 18px;
}

#cs-spot-mobile-modal .cs-spot-toggle-show {
    color: #0077D9;
    display: block;
    text-align: right;
    padding: 10px;
}

#cs-spot-mobile-modal .cs-spot-toggle-show[data-type="less"] {
    display: none;
}

#cs-spot-mobile-modal a:hover {
    text-decoration: none;
}

#cs-spot-mobile-modal a.cs-spot-area-top:visited {
    color: #0077D9;
}

.search-by-category-target.active:not(.nobg-active) {
    background-color: #EFF4FA;
}

.search-by-category-target.selected>.item-extra-info .icon-black,
.search-by-category-target.selected>.item-extra-info .text-black {
    color: #fff
}

.search-by-category-target .item-extra-info {
    padding: 0 12px
}

.search-by-category-target.child-category .item-extra-info {
    padding: 0 24px
}

.search-by-category-target.no-child .item-extra-info.selected .item-name.text-black {
    color: #fff
}

.item-extra-info .item-name.text-black {
    padding: 12px 12px 12px 0
}

.item-extra-info .item-name.no-child {
    padding: 10px 24px 10px 24px
}

.search-by-category-target.last-ctg-child .item-extra-info .item-name.text-black {
    padding: 8px 36px
}

.search-by-category-target.hide {
    display: none
}

.search-by-category-target a.selected {
    background-color: #2379c3;
    color: #fff
}

.search-by-category .accordion .icon-20 {
    font-size: 12px;
    color: #555;
    flex-grow: 1;
    text-align: right;
    padding: 14px 0;
}

.portal-category-link.hide-category, 
.search-by-category-target.hide-cs-category, 
.portal-genre-link.hide-genre {
    display: none !important;
}

.portal-category-link.hide-category.show, 
.search-by-category-target.hide-cs-category.show, 
.portal-genre-link.hide-genre.show {
    display: block !important;
}

.portal-category-link.active {
    background-color: #EFF4FA;
}

#portal-category-modal .portal-category-item-list-toggle, 
#portal-category-modal .cs-category-item-list-toggle, 
#portal-genre-modal .portal-genre-list-toggle {
    display: block;
    text-align: right;
    padding: 10px;
}

.hide-category-btn,
.category-list-sp-hide-category-btn {
    display: none;
}

.category-name-container:not(.hide-category-btn),
.category-list-sp-category-name-container:not(.category-list-sp-hide-category-btn) {
    display: flex;
    max-width: 100%;
}

.pagination-box.end-page a {
    color: #0077D9 !important;
}

/* Portal Content END */

@media screen and (max-width:320px) {
    html:lang(jp) #floated_bottom_campaign_banner_japan .container img {
        width: 290px;
    }

    html:lang(jp) #floated_bottom_campaign_banner_japan .container {
        margin-top: 1px;
    }
}

@media (min-width: 768px) {

    html:lang(jp) #floated_bottom_campaign_banner_japan.jp-coupon .floated-header-banner .floated_bottom_campaign_banner_wrapper {
        background-image: url('/_tr/vt/1/img/header-dt-branding-july-2025.png');
    }

    html:lang(jp) #floated_bottom_campaign_banner_japan.jp-coupon .floated-header-banner.even .floated_bottom_campaign_banner_wrapper {
        background-image: url('/_tr/vt/1/img/header-dt-branding-may-2025.png');
    }

    html:lang(jp) #floated_bottom_campaign_banner_japan.jp-coupon .floated-header-banner.non-jp-header .floated_bottom_campaign_banner_wrapper {
        background-image: url('/_tr/vt/1/img/header-dt-branding-june-2025.png');
    }
}

@media screen and (min-width: 992px) {
    .eu_cookies_container_mobile{
        color: #404050;
        font-size: 14px;
        padding: 16px 64px 16px 24px;
        font-family: Helvetica, Arial, "&#12513; &#12452; &#12522; &#12458; ", Meiryo, "&#12498; &#12521; &#12462; &#12494; &#35282; &#12468; Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
    }
    
    .close_button_eu_cookies_mobile{
        height: auto;
        position: absolute;
        cursor: pointer;
        width: 12px;
        right: 35px;
        top: 20px;
        margin-top: auto;;
    }

    .eu_cookies_container_mobile .eu_cookies_text{
        text-align: center;
        margin: 0px;
        line-height: 0px;
    }

    .ha-banner-grid-list {
        display: flex;
        justify-content: center;
    }

    .ha-banner-grid-list a {
        flex-basis: 342px;
    }

    .ha-banner-grid-list img {
        width: 412px;
    }
}

@media screen and (orientation:landscape) {
    html:lang(jp) #floated_bottom_campaign_banner_japan .container img {
        margin-right: 0;
    }
}