.header2 .nav .nav-icon.active div, .sub_wrap .header2 .nav .nav-icon.active:after, .sub_wrap .header2 .nav .nav-icon.active:before, .white header .header2 .nav .nav-icon div, .white header .header2 .nav .nav-icon:after, .white header .header2 .nav .nav-icon:before, header.down .header2 .nav .nav-icon div, header.down .header2 .nav .nav-icon:after, header.down .header2 .nav .nav-icon:before, header.sticky-header { background-color: #fff; } .btn_box, .container, .header1 .gnb, .header1 .gnb > li, .header2 .nav .nav-icon, body, table { position: relative; } .discography_slide.album_box li .txt, .discography_slide.album_box li span, .header1 .gnb.color > li.off > a, .header1 .gnb > li.on > a, .language, body, html { color: #111; } .cate, .date { font-size: 0.83rem; } .drag_section, .language > li ul, .sub_wrap, .visual_section .swiper-slide, .visual_slide_box { overflow: hidden; } .big_ttl, .f82, .f96, :lang(ja) .actors .actors_history li .txt p, :lang(ja) .actors_txt .txt p, :lang(ja) .artists_history .history .txt, :lang(ja) .brand_cont .brand_txt p, :lang(ja) .brand_cont .txt p, :lang(ja) .brand_identity .ly_flex .txt p, :lang(ja) .brand_spirit ul li.f20, :lang(ja) .brand_statement .ly_flex .f20, :lang(ja) .brand_txt p, :lang(ja) .compliance_utilize ul li p, :lang(ja) .discography_cont .body_box p, :lang(ja) .esg_box p, :lang(ja) .esg_certification ul li p, :lang(ja) .guide_list li p, :lang(ja) .offfice_cont .box .box_inner p, :lang(ja) .offfice_scroll p, :lang(ja) .social_contribution ul li .txt p, :lang(ja) .with_box .with_cont p, :lang(zh) .actors .actors_history li .txt p, :lang(zh) .actors_txt .txt p, :lang(zh) .artists_history .history .txt, :lang(zh) .brand_cont .brand_txt p, :lang(zh) .brand_cont .txt p, :lang(zh) .brand_identity .ly_flex .txt p, :lang(zh) .brand_spirit ul li.f20, :lang(zh) .brand_statement .ly_flex .f20, :lang(zh) .brand_txt p, :lang(zh) .compliance_utilize ul li p, :lang(zh) .discography_cont .body_box p, :lang(zh) .esg_box p, :lang(zh) .esg_certification ul li p, :lang(zh) .guide_list li p, :lang(zh) .offfice_cont .box .box_inner p, :lang(zh) .offfice_scroll p, :lang(zh) .social_contribution ul li .txt p, :lang(zh) .with_box .with_cont p { word-break: break-all; } @font-face { font-family: HelveticaWorld; src: url("/src/fonts/HelveticaWorld-Regular.ttf"); font-weight: 400; font-style: normal; } @font-face { font-family: HelveticaWorld; src: url("/src/fonts/HelveticaWorld-Bold.ttf"); font-weight: 700; font-style: bold; } @font-face { font-family: HelveticaWorld; src: url("/src/fonts/HelveticaWorld-Italic_0.ttf"); font-weight: italic; font-style: italic; } body, html { font-family: HelveticaWorld, rixsingose-pro, sans-serif; } html { font-size: 112.5%; word-break: keep-all; } body.hidden, html.hidden { display: block; overflow: auto; } body { margin: 0; padding: 0; line-height: 1; } body * { box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; } .artists_slide_txtli, dd, dl, dt, figure, ol, p, ul { list-style: none; padding: 0; margin: 0; } a { text-decoration: none; color: inherit; outline: 0; } table { width: 100%; border-collapse: collapse; border-spacing: 0; } img { vertical-align: middle; max-width: 100%; } h1, h2, h3, h4, h5, h6 { font-family: inherit; color: inherit; margin: 0; } button, input, select, textarea { font-family: inherit; color: inherit; padding: 0; } button { border: 0; } html section { word-break: break-word; } input::-moz-input-placeholder { color: #a9a8a8; } input::-o-input-placeholder { color: #a9a8a8; } .container { width: 100%; max-width: 90vw; margin: 0 auto; } header { width: 100%; height: 100px; transition: 0.2s linear; z-index: 10; } header.sticky-header { position: sticky; top: 0; z-index: 1000; } header.down, header::after { top: 0; background-color: rgba(17, 17, 17, 0.95); } header .logo { width: 250px; } .header1 .gnb > li.off > a { color: rgba(17, 17, 17, 0.6); } .header1 .gnb > li.off:hover > a { opacity: 1; color: #3cc1c8; } .btn_more.invert:hover, .down .header1 .gnb > li.on > a, .drag_list ul li:hover, .drag_slide .swiper-wrapper .swiper-slide a:hover, .header2 .navbar .gnb a:hover, .header2 .navbar .nav_language ul li.on, .header2 .navbar > li.on ul li:hover, .header2 .navbar > li.on > a, .language > li ul li a:hover, .marquee_list ul li:hover, .marquee_list1 ul li a:hover, .over .header1 .gnb > li .sub_menu li.on a, .over .header1 .gnb > li.off:hover > a, .over .header1 .gnb > li.on:hover > a, .over .header1 .gnb > li.on > a, .sub_wrap header.down .language > li > a, .white .header1 .gnb > li.on > a, .white .over .header1 .gnb > li.off:hover > a, .white header .header1 .gnb > li, .white header .language, footer .f_gnb, footer .info_box ul li a:hover { color: #fff; } .down .header1 .gnb > li.off > a, .over .header1 .gnb > li.off > a { opacity: 1; color: rgba(255, 255, 255, 0.6); } .white .header1 .gnb > li.off > a, .white .over .header1 .gnb > li.off > a { color: rgba(255, 255, 255, 0.6); } header::after { content: ""; width: 100%; height: 0; position: absolute; left: 0; z-index: -1; transition: height 0.3s; } .btn_more_color:hover::after, .sub_wrap header.down .language a::after, .white header .language > li > a::after, header.down:hover .language > li > a::after { filter: invert(0); } .btn_box, .header1 .gnb { display: flex; flex-wrap: nowrap; align-items: center; } .header1 .gnb > li { font-size: 1.05rem; font-weight: 600; padding: 0 30px; height: 100px; display: flex; flex-wrap: nowrap; align-items: center; } .over .header1 .gnb > li:nth-child(2), .over .header1 .gnb > li:nth-child(3) { height: 500px; } .header1 .gnb > li a, .vibe_section .ttl_box { position: relative; z-index: 1; } .discography_cont .head_box h2.ko, .header1 .gnb > li a.kr { font-family: rixsingose-pro !important; } .header1 .gnb > li .sub_menu { display: none; position: absolute; top: 0; left: 30px; padding-top: 110px; font-size: 1rem; } .header1 .gnb > li .sub_menu a { display: block; padding-bottom: 16px; text-transform: uppercase; } .header1 .gnb > li .sub_menu a.kr { font-size: 0.83rem; padding-bottom: 21px; } .down .logo img, .language > li > a::after { filter: invert(1); } .white header { position: absolute; } .white header.sticky-header { position: sticky; } header .container { max-width: 100%; height: 100%; padding: 0 40px; display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; } .header2, .mo, .pagination .screen-reader-text, .sub_wrap section.mo:last-of-type .sns_fix, .visual-grid .artist-list .none::after, .visual-grid .artist-list .none::before, .visual-grid .artist-list .none:hover::before, header.down .logo::after { display: none; } .header2 .nav { position: absolute; display: flex; flex-wrap: nowrap; align-items: center; top: calc(50% + 6px); transform: translateY(-50%); right: 40px; color: #fff; } .header2 .nav .nav-icon { z-index: 10; width: 29px; height: 29px; cursor: pointer; padding-top: 14px; } .header2 .nav .nav-icon div, .header2 .nav .nav-icon:after, .header2 .nav .nav-icon:before { background-color: #111; content: ""; display: block; width: 29px; height: 2px; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -moz-transition: 0.2s ease-in-out; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .btn_wrap .swiper-pagination-progressbar .swiper-pagination-progressbar-fill, .header2 .nav .nav-icon.active div, .header2 .nav .nav-icon.active:after, .header2 .nav .nav-icon.active:before { background: #fff; } .header2 .nav .nav-icon:after, .header2 .nav .nav-icon:before { position: absolute; -webkit-transition-property: margin, -webkit-transform; -o-transition-property: margin, transform; transition-property: margin, transform; -webkit-transition-duration: 0.2s; -o-transition-duration: 0.2s; transition-duration: 0.2s; -webkit-transition-delay: 0.2s, 0s; -o-transition-delay: 0.2s, 0s; transition-delay: 0.2s, 0s; } .header2 .nav .nav-icon:before { margin-top: -8px; } .actors_discography .actors_history, .header2 .nav .nav-icon:after { margin-top: 6px; } .header2 .nav .nav-icon.active:before { margin-top: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition-delay: 0s, 0.2s; -o-transition-delay: 0s, 0.2s; transition-delay: 0s, 0.2s; } .header2 .nav .nav-icon.active:after { margin-top: -2px; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transition-delay: 0s, 0.2s; -o-transition-delay: 0s, 0.2s; transition-delay: 0s, 0.2s; } .header2 .nav .nav-icon.active div { -moz-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); } .header2 .navbar { position: absolute; padding: 40px 60px; transform: translate(540px, -22px); top: -12px; width: 540px; height: calc(100vh + 12px); z-index: 1; } .header2 .navbar .gnb li.color, .header2 .navbar .gnb.on a, .ir_disclosure.ir_list ul li > a.disabled { color: #777; } .header2 .navbar.active { position: fixed; transform: translate(-395px, -22px); background: rgba(17, 17, 17, 0.9); } .header2 .navbar .nav_language { margin-bottom: 76px; } .btn_wrap .container, .header2 .navbar .nav_language ul, .privacy_cont:last-child a, .top_btn ul, footer .sns_box { display: flex; flex-wrap: nowrap; align-items: center; } .header2 .navbar > li:last-child div, .language { flex-wrap: nowrap; display: flex; } .header2 .navbar .nav_language ul li { margin-right: 20px; text-transform: uppercase; font-size: 0.89rem; font-weight: 600; color: #777; font-family: HelveticaWorld, sans-serif; } .header2 .navbar .gnb li { max-width: 260px; font-size: 1.89rem; line-height: 1.2; font-weight: 600; font-family: HelveticaWorld, sans-serif; } :lang(ja) .about_header h1, :lang(ja) .about_header span, :lang(ja) .header2 .navbar .gnb li a, :lang(zh) .about_header h1, :lang(zh) .about_header span, :lang(zh) .header2 .navbar .gnb li a { font-family: HelveticaWorld !important; } .header2 .navbar .gnb > ul > li > a { min-width: 246px; display: inline-block; padding-bottom: 14px; white-space: nowrap; } .header2 .navbar > li:last-child { position: absolute; bottom: 60px; } .artists #page, .brand_creative, .brand_vision .ly_flex .img, .file, .form .privacy .ck-input, .history_inner, .history_wrap, .language, .language > li, .language > li > a, .search_box .search .inner, .sub_wrap header .container .logo, .visual-grid .artist-list .hover-box, .visual_section { position: relative; } .header2 .navbar > li:last-child a { display: block; margin-right: 12px; } .header2 .navbar > li:nth-child(6) .sub_menu, .kr, .privacy_header { font-family: rixsingose-pro; } .header2 .navbar .sub_menu { display: none; padding: 0 0 12px 14px; text-transform: capitalize; } .header2 .navbar .sub_menu li { font-size: 1.2rem; font-weight: 400; line-height: 1.18; margin-bottom: 11px; padding-bottom: 0; color: #777; text-transform: uppercase; } .drag_list ul li, .drag_slide .swiper-wrapper .swiper-slide a, .marquee_list ul li, .marquee_list1 ul li a { -webkit-text-stroke: 1px #fff; color: transparent; } .header2 .navbar .sub_menu li .kr { font-size: 1rem; font-family: rixsingose-pro; } .language { width: 40px; margin: 0 0 -20px; padding-bottom: 20px; align-items: center; z-index: 1; } body div .header2.fix, header.down, header.up { position: fixed; } .language > li > a { display: inline-flex; flex-wrap: nowrap; align-items: center; white-space: nowrap; font-size: 0.88rem; font-weight: 600; } .language > li ul, .pagination .page-numbers { font-size: 0.89rem; font-weight: 600; font-family: HelveticaWorld, sans-serif; } .language > li > a::after { content: ""; background: url(/images/language.svg) no-repeat; width: 10px; height: 7px; margin-left: 9px; } .language > li ul { height: 0; position: absolute; background: #292929; top: 35px; left: 50%; transform: translateX(-50%); line-height: 0.875; transition: 0.2s; } .language:hover > li ul { height: 90px; padding: 16px 20px; } .language > li ul li a { display: block; padding-bottom: 8px; color: #666; white-space: nowrap; } .language > li ul li:last-child a { padding-bottom: 0; } body div .header2 { position: absolute; top: 42px; right: 0; z-index: 10; } header.down.over { background-color: transparent; } .btn_more_plus span::after, .btn_more_plus span::before { content: ""; left: 50%; transform: translate(-50%, -50%); background: #b8b8b8; top: 50%; } header.down .container { border-bottom: 0; } .album_box .album_slide .swiper-slide.swiper-slide-active p, .bottom_section .ly_flex .hover_on a, .bottom_section .ly_flex .hover_on h3, .bottom_section .ly_flex .txt_box:hover h3, .brand_scroll .txt1 h2:first-child, .ly_flex .list_txt_slide .swiper-slide.swiper-slide-active, .offfice_scroll .sub_contmenu .on, .sub_wrap header.down .container .logo img, .top_btn ul li.on { opacity: 1; } .bottom_section .ly_flex .txt_box:hover a, .btn_more:hover, .on .btn_more:hover { opacity: 1 !important; } header.up { top: -100px; } @media (min-width: 1199px) { header .logo a { display: flex; align-items: center; } } @media (max-width: 1200px) { .header1, header .container > .language { display: none; } .header1 .gnb > li { padding-right: 3vw; } header.down .language > li > a::after { filter: invert(0); } body .header2 { display: block; } header .active .logo.mo img { width: 250px; } .language { margin-right: 25px; } .down .language { margin-top: -25px; color: #fff; } } .pagination .nav-links { text-align: center; margin-top: 48px; } .pagination .page-numbers { display: inline-block; width: 44px; height: 44px; vertical-align: top; line-height: 42px; text-align: center; margin: 0 3px; color: #111; cursor: pointer; } .pagination .page-numbers.current, .pagination .page-numbers.current:hover { background: #111; color: #fff; } .active .history_year, .btn-grid-more:hover, .concert_btn a:hover, .discography_cont .head_box .album_btn a:hover, .discography_cont .head_box .album_btn button:hover, .notice_list ul li a:hover .date, .notice_list ul li a:hover p, .orange, .pagination .page-numbers:hover, .stock_list table tr.up td:nth-child(3), .stock_list table tr.up td:nth-child(4), .stock_major ul .up div, .stock_view ul li div p span.up, .stock_view ul li h3.up { color: #ef4023; } .date, .gray, .pop .s_txt { color: #999; } .pagination .page-numbers.next, .pagination .page-numbers.prev { background: url(/images/pagination.svg) center no-repeat; } .pagination .page-numbers.prev, .slide_box .swiper-button-next, .slide_box .swiper-container-rtl .swiper-button-prev { transform: rotate(180deg); } .pagination .page-numbers.next.disabled, .pagination .page-numbers.prev.disabled { opacity: 0.2; cursor: auto; pointer-events: none; } .compliance_utilize, .sub_wrap section:last-of-type { padding-bottom: 200px; } .artists_history .history > li.on, .discography_box .track_box > li.on, .discography_cont .body_box p.on, .esg_target_cont > li .tit span, .page_section.recording ul, .sub_wrap section.mo:last-of-type, .vibe_section .ttl_box h2 span, .with_box .xs_ttl span { display: block; } .sub_wrap .header2 .nav .nav-icon div, .sub_wrap .header2 .nav .nav-icon.active div { background: #111; } .header2 .nav .nav-icon div, .sub_wrap .header2 .nav .nav-icon:after, .sub_wrap .header2 .nav .nav-icon:before { background-color: #111; } .about section .container, .actors section .container, .artists section .container, .brand_cont .container, .ir #page .container, .news section .container, .sub_wrap section .container, .sustainability section .container { max-width: 1280px; } .ly_flex { display: flex; flex-wrap: wrap; } .btn_more, .cate { flex-wrap: nowrap; } .ttl, :lang(en) footer .info_box ul li, :lang(ja) footer .info_box ul li, :lang(zh) footer .info_box ul li { text-transform: uppercase; } .artists_list .ly_flex > h2, .sub { width: 100%; text-align: center; } .artists_debut, .artists_video h1, .center, .esg_target_cont > li .tit, .intro_location .ly_flex .txt, .privacy_cont:nth-child(4) .table1 table th, .ql-align-center, .yg_instagram { text-align: center; } .artists_member .ly_cont li .img img, .bg img, .discography_box .ly_flex > .img img, .history_header .bg img, .img_slide .swiper-slide .img img, .page_section.recording img, .visual-bg-slider .slide-inner img, .visual-grid .artist-list li img { width: 100%; height: 100%; object-fit: cover; } .cate { display: flex; justify-content: center; align-items: center; margin-bottom: 16px; width: 70px; height: 26px; border: 1px solid #111; font-weight: 700; font-family: HelveticaWorld, sans-serif; } .btn_more, .btn_prev, .top_btn ul li.on a:last-child { display: inline-flex; } .date { font-family: HelveticaWorld, sans-serif; } .btn_prev { align-items: center; font-weight: 600; } .btn_more, .btn_more_plus { font-weight: 700; text-transform: uppercase; } .btn_prev::before { content: ""; margin-right: 4px; position: relative; top: 1px; background: url(/images/btn_prev.svg); width: 14px; height: 16px; } .bottom_section .ly_flex .txt_box:hover .btn_more::after, .btn_more.invert:hover::after, .btn_more::after { background: url(/images/btn_more.svg) no-repeat; } .btn_prev:hover::after { content: ""; } .btn_more { position: relative; align-items: center; font-size: 0.89rem; opacity: 0.4 !important; z-index: 1; line-height: 24px; transition-duration: 0s !important; } .btn_more::after { content: ""; width: 20px; height: 20px; margin-left: 4px; } .btn_more:hover::after { background: url(/images/btn_more_color.svg) no-repeat; } .btn_more:hover { color: #ef4023; } .btn_more_color::after { filter: invert(1); position: relative; } .btn_more_plus { display: flex; flex-wrap: nowrap; align-items: center; margin-top: 40px; font-size: 1.1rem; background: 0 0; color: #bbb; font-family: HelveticaWorld, sans-serif; cursor: pointer; } .btn_more_plus::before { content: "More"; } .btn_more_plus span { display: block; position: relative; margin-left: 4px; width: 12px; } .btn_more_plus span::before { width: 2px; height: 12px; position: absolute; transition: 0.2s; } .btn_more_plus span::after { width: 12px; height: 2px; position: absolute; } .btn_more_plus.close::before { content: "CLOSE"; } .btn_more_plus.close span:before { transform: translate(-50%, -50%) rotate(90deg); } .btn_down:after { content: ""; background: url(/images/btn_down.svg) no-repeat; width: 10px; height: 14px; margin-left: 10px; } .btn_website::before { content: ""; background: url(/images/btn_website.svg); } .btn_website:hover::before { content: ""; background: url(/images/btn_website_on.svg); } .btn_dvd::before { content: ""; background: url(/images/btn_dvd.svg); } .btn_dvd:hover::before { content: ""; background: url(/images/btn_dvd_on.svg); } .btn_md::before { content: ""; background: url(/images/btn_md.svg); } .btn_md:hover::before { content: ""; background: url(/images/btn_md_on.svg); } .btn_album::before { content: ""; background: url(/images/btn_album.svg); } .btn_album:hover::before { background: url(/images/btn_album_on.svg); } .btn_card { display: flex; flex-wrap: nowrap; align-items: center; margin-left: 30px; color: #383838; background-color: transparent; font-size: 1rem; font-weight: 600; } .btn_card::before { content: ""; background: url(/images/btn_card.svg); } .btn_card:hover::before { content: ""; background: url(/images/btn_card_on.svg); } section .btn_more_color.btn_more:hover::before { top: calc(50% - 1px); } .search_box { width: 489px; margin: 0 auto; outline: 0; } .search_box .search .inner input { font-family: "Noto Sans", sans-serif; width: 100%; height: 54px; padding: 0 21px; font-size: 0.94rem; line-height: 1.76; letter-spacing: -0.02em; font-weight: 500; background: #f7f7f7; border: 0; outline: 0; } .search_box .search .inner button { background: url(/images/search_ic.svg); width: 28px; height: 28px; position: absolute; top: 50%; right: 13px; transform: translateY(-50%); } .cursor { display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; width: 120px; height: 120px; background-color: #ef4023; border-radius: 50%; position: absolute; z-index: 10; top: 0; left: 0; } .cursor p { font-weight: 600; font-size: 0.89rem; line-height: 2.1; text-transform: uppercase; color: #fff; } .ly_tit { width: 510px; padding-right: 40px; line-height: 1.18; text-transform: capitalize; } .btn-grid-more, .visual-grid .artist-list .hover a p { text-transform: uppercase; font-weight: 600; position: relative; } .ly_cont { width: calc(100% - 510px); } .big_ttl, .sub_header h1 { position: relative; font-family: HelveticaWorld, sans-serif; font-weight: 700; } .s_ttl, .sub_header p.f20, .xs_ttl { font-family: HelveticaWorld, sans-serif; font-weight: 600; } .f104 { font-size: 5.78rem; } .f96 { font-size: 5.3rem; } .big_ttl, .f82 { font-size: 4.56rem; } .f68 { font-size: 3.78rem; } .f66 { font-size: 3.67rem; } .f64 { font-size: 3.56rem; } .f60 { font-size: 3.3rem; } .f58 { font-size: 3.2rem; } .f54, .s_ttl { font-size: 3rem; } .f52 { font-size: 2.89rem; line-height: 1.34; } .f48 { font-size: 2.67rem; } .f44 { font-size: 2.4rem; } .f40 { font-size: 2.2rem; line-height: 1.2; } .f38, .xs_ttl { font-size: 2.1rem; } .discography_slide.album_box .album_slide .swiper-slide.swiper-slide-active h3.ko, .f36, :lang(ja) .intro_cont ul li .txt h3 { font-size: 2rem; } .f34 { font-size: 1.89rem; line-height: 1.47; } .f30 { font-size: 1.67rem; } .f28 { font-size: 1.56rem; } .f24 { font-size: 1.33rem; } .f22 { font-size: 1.2rem; line-height: 1.6; letter-spacing: -0.03em; } .f20 { font-size: 1.1rem; letter-spacing: -0.02em; } .f18 { font-size: 1rem; line-height: 1.3; } .artists_history .history .dot_list li, .artists_history .history .txt, .f17 { letter-spacing: -0.02em; line-height: 1.88; } .f17 { font-size: 0.94rem; font-weight: 500; } .f16 { font-size: 0.89rem; } .f15 { font-size: 0.83rem; } .f14 { font-size: 0.78rem; } .visual-grid { margin-bottom: 128px; } .visual-grid ul { display: flex; flex-wrap: wrap; align-items: flex-start; margin-right: -16px; } .visual-grid ul ul, :lang(zh) .brand_spirit .ly_flex { align-items: center; } .visual-grid .artist-list li { position: relative; width: calc(50% - 16px); margin: 0 16px 16px 0; } .visual-grid .artist-list li a::before { content: ""; width: 100%; height: 100%; background-color: #000; position: absolute; top: 0; left: 0; opacity: 0; } .brand_scroll .txt1 h2:nth-child(2), .view_body .btn_view button.none, .visual-grid .artist-list > li:not(:last-child):hover a::before { opacity: 0.3; } .visual-grid .artist-list .hover { opacity: 0; position: absolute; width: 100%; height: 100%; transition: opacity 0.5s; } .visual-grid .artist-list ul .hover { transition: opacity 1s; } .visual-grid .artist-list .hover-box::before { content: ""; width: 0; height: 100%; position: absolute; top: 0; left: 0; background-color: #fff; transition: width 0.5s; z-index: 1; } .visual-grid .artist-list .hover-box::after { content: ""; width: 0; height: 100%; position: absolute; top: 0; right: 0; background-color: #fff; transition: width 0.5s; z-index: 1; } .visual-grid .artist-list .hover a { position: relative; height: 100%; display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; } .visual-grid .artist-list li li::before, .visual-grid .artist-list > li:not(:last-child)::before { content: ""; width: 100%; height: 0; position: absolute; top: 0; left: 0; background-color: #fff; transition: height 0.5s; z-index: 1; } .visual-grid .artist-list li li::after, .visual-grid .artist-list > li:not(:last-child)::after { content: ""; width: 100%; height: 0; position: absolute; bottom: 0; left: 0; background-color: #fff; transition: height 0.5s; z-index: 1; } .visual-grid .artist-list .hover a p { font-size: 1.43rem; color: #fff; z-index: 1; } .schedule_box .schedule_year, .visual-grid .artist-list .none { display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; } .btn-grid-more { display: block; text-align: right; font-size: 1.05rem; padding-right: 61px; } .btn-grid-more::after { content: ""; background: url(/images/btn-grid-more.svg) 0 0 / contain no-repeat; width: 50px; height: 50px; position: absolute; top: 50%; right: 0; transform: translateY(-50%); } .btn-grid-more:hover::after { background: url(/images/btn-grid-more-on.svg) 0 0 / contain no-repeat; } .visual-bg-slider .slide-inner, .visual_slide .slide-inner { background-size: cover; background-position: center; text-align: left; top: 0; } .main .ly_flex { align-items: center; justify-content: space-between; } .visual-bg-slider { width: 100%; height: 880px; display: flex; position: relative; z-index: 0; transition: 0.4s; } .visual-bg-slider .slide-inner, .visual_slide .slide-inner, .visual_slide_box { z-index: 1; left: 0; width: 100%; display: flex; } .visual-bg-slider .swiper-slide { overflow: hidden; color: #fff; } .visual-bg-slider .swiper-container { width: 100%; height: 100%; left: 0; top: 0; } .visual-bg-slider .slide-inner { height: 100%; justify-content: center; align-items: center; } .visual_slide_box { height: 880px; position: absolute; bottom: 0; color: #fff; transition: 0.4s; } .visual_slide { width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .visual_slide .slide-inner { height: 100%; position: absolute; justify-content: center; align-items: center; } .visual_section .ttl { margin-bottom: 60px; } .drag_section > .container, .visual_section .swiper-slide-active { z-index: 2; } .visual_section .swiper-slide-prev { z-index: 1; } .visual_section .swiper-slide-next { z-index: 0; } .visual_section .swiper-slide a { display: block; height: 100%; } .visual_section .swiper-slide .bg { width: 100%; height: 100%; display: block; position: absolute; left: 0; right: 0; margin: 0 auto; box-sizing: border-box; z-index: -1; } .visual_section .swiper-slide .bg::before { content: ""; background-color: rgba(0, 0, 0, 0.05); width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; } .visual_section .swiper-slide .txt_box { width: 100%; position: absolute; bottom: 136px; left: 90px; z-index: 1; text-transform: uppercase; font-weight: 700; } .visual_section .swiper-slide .txt_box span { opacity: 0; transform: translate3d(0, 50px, 0); display: block; font-size: 1.78rem; margin: 0 0 6px 5px; font-weight: 400; } .visual_section .swiper-slide .txt_box h2 { opacity: 0; transform: translate3d(0, 50px, 0); font-size: 3.5rem; text-transform: initial; } .visual_section .swiper-slide.swiper-slide-active .txt_box span, .visual_section .swiper-slide.swiper-slide-duplicate-active .txt_box span { animation: 1s alternate both fadeInUp; } .visual_section .swiper-slide.swiper-slide-active .txt_box h2, .visual_section .swiper-slide.swiper-slide-duplicate-active .txt_box h2 { animation: 1s 0.2s alternate both fadeInUp; } .visual_section .btn_wrap { position: relative; bottom: 90px; left: 90px; z-index: 1; } .btn_wrap .swiper-pagination-progressbar { left: 4px; position: relative; max-width: 166px; width: 100%; height: 1px; background: rgba(255, 255, 255, 0.4); } .btn_wrap .main-visual-conuter { display: none; position: relative; padding: 0 34px 0 14px; } .btn_wrap .main-visual-conuter span::before { content: "0"; } .btn_wrap .main-visual-conuter span:last-child { margin-left: 5px; opacity: 0.4; } .visual_section .btn_box { position: absolute; left: 193px; } .visual_section .btn_box div:hover::before { opacity: 0.2; } .visual_section .btn_box div::before { content: ""; width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0; border: 1px solid #fff; border-radius: 50%; } .visual_section .btn_box div::after { content: ""; background: url(/images/prev.svg) 0 0 / contain no-repeat; width: 20px; height: 20px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .btn_box .swiper-button-next, .btn_box .swiper-button-prev { width: 40px; height: 40px; background-image: none; } .btn_wrap .btn_box .swiper-button-next { transform: rotate(180deg); left: 0; } .btn_box .swiper-button-next, .btn_box .swiper-button-prev, .btn_box .swiper-container-rtl .swiper-button-next, .btn_box .swiper-container-rtl .swiper-button-prev { position: relative; left: auto; margin-top: 0; outline: 0; } .drag_section { position: relative; height: 100vh; color: #fff; z-index: 1; } .bottom_section::after, .drag_section::after { content: ""; background: #000; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: -2; } .album_box .album_slide .swiper-slide a, .album_box.discography_slide .album_slide .swiper-slide.swiper-slide-active a, .drag_section .marquee_list ul { cursor: url(/images/cursor_drag_type1.svg) 54 54, auto; } .drag_section .bg { transition: background 0.5s; transform: translateZ(0) scale(1.05) rotate(0.0001deg); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background-repeat: no-repeat; background-size: cover; background-position: center; } .drag_section .bg.on { animation: 4s linear alternate both visualScale; } .drag_section .tab { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: visible; z-index: 1; } .brand_box .bg, .drag_section .tab .container, .offfice_cont .bg, .offfice_visual .bg, .txt_slide li.swiper-slide-active a { height: 100%; } .drag_section .tab .container a { position: absolute; top: 100px; right: 0; z-index: 1; } @keyframes visualScale { 0% { transform: translateZ(0) scale(1.05) rotate(0.0001deg); } 100% { transform: translateZ(0) scale(1) rotate(0); } } @-webkit-keyframes visualScale { 0% { transform: translateZ(0) scale(1.05) rotate(0.0001deg); } 100% { transform: translateZ(0) scale(1) rotate(0); } } @-ms-keyframes visualScale { 0% { transform: translateZ(0) scale(1.05) rotate(0.0001deg); } 100% { transform: translateZ(0) scale(1) rotate(0); } } @keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 50px, 0); } to { opacity: 1; transform: none; } } @-webkit-keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 50px, 0); } to { opacity: 1; transform: none; } } @-ms-keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 50px, 0); } to { opacity: 1; transform: none; } } .drag_list { position: absolute; bottom: 65px; cursor: grab; user-select: none; width: 100%; cursor: url(/images/cursor_drag_type1.svg), auto; } .marquee_list, .marquee_list1 { bottom: 65px; cursor: grab; user-select: none; } .drag_list ul, .marquee_list ul, .marquee_list1 ul { display: flex; flex-wrap: nowrap; align-items: center; font-size: 6.7rem; font-weight: 700; text-transform: uppercase; } .drag_list ul li { transition: 0.5s; padding: 200px 0 10px; display: block; font-family: HelveticaWorld, sans-serif; font-style: normal; white-space: nowrap; text-align: center; } .discography_slide.album_box .album_slide .swiper-slide h3.en, :lang(en), :lang(en) .history_header p, :lang(ja) .actors .actors_history li .txt, :lang(ja) .actors .actors_history li h3, :lang(ja) .actors .history_tit h2 a, :lang(ja) .actors h2.ly_tit, :lang(ja) .album_box .album_slide .swiper-slide h3, :lang(ja) .album_box .album_slide .swiper-slide p, :lang(ja) .album_box .album_slide .swiper-slide span, :lang(ja) .album_box .f38, :lang(ja) .album_box li .txt h2, :lang(ja) .album_box li .txt span, :lang(ja) .artists_debut .debut_txt p b, :lang(ja) .artists_debut .debut_txt p span, :lang(ja) .artists_history .ly_flex .history .month, :lang(ja) .artists_history .ly_flex .history .year, :lang(ja) .artists_history .ly_flex h2, :lang(ja) .artists_history .ly_flex h2 a, :lang(ja) .artists_list .ly_flex h2, :lang(ja) .artists_list_cont li p, :lang(ja) .artists_member .ly_flex h2, :lang(ja) .artists_member .member_name p, :lang(ja) .artists_member .member_name p a, :lang(ja) .artists_member .member_name span, :lang(ja) .bottom_section .ly_flex h3, :lang(ja) .brand_box .txt h2 span, :lang(ja) .brand_cont .txt h3, :lang(ja) .brand_creative .txt1 h2, :lang(ja) .brand_identity .ly_flex .txt a, :lang(ja) .brand_identity .ly_flex .txt h2, :lang(ja) .brand_identity .ly_flex .txt span, :lang(ja) .brand_scroll .txt1 h2, :lang(ja) .brand_txt h2, :lang(ja) .brand_txt span, :lang(ja) .btn_more, :lang(ja) .btn_more_plus, :lang(ja) .composition_box h2, :lang(ja) .composition_box table td, :lang(ja) .composition_box table th, :lang(ja) .concert_btn a, :lang(ja) .directors_box h2, :lang(ja) .directors_box table tr p, :lang(ja) .directors_box table tr td, :lang(ja) .discography_back .txt h2, :lang(ja) .discography_back .txt p, :lang(ja) .discography_box .disc_list li, :lang(ja) .discography_cont .head_box .album_btn a, :lang(ja) .discography_cont .head_box .f15, :lang(ja) .discography_cont .head_box .f22, :lang(ja) .discography_cont .head_box h2, :lang(ja) .discography_wrap .txt span, :lang(ja) .dot_list li, :lang(ja) .drag_list ul li p, :lang(ja) .drag_slide_m ul li a, :lang(ja) .esg_box span, :lang(ja) .esg_certification ul li span, :lang(ja) .esg_committee .committee_box p, :lang(ja) .esg_committee .committee_box span, :lang(ja) .esg_committee ul li h3, :lang(ja) .esg_committee ul li span.f14, :lang(ja) .esg_report .guide_list li h3, :lang(ja) .esg_target_cont > li .tit span.f15, :lang(ja) .finance_box .unit, :lang(ja) .finance_box tbody td, :lang(ja) .finance_box thead th, :lang(ja) .fix_btn .to_top p, :lang(ja) .graph_bar > div h2, :lang(ja) .graph_bar > div p, :lang(ja) .graph_box .bg li p, :lang(ja) .graph_list .f22, :lang(ja) .header2 .navbar .nav_language ul li a, :lang(ja) .history_list > li .txt_box .history_cate, :lang(ja) .history_year, :lang(ja) .intro_location .ly_flex li h3, :lang(ja) .intro_location .ly_flex li p, :lang(ja) .intro_scroll h2.f96, :lang(ja) .ir .btn_down, :lang(ja) .ir h1, :lang(ja) .ir_list ul li .num, :lang(ja) .ir_list ul li h2, :lang(ja) .ir_list ul li h2 a, :lang(ja) .ir_list ul li p, :lang(ja) .ir_list ul li span, :lang(ja) .language > li ul li a, :lang(ja) .language > li > a, :lang(ja) .ly_disc h2, :lang(ja) .ly_disc p, :lang(ja) .main .ly_flex h2, :lang(ja) .news_section .news_box span.cate, :lang(ja) .news_section .news_box span.date, :lang(ja) .notice_list ul li .date, :lang(ja) .notice_list ul li p, :lang(ja) .offfice_visual p, :lang(ja) .pagination .page-numbers, :lang(ja) .privacy_box .first_num li, :lang(ja) .privacy_cont .f16, :lang(ja) .privacy_cont .f17, :lang(ja) .privacy_cont .f17 span, :lang(ja) .privacy_cont .txt_box p, :lang(ja) .privacy_cont h2, :lang(ja) .privacy_header h1, :lang(ja) .privacy_header p, :lang(ja) .s_ttl, :lang(ja) .schedule_box .schedule_ic li, :lang(ja) .schedule_box .schedule_list li .date span, :lang(ja) .schedule_box .schedule_list li .time, :lang(ja) .schedule_box .schedule_list li div h3, :lang(ja) .schedule_box .schedule_year h2, :lang(ja) .slide_box h2, :lang(ja) .slide_poster li p, :lang(ja) .slide_poster li span, :lang(ja) .social_contribution ul li:first-child .txt h3, :lang(ja) .stock_box h2, :lang(ja) .stock_box h2 span, :lang(ja) .stock_box table td, :lang(ja) .stock_box table td span, :lang(ja) .stock_box table th, :lang(ja) .stock_major ul li div h3, :lang(ja) .stock_major ul li p, :lang(ja) .stock_major ul li p span, :lang(ja) .stock_view p.f16 span, :lang(ja) .stock_view ul li div p, :lang(ja) .stock_view ul li div p span, :lang(ja) .stock_view ul li h3, :lang(ja) .stock_view ul li p, :lang(ja) .stock_view ul li p span, :lang(ja) .sub_header .btn_prev, :lang(ja) .sub_header h1, :lang(ja) .sub_header p.f20, :lang(ja) .sub_header ul li a, :lang(ja) .sustainability .btn_down, :lang(ja) .table1 table td h3, :lang(ja) .table1 table th, :lang(ja) .table2 table td, :lang(ja) .table2 table th, :lang(ja) .top_btn ul li a, :lang(ja) .total, :lang(ja) .total span, :lang(ja) .txt_slide li span, :lang(ja) .txt_slide li.swiper-slide p, :lang(ja) .vibe_section .ttl_box h2 span, :lang(ja) .vibe_section .ttl_box p, :lang(ja) .view_body .btn_view button, :lang(ja) .view_header .view_tit .date, :lang(ja) .view_header .view_tit h2, :lang(ja) .view_header p.f20, :lang(ja) .visual_section .swiper-slide .txt_box h2, :lang(ja) .visual_section .swiper-slide .txt_box span, :lang(ja) .with_major_achievements span.f20, :lang(ja) .with_major_achievements ul li h3 span, :lang(ja) .yg_instagram h2, :lang(ja) footer .f_gnb span, :lang(ja) footer .f_gnb ul li a, :lang(ja) footer .info_box p, :lang(ja) footer .info_box ul li a, :lang(zh) .actors .actors_history li .txt, :lang(zh) .actors .actors_history li h3, :lang(zh) .actors .history_tit h2 a, :lang(zh) .actors h2.ly_tit, :lang(zh) .album_box .album_slide .swiper-slide h3, :lang(zh) .album_box .album_slide .swiper-slide p, :lang(zh) .album_box .album_slide .swiper-slide span, :lang(zh) .album_box .f38, :lang(zh) .album_box li .txt h2, :lang(zh) .album_box li .txt span, :lang(zh) .artists_debut .debut_txt p b, :lang(zh) .artists_debut .debut_txt p span, :lang(zh) .artists_history .ly_flex .history .month, :lang(zh) .artists_history .ly_flex .history .year, :lang(zh) .artists_history .ly_flex h2, :lang(zh) .artists_history .ly_flex h2 a, :lang(zh) .artists_list .ly_flex h2, :lang(zh) .artists_list_cont li p, :lang(zh) .artists_member .ly_flex h2, :lang(zh) .artists_member .member_name p, :lang(zh) .artists_member .member_name p a, :lang(zh) .artists_member .member_name span, :lang(zh) .bottom_section .ly_flex h3, :lang(zh) .brand_box .txt h2 span, :lang(zh) .brand_cont .txt h3, :lang(zh) .brand_creative .txt1 h2, :lang(zh) .brand_identity .ly_flex .txt a, :lang(zh) .brand_identity .ly_flex .txt h2, :lang(zh) .brand_identity .ly_flex .txt span, :lang(zh) .brand_scroll .txt1 h2, :lang(zh) .brand_txt h2, :lang(zh) .brand_txt span, :lang(zh) .btn_more, :lang(zh) .btn_more_plus, :lang(zh) .composition_box h2, :lang(zh) .composition_box table td, :lang(zh) .composition_box table th, :lang(zh) .concert_btn a, :lang(zh) .directors_box h2, :lang(zh) .directors_box table tr p, :lang(zh) .directors_box table tr td, :lang(zh) .discography_back .txt h2, :lang(zh) .discography_back .txt p, :lang(zh) .discography_box .disc_list li, :lang(zh) .discography_cont .head_box .album_btn a, :lang(zh) .discography_cont .head_box .f15, :lang(zh) .discography_cont .head_box .f22, :lang(zh) .discography_cont .head_box h2, :lang(zh) .discography_wrap .txt span, :lang(zh) .dot_list li, :lang(zh) .drag_list ul li p, :lang(zh) .drag_slide_m ul li a, :lang(zh) .esg_box span, :lang(zh) .esg_certification ul li span, :lang(zh) .esg_committee .committee_box p, :lang(zh) .esg_committee .committee_box span, :lang(zh) .esg_committee ul li h3, :lang(zh) .esg_committee ul li span.f14, :lang(zh) .esg_report .guide_list li h3, :lang(zh) .esg_target_cont > li .tit span.f15, :lang(zh) .finance_box .unit, :lang(zh) .finance_box tbody td, :lang(zh) .finance_box thead th, :lang(zh) .fix_btn .to_top p, :lang(zh) .graph_bar > div h2, :lang(zh) .graph_bar > div p, :lang(zh) .graph_box .bg li p, :lang(zh) .graph_list .f22, :lang(zh) .header2 .navbar .nav_language ul li a, :lang(zh) .history_list > li .txt_box .history_cate, :lang(zh) .history_year, :lang(zh) .intro_location .ly_flex li h3, :lang(zh) .intro_location .ly_flex li p, :lang(zh) .intro_scroll h2.f96, :lang(zh) .ir .btn_down, :lang(zh) .ir h1, :lang(zh) .ir_list ul li .num, :lang(zh) .ir_list ul li h2, :lang(zh) .ir_list ul li h2 a, :lang(zh) .ir_list ul li p, :lang(zh) .ir_list ul li span, :lang(zh) .language > li ul li a, :lang(zh) .language > li > a, :lang(zh) .ly_disc h2, :lang(zh) .ly_disc p, :lang(zh) .main .ly_flex h2, :lang(zh) .news_section .news_box span.cate, :lang(zh) .news_section .news_box span.date, :lang(zh) .notice_list ul li .date, :lang(zh) .notice_list ul li p, :lang(zh) .num_list li, :lang(zh) .offfice_visual p, :lang(zh) .pagination .page-numbers, :lang(zh) .privacy_box *, :lang(zh) .privacy_box .first_num li, :lang(zh) .privacy_cont .f16, :lang(zh) .privacy_cont .f17, :lang(zh) .privacy_cont .f17 span, :lang(zh) .privacy_cont .txt_box p, :lang(zh) .privacy_cont h2, :lang(zh) .privacy_header h1, :lang(zh) .privacy_header p, :lang(zh) .s_ttl, :lang(zh) .schedule_box .schedule_ic li, :lang(zh) .schedule_box .schedule_list li .date span, :lang(zh) .schedule_box .schedule_list li .time, :lang(zh) .schedule_box .schedule_list li div h3, :lang(zh) .schedule_box .schedule_year h2, :lang(zh) .slide_box h2, :lang(zh) .slide_poster li p, :lang(zh) .slide_poster li span, :lang(zh) .social_contribution ul li:first-child .txt h3, :lang(zh) .stock_box h2, :lang(zh) .stock_box h2 span, :lang(zh) .stock_box table td, :lang(zh) .stock_box table td span, :lang(zh) .stock_box table th, :lang(zh) .stock_major ul li div h3, :lang(zh) .stock_major ul li p, :lang(zh) .stock_major ul li p span, :lang(zh) .stock_view p.f16 span, :lang(zh) .stock_view ul li div p, :lang(zh) .stock_view ul li div p span, :lang(zh) .stock_view ul li h3, :lang(zh) .stock_view ul li p, :lang(zh) .stock_view ul li p span, :lang(zh) .sub_header .btn_prev, :lang(zh) .sub_header h1, :lang(zh) .sub_header p.f20, :lang(zh) .sub_header ul li a, :lang(zh) .sustainability .btn_down, :lang(zh) .table1 table td h3, :lang(zh) .table1 table th, :lang(zh) .table2 table td, :lang(zh) .table2 table th, :lang(zh) .top_btn ul li a, :lang(zh) .total, :lang(zh) .total span, :lang(zh) .txt_slide li span, :lang(zh) .txt_slide li.swiper-slide p, :lang(zh) .vibe_section .ttl_box h2 span, :lang(zh) .vibe_section .ttl_box p, :lang(zh) .view_body .btn_view button, :lang(zh) .view_header .view_tit .date, :lang(zh) .view_header .view_tit h2, :lang(zh) .view_header p.f20, :lang(zh) .visual_section .swiper-slide .txt_box h2, :lang(zh) .visual_section .swiper-slide .txt_box span, :lang(zh) .with_major_achievements span.f20, :lang(zh) .with_major_achievements ul li h3 span, :lang(zh) .yg_instagram h2, :lang(zh) footer .f_gnb span, :lang(zh) footer .f_gnb ul li a, :lang(zh) footer .info_box p, :lang(zh) footer .info_box ul li a { font-family: HelveticaWorld, sans-serif !important; } .drag_list .swiper-slide { width: auto; height: auto; padding: 0 20px; } .pc .swiper-button-next, .pc .swiper-button-prev { width: 60px; background: url(/images/bt_main_arrow.svg) 0 0 / contain no-repeat; } .pc .swiper-button-prev { height: 60px; left: 50px; right: auto; } .pc .swiper-button-next { height: 60px; right: 50px; left: auto; transform: rotate(180deg); -webkit-transform: rotate(180deg); } .img_slide, .txt_slide { transform: translateY(-50%); } .drag_slide { position: absolute; bottom: 65px; } .drag_slide .swiper-wrapper { transition-timing-function: linear !important; } .drag_slide .swiper-wrapper .swiper-slide { width: auto; } .drag_slide .swiper-wrapper .swiper-slide a { font-size: 6.7rem; font-weight: 700; text-transform: uppercase; transition: color 0.5s; } .top_btn { position: relative; padding-top: 100px; display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; font-weight: 700; } .top_btn ul li { margin-right: 28px; opacity: 0.4; } .top_btn ul li a:last-child { display: none; position: absolute; top: 100px; right: 0; } .marquee_list { position: absolute; width: 100%; } .js-marquee, .marquee_list .actors, .marquee_list .artist { overflow: auto; white-space: nowrap; scrollbar-width: none; -ms-overflow-style: none; } .marquee_list .artist::-webkit-scrollbar { display: none; } .marquee_list .actors::-webkit-scrollbar { display: none; } .js-marquee::-webkit-scrollbar { display: none; } .marquee_list ul li { margin-right: 110px; transition: 0.5s; padding: 200px 0 10px; display: block; overflow: hidden; } .marquee_list1 { position: absolute; overflow: hidden; } .list_img_slide, .txt_slide ul { cursor: url(/images/cursor_drag_type2.svg) 54 54, auto; } .marquee_list1 ul li { margin-right: 110px; } .marquee_list1 ul li a { transition: 0.5s; padding-top: 200px; display: block; } .news_section { padding: 150px 0; } .news_section .news_box { display: flex; flex-wrap: wrap; align-items: flex-start; margin: 94px -28px 0 0; } .news_section .news_box li { width: calc(25% - 28px); margin-right: 28px; } .news_section .news_box span { display: block; font-weight: 700; font-size: 0.78rem; } .news_section .news_box span.cate { display: none; text-transform: uppercase; color: #ef4023; font-weight: 700; border: 0; } .news_section .news_box span.date { color: #888; font-weight: 500; } .news_section .news_box h3 { margin: 12px 0 20px; height: 60px; overflow: hidden; font-size: 1.1rem; line-height: 1.5; } .discography_box .track_box > li:not(:first-child), .history.hidden, .news_section .news_box .img { margin-top: 40px; } .vibe_section { padding-bottom: 90px; } .vibe_section .ttl_box h2 { font-size: 5.3rem; line-height: 0.9; letter-spacing: 0.01em; text-transform: capitalize; color: #111; font-weight: 700; } .bottom_section .ly_flex h3, .fix_btn .to_top, .news h1, .view_body .btn_view button, footer .f_gnb span, footer .f_gnb ul { text-transform: uppercase; } .vibe_section .ttl_box p { margin: 36px 0 89px; font-size: 1.7rem; font-weight: 400; } .vibe_section .bg_slide { position: relative; margin: 0 0 0 auto; top: -47px; width: 793px; text-align: right; background: #000; z-index: -1; } .vibe_section .bg_slide::before { content: ""; background: url(/images/vibe_cover.svg) 0 0 / cover no-repeat; width: calc(100% + 2px); height: calc(100% + 4px); position: absolute; top: -1px; right: -2px; left: -2px; bottom: -1px; z-index: 2; } .bottom_section { position: relative; color: #fff; overflow: hidden; } .bottom_section .bg { transition: 0.5s; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-image: url(/images/bottom_bg1.jpg); background-position: center; z-index: -1; } .bottom_section .bg.on { transition: 0.5s; } .fix_btn, .fix_btn .to_top, .fix_btn.on .to_top { transition: 0.4s ease-in-out; } .bottom_section .ly_flex { height: 935px; } .album_box .album_slide .swiper-slide.swiper-slide-active span, .bottom_section .ly_flex.on .txt_box h3 { opacity: 0.4; } .bottom_section .ly_flex > li { width: 50%; height: 100%; text-align: center; } .bottom_section .ly_flex > li:last-child { display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; border-left: 1px solid rgba(255, 255, 255, 0.2); } .bottom_section .ly_flex h3 { font-size: 2.7rem; margin-bottom: 60px; transition: 0.2s; } .bottom_section .ly_flex ul { display: flex; flex-flow: wrap; height: 100%; } .bottom_section .ly_flex ul li { width: 100%; height: 50%; display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; } .bottom_section .ly_flex .hover_on a::after { border-radius: 50%; background: url(/images/btn_more.svg) #ef4023; } .bottom_section .ly_flex ul li:last-child { border-top: 1px solid rgba(255, 255, 255, 0.2); } .album_box .album_slide .swiper-slide.swiper-slide-active a, .bottom_section .ly_flex .txt_box, .discography_cont .head_box .album_btn button { cursor: pointer; } .bottom_section .ly_flex .txt_box:hover .btn_more { color: #fff; opacity: 1 !important; } .brand_vision .ly_flex, .stock_view ul li:last-child, :lang(en) .stock_view ul li div p, :lang(ja) .stock_view ul li div p, :lang(zh) .stock_view ul li div p, footer .ly_flex { justify-content: space-between; } footer { position: relative; overflow: hidden; padding: 69px 40px 60px; background: #111; } footer .ly_flex:last-child { margin-top: 252px; align-items: flex-end; } footer .sns_box li { margin-right: 12px; } footer .f_gnb span { display: block; margin-bottom: 8px; font-size: 0.78rem; font-weight: 500; line-height: 1.2; color: #888; } footer .f_gnb ul { font-size: 2.3rem; line-height: 1.2; } .composition_box:nth-child(2) table td, .discography_cont .head_box h2, footer .f_gnb ul li a { font-weight: 600; } footer .info_box { color: #888; text-align: right; } footer .info_box ul { display: flex; flex-wrap: nowrap; align-items: center; justify-content: flex-end; margin-bottom: 32px; font-weight: 700; } footer .info_box ul li { margin-left: 24px; font-size: 0.89rem; } footer .info_box p { font-weight: 600; font-size: 0.78rem; } footer .info_box p:last-child { font-family: HelveticaWorld, sans-serif; margin-top: 14px; font-weight: 600; } .fix_btn { position: fixed; right: 25px; bottom: 48px; z-index: 1; } .fix_btn.lock { position: absolute; bottom: auto; top: 450px; } .fix_btn .to_top { opacity: 0; width: 60px; height: 60px; border-radius: 50%; background: #111; color: #fff; display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; cursor: pointer; } .fix_btn.on .to_top { opacity: 1; } .fix_btn .to_top p { position: relative; padding-top: 14px; font-family: HelveticaWorld, sans-serif; font-weight: 600; } .fix_btn .to_top p::before { content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%); background: url(/images/to_top.svg) no-repeat; width: 14px; height: 8px; } .sns_fix .sns_more span::after, .sns_fix .sns_more span::before { background-color: #fff; left: 50%; transform: translate(-50%, -50%); transition: 0.2s ease-in-out; top: 50%; position: absolute; content: ""; } .mobile { background: #000; text-align: center; } .artists section.artists_main_view .container { max-width: 100%; padding: 0; } .sns_fix { position: fixed; top: 225px; right: 35px; z-index: 1; } .sns_fix li { margin-bottom: 12px; } .artists_history .history > li, .hidden, .sns_fix .sns_more { display: none; } .sns_fix .sns_more span { position: relative; display: block; width: 40px; height: 40px; background: #ef4023; border-radius: 50%; } .sns_fix .sns_more span::before { width: 16px; height: 3px; } .sns_fix .sns_more span::after { width: 3px; height: 16px; } .sns_fix .sns_more.on span { background: #fff; border: 2px solid #ef4023; } .sns_fix .sns_more.on span::after, .sns_fix .sns_more.on span::before { background: #ef4023; transform: translate(-50%, -50%) rotate(45deg); } .artists section .container iframe { overflow-x: hidden; overflow: auto; } .sub_header { position: relative; padding: 48px 0 0; z-index: 1; } .sub_header .btn_prev { font-size: 0.83rem; opacity: 0.3; } .sub_header .btn_prev:hover { color: #111; opacity: 1; } .sub_header ul { margin: 0 -30px 108px 0; font-size: 1.2rem; justify-content: center; flex-wrap: nowrap; white-space: nowrap; } .history_tit h2, .sub_header ul li { opacity: 0.3; margin-right: 30px; } .sub_header ul li { font-weight: 600; } .sub_header ul li.on { position: relative; opacity: 1; color: #ef4023; } .sub_header ul li.on::after { content: ""; background-color: #ef4023; width: 100%; height: 2px; position: absolute; left: 0; bottom: -9px; } .sub_header .big_ttl { padding: 28px 0 52px; text-align: center; } .artists_debut .container { text-align: center; display: inline-block; width: auto; } .artists_debut .container .img { display: inline-block; height: 740px; overflow: hidden; text-align: center; } .artists_debut .container .img img { width: 100%; height: 100%; object-fit: contain; } .artists_debut .debut_txt { margin-top: 20px; display: flex; flex-wrap: nowrap; } .artists_debut .debut_txt p { color: #666; font-family: HelveticaWorld, sans-serif; margin-right: 14px; } .artists_debut .debut_txt p.title:first-child { margin-left: 0; } .artists_debut .debut_txt p.title { margin: 0 14px 0 16px; white-space: nowrap; } .artists_debut .debut_txt p.title b { font-family: HelveticaWorld, sans-serif; color: #111; } .artists_debut .debut_txt p b { font-weight: 700; font-family: rixsingose-pro; } .artists_member { margin: 160px 0 0; } .artists_member .container { border-bottom: 1px solid #eaeaea; padding-bottom: 100px; } .artists_history .ly_yflex, .artists_member .ly_flex { align-items: flex-start; justify-content: space-between; } .artists_member .ly_cont { display: inline-flex; flex-wrap: wrap; margin-right: -24px; width: calc(100% - 486px); } .artists_member .ly_cont li { width: calc(25% - 24px); margin: 0 24px 40px 0; } .artists_member .ly_cont li:nth-child(4n), .form .radio label:last-of-type, .stock_view ul li:last-child p:last-child { margin-right: 0; } .artists_member .ly_cont li .img { width: 174px; height: 174px; } .artists_member .member_name { margin-top: 18px; } .artists_member .member_name p, .esg_target_cont > li ul li:first-child b, .finance_box .unit b, .no_search_results p span { font-weight: 700; } .artists_member .member_name p span { margin-top: 6px; font-weight: 600; color: #999; display: block; } .artists_member .member_name p a.has_icon { position: relative; display: inline-block; padding-right: 25px; } .artists_member .member_name p a.has_icon::after { content: ""; width: 19px; height: 19px; background: url(../images/profile_ic.svg) 0 0 / contain no-repeat; position: absolute; top: 50%; transform: translateY(-50%); right: 0; } .artists_history { padding-top: 100px; } .tab { display: none; overflow: hidden; } .history_tit { margin: 12px 0 37px; display: flex; flex-wrap: nowrap; align-items: center; } .history_tit h2.on { position: relative; opacity: 1; } .history_tit h2.on::after { content: ""; width: 100%; height: 3px; background: #111; position: absolute; left: 0; bottom: -9px; } .artists_history .history_tit, .ir .finance_header h1, .privacy_cont h2 { margin-bottom: 50px; } .artists_history .history .txt { width: calc(100% - 100px); padding-left: 28px; color: #383838; font-weight: 500; font-size: 0.94rem; word-break: keep-all; } .artists_history .history .month, .artists_history .history > li h3 { line-height: 1.5; font-size: 1.1rem; font-family: HelveticaWorld, sans-serif; } .artists_history .history > li div { display: flex; flex-wrap: nowrap; margin-bottom: 40px; font-size: 1.1rem; } .actors .actors_history li .txt p:last-child, .actors .actors_history li:last-child, .artists_history .history > li:last-child div, .compliance_policy .txt_box:last-child, .composition_box:last-child, .directors_box table tr p:last-child, .directors_box:last-child, .discography_faq ul:last-child, .graph_box .bg li:last-child, .history_list > li .txt_box .txt:last-child, .history_list > li .txt_box:last-child, .intro_cont ul li:last-child, .intro_cont ul li:nth-child(2n-1):last-child, .legend li:last-child, .privacy_box .first_num li:last-child, .privacy_cont:last-child, .privacy_cont:last-child p, .social_contribution ul li:last-child, .table1 table td p:last-child { margin-bottom: 0; } .artists_history .history > li h3 { width: 70px; } .artists_history .history .month { width: 30px; font-weight: 700; color: #111; } .artists_history .history .dot_list li { font-size: 0.94rem; letter-spacing: -0.03em; color: #383838; word-break: keep-all; } .scroll { -ms-overflow-style: none; scrollbar-width: none; } .scroll::-webkit-scrollbar { display: none; } section.artists_list ::selection { background: 0 0; } .artists_list { margin-bottom: -60px; min-height: 100vh; } .artists_list .ly_flex:first-of-type { align-items: flex-start; margin: 50px 0 90px; font-family: HelveticaWorld, sans-serif; position: relative; z-index: 1; } .artists_list .ly_flex:nth-of-type(2) { height: 100vh; position: relative; top: -270px; } .artists_list .ly_cont { display: flex; flex-wrap: nowrap; justify-content: flex-end; position: absolute; top: -8px; right: 0; } .discography_faq ul li:nth-child(2) span, .tab_tit { color: #666; } .tab_tit h2 { margin-left: 13px; width: 30px; height: 30px; } .tab_tit h2 a { display: block; width: 100%; height: 100%; font-size: 0; } .tab_tit h2:nth-child(2) { background-image: url(/images/tab_ic1_off.svg); } .tab_tit h2:first-child { background-image: url(/images/tab_ic2_off.svg); } .tab_tit h2.on:nth-child(2) { background-image: url(/images/tab_ic1_on.svg); } .tab_tit h2.on:first-child { background-image: url(/images/tab_ic2_on.svg); } .artists_list_cont, .guide_list, .yg_instagram ul { display: flex; flex-wrap: wrap; margin-right: -20px; } .artists_list_cont li { width: calc(33% - 20px); margin: 0 20px 60px 0; } .artists_list_cont li p { margin-top: 14px; font-weight: 600; } .txt_slide { width: calc(100% - 538px); padding: 0 40px 0 0; font-family: HelveticaWorld, sans-serif; position: absolute; top: 50%; left: 0; height: 100px; z-index: 1; } .privacy_cont:last-child a span, .txt_slide li a { position: relative; display: block; } .artists_list .txt_slide li a span, .brand_creative .bg .tab, .discography_box .track_box > li, .esg_target_cont > li:last-child::after, .form .privacy .ck-input input, .intro_scroll .bg .tab, .offfice_visual .bg .tab, .slide_box.slide_cont, .slide_box.slide_poster, .with_major_achievements ul li:last-child::after { display: none; } .txt_slide li p { font-size: 1.56rem; font-weight: 600; line-height: 1.2; color: rgba(0, 0, 0, 0.3); } .txt_slide li span { display: none; margin: 140px 0 50px; position: relative; } .txt_slide li span.btn_more_color.btn_more::before { top: 50%; } .txt_slide li span.btn_more_color.btn_more::after { position: absolute; top: 1px; right: -24px; background-repeat: no-repeat; } .txt_slide li.swiper-slide { padding: 0 0 20px 30px; } .txt_slide li.swiper-slide-active { padding-left: 0; height: 135px !important; } .txt_slide li.swiper-slide-active p { width: 100vw; position: absolute; top: 0; left: 0; font-size: 5.3rem; color: #000; font-weight: 700; } .txt_slide li.swiper-slide-active span { display: inline-block; padding-left: 6px; } .img_slide { text-align: right; width: 100%; height: 538px; position: absolute; z-index: -1; overflow: hidden; top: calc(50% + 124px); left: 0; } .img_slide .swiper-wrapper { display: flex; align-items: flex-end; } .img_slide .swiper-wrapper::after { content: ""; background-color: #000; width: 100%; max-width: 538px; height: 100%; position: absolute; top: 0; right: 0; z-index: -1; } .img_slide .swiper-slide { max-width: 538px; } .album_box .album_slide .swiper-slide img, .img_slide .swiper-slide .img { width: 100%; height: 100%; } .list_img_slide { position: relative; } .discography_slide.album_box { margin-top: 0; padding: 0; height: 100%; background: 0 0; -ms-user-select: none; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; user-select: none; } .album_box.discography_slide .album_slide .swiper-slide h3 { -webkit-line-clamp: 1; } .album_box.discography_slide .album_slide .swiper-slide.swiper-slide-active h3 { -webkit-line-clamp: 4; } .discography_slide.album_box .album_slide .swiper-slide h3.ko { font-family: rixsingose-pro !important; font-size: 1.1rem; font-weight: 700; } .list_txt_slide .swiper-slide, .offfice_cont .box2 .box_inner p, .offfice_cont .box3 .box_inner p { opacity: 0; } .sub_header { max-width: 748px; margin: 0 auto; } .sub_wrap section:last-of-type.discography_wrap { padding-bottom: 0; } .discography_wrap .ly_flex { justify-content: center; height: 690px; max-width: 1020px; margin: 0 auto; } .list_img_slide .swiper-slide { opacity: 0.3; width: 280px; transition: 0.2s; } .list_img_slide .swiper-slide-prev { transform: translateX(-160px) !important; } .list_img_slide .swiper-slide-next { transform: translateX(-110px) !important; } .list_img_slide .swiper-slide-active { opacity: 1; width: 420px; height: 420px !important; } .list_txt_slide { overflow: hidden; width: 600px; } .list_txt_slide .swiper-slide a { display: flex; align-items: center; height: 100%; } .list_txt_slide .txt { display: block; padding-left: 100px; font-family: HelveticaWorld, sans-serif; } .list_txt_slide .txt p { margin: 12px 0 8px; line-height: 1.18; } .list_txt_slide .txt span { color: #999; font-weight: 400; } @media (max-width: 1700px) { .discography_wrap .pc { display: none; } .discography_wrap .mo { display: block; } .discography_wrap .txt h2 { font-size: 1.7rem; line-height: 1; margin-top: 15px; } .discography_wrap .txt h2.en, .discography_wrap .txt h2.ko { font-size: 1.7rem; } .discography_wrap .txt { padding-left: 0; } } .discography_back li, .news .search_box { margin-bottom: 80px; } .discography_back .txt { width: 440px; display: flex; flex-wrap: nowrap; align-items: center; } .discography_back .discography_list > li > a, .esg_report .guide_list { justify-content: center; } .discography_back .discography_list > li > a .img { width: 440px; } .discography_back .discography_list > li > a .img img, .page_section.recording ul li, .slide_contents .swiper-wrapper iframe { width: 100%; } .artists_video .video_container { margin-top: 77px; position: relative; height: 0; padding-bottom: 56.25%; overflow: hidden; } .artists_video .video_container iframe { position: absolute; width: 100%; height: 100%; top: 0; left: 0; } .discography_box { margin-top: 110px; } .discography_box .ly_flex > .img { width: 440px; height: 440px; } .discography_cont, .ly_disc .disc_box { width: calc(100% - 440px); padding-left: 69px; } .discography_cont .head_box { margin-bottom: 44px; padding-bottom: 19px; border-bottom: 1px solid #eee; font-family: HelveticaWorld, sans-serif; } .discography_cont .head_box .f22 { margin: 12px 0 8px; font-weight: 600; } .discography_cont .head_box .f15 { display: block; margin-bottom: 19px; color: #999; } .discography_cont .head_box .album_btn { display: flex; flex-wrap: nowrap; align-items: center; justify-content: flex-end; } .discography_cont .head_box .album_btn a { display: flex; flex-wrap: nowrap; align-items: center; margin-left: 30px; color: #383838; font-weight: 600; } .album_box .album_slide .swiper-slide h3, .discography_cont .body_box p { display: -webkit-box; overflow: hidden; white-space: normal; -webkit-box-orient: vertical; } .discography_cont .head_box .album_btn a::before, .discography_cont .head_box .album_btn button::before { width: 22px; height: 22px; margin-right: 4px; } .discography_cont .body_box p { word-break: keep-all; } .ly_disc { margin-top: 116px; } .ly_disc h2 { width: 440px; font-family: HelveticaWorld, sans-serif; } .discography_box .disc_box p { margin-bottom: 16px; font-weight: 700; font-family: HelveticaWorld, sans-serif; } .discography_box .disc_list { border-top: 1px solid #111; font-family: HelveticaWorld, sans-serif; } .discography_box .disc_list li { display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; height: 62px; border-bottom: 1px solid #eee; font-family: rixsingose-pro; } .album_box .f38, .album_box li .txt, .concert_btn, .schedule_box .schedule_ic li, .slide_poster li p, .slide_poster li span { font-family: HelveticaWorld, sans-serif; } .discography_box .disc.hidden { margin-top: 44px; } .album_box { background: #111; height: 1045px; margin-top: 200px; padding-top: 140px; cursor: url(/images/cursor_drag_type1.svg) 54 54, auto; } .album_box .f38 { color: #fff; font-weight: 600; } .album_box .album_slide { position: relative; width: 480px; user-select: none; } .album_box .album_slide .swiper-wrapper { align-items: center; height: 100%; } .album_box .album_slide .swiper-slide { opacity: 0.3; width: 320px !important; height: 575px !important; display: flex; flex-wrap: nowrap; align-items: center; text-align: center; transition: 0.5s; } .album_box .album_slide .swiper-button-next, .album_box .album_slide .swiper-button-prev { margin-top: -130px; width: 50px; height: 50px; background: url(/images/bt_disco_arrow.svg) 0 0 / contain no-repeat; } .album_box .album_slide .swiper-slide h3 { -webkit-line-clamp: 2; } .album_box .album_slide .swiper-slide p { opacity: 0; font-weight: 600; line-height: 1.2; } .album_box .album_slide .swiper-slide span { opacity: 0; font-weight: 400; } .album_box .album_slide .swiper-slide.swiper-slide-active { width: 480px !important; opacity: 1; transition: 0.5s; } .album_box .album_slide .swiper-slide.swiper-slide-active h3 { font-size: 2.4rem; line-height: 1.2; } .album_box li .txt { margin-top: 30px; color: #fff; } .album_box .album_slide li .txt { height: 170px; } .album_box li .txt h3 { font-weight: 600; font-size: 1.2rem; } .album_box li .txt span { opacity: 0.4; font-weight: 400; } .album_box li p { margin: 8px 0 7px; } .album_box li span { color: #fff; opacity: 0.4; } .album_box .album_slide .swiper-button-prev { left: -50px; right: auto; } .album_box .album_slide .swiper-button-next { right: -50px; left: auto; transform: rotate(180deg); -webkit-transform: rotate(180deg); } .album_box .album_slide.view .swiper-button-next, .album_box .album_slide.view .swiper-button-prev { background: url(/images/bt_disco_detail_arrow.svg) no-repeat; } .discography_content h3 { margin-bottom: 8px; font-weight: 400; font-size: 0.94rem; line-height: 1.76; color: #222; } .discography_content .ly_flex { flex-wrap: nowrap; align-items: center; justify-content: center; margin-right: -12px; } .discography_content .ly_flex input { width: calc(50% - 12px); margin-right: 12px; padding: 0 20px; height: 50px; } .compliance_policy .ttl_box, .discography_content .alert_txt, .ql-editor-left { text-align: left; } .discography_faq { position: relative; margin-top: 38px; padding-top: 38px; z-index: 1; } .discography_faq::before { content: ""; background: #f5f5f5; position: absolute; top: 0; left: -77px; width: calc(100% + 154px); height: calc(100% + 66px); z-index: -1; } .discography_faq h3 { font-weight: 700; font-size: 1rem; line-height: 1.3; margin-bottom: 23px; } .discography_faq ul, .social_contribution ul li .txt h3 { margin-bottom: 22px; } .discography_faq ul li { display: flex; flex-wrap: nowrap; align-items: flex-start; } .discography_faq ul li span { display: block; width: 16px; margin-right: 8px; font-weight: 600; } .discography_faq ul li p { font-size: 0.78rem; line-height: 1.4; } .discography_faq ul li:first-child span { color: #b19d60; } .discography_faq ul li:first-child p { font-weight: 700; color: #000; } .discography_faq ul li:nth-child(2) p { font-weight: 500; color: #666; } .discography_faq .faq_mail { margin: 32px auto 0; max-width: 340px; color: #b19d60; font-weight: 700; font-size: 0.78rem; line-height: 1; padding: 16px; background: #fff; text-align: center; } .artists section.privatestage_box .container, .concert_box .container { max-width: 100%; } .concert_btn { display: flex; flex-wrap: nowrap; justify-content: center; align-items: center; margin: 30px 0 60px -20px; font-weight: 600; } .concert_btn a { display: flex; flex-wrap: nowrap; align-items: center; margin-left: 20px; } .concert_btn a::before { width: 22px; height: 22px; margin-right: 6px; } .composition_box, .concert_box, .directors_box, .slide_box { margin-bottom: 100px; } .slide_box .ly_flex { align-items: center; justify-content: space-between; margin-bottom: 30px; } .slide_cont .swiper { display: flex; flex-wrap: nowrap; margin-right: -40px; } .slide_cont .swiper > li { width: calc(25% - 40px); margin-right: 40px; } .slide_contents { position: relative; overflow: hidden; } .slide_contents .swiper-wrapper { height: auto !important; } .slide_box .swiper-button-next, .slide_box .swiper-button-prev { width: 60px; height: 60px; margin-top: 0; transform: translateY(-50%); } .slide_box .swiper-button-next, .slide_box .swiper-button-prev, .slide_box .swiper-container-rtl .swiper-button-next, .slide_box .swiper-container-rtl .swiper-button-prev { background: url(/images/btn_slide.svg) no-repeat; } .slide_box .swiper-button-prev { left: -80px; right: auto; top: calc(50% - 20px); } .slide_box .swiper-button-next { right: -80px; left: auto; top: calc(50% - 50px); } .slide_poster h2 { padding-bottom: 30px; } .slide_poster li p { margin: 20px 0 10px; text-align: center; font-size: 0.89rem; font-weight: 700; } .slide_poster li span { display: block; color: #383838; text-align: center; font-size: 1.2rem; font-weight: 400; line-height: 1.18; } .slide_box.slide_cont .swiper-button-next, .slide_box.slide_cont .swiper-button-prev { display: none !important; } .slide_box .scroll li button { background: 0 0; cursor: pointer; } @media (max-width: 1598px) { header .container { max-width: 100%; padding-left: 20px; padding-right: 20px; } .artists_debut .container .img { height: auto; object-fit: cover; } .artists_member .ly_cont li .img { width: 100%; height: auto; max-height: 100%; } .artists_member .ly_cont li .img img { width: 100%; height: 100%; object-fit: cover; } .slide_box .swiper-button-prev { left: -60px; } .slide_box .swiper-button-next { right: -60px; } } .artists section.privatestage_box .container h1 { max-width: 1280px; margin: 0 auto; } .privatestage_view { margin-top: 60px; } .schedule_box .schedule_year h2, .view_header p.f20 { font-weight: 600; font-family: HelveticaWorld, sans-serif; } .schedule_box .schedule_year button { font-size: 0; background: url(/images/schedule_prev.svg); width: 40px; height: 40px; cursor: pointer; } .brand_cont, .brand_statement, .intro_cont { background-color: #111; } .schedule_box .schedule_year button.prev { margin-right: 16px; } .schedule_box .schedule_year button.next { transform: rotate(180deg); margin-left: 16px; } .intro_scroll h2, .view_body .btn_view a::after { transform: translate(-50%, -50%); top: 50%; left: 50%; } .schedule_box .schedule_ic { display: flex; flex-wrap: nowrap; justify-content: flex-end; align-items: center; margin: 30px 0 22px; } .schedule_box .schedule_ic li { display: flex; flex-wrap: nowrap; align-items: center; margin-left: 20px; color: #999; font-weight: 600; text-transform: uppercase; } .schedule_box .schedule_ic li::before { content: ""; width: 22px; height: 22px; margin-right: 4px; } .schedule_box .schedule_ic li:first-child::before { background: url(/images/schedule_gric1.svg) no-repeat; } .schedule_box .schedule_ic li:nth-child(2)::before { background: url(/images/schedule_gric2.svg) no-repeat; } .schedule_box .schedule_ic li:nth-child(3)::before { background: url(/images/schedule_gric3.svg) no-repeat; } .schedule_box .schedule_list { margin-top: 22px; border-top: 1px solid #222; } .schedule_box .schedule_list li { display: flex; flex-wrap: nowrap; align-items: center; justify-content: flex-start; height: 118px; border-bottom: 1px solid #eaeaea; } .schedule_box .schedule_list li .date { width: 12%; padding-left: 16px; text-align: center; font-weight: 600; color: #111; font-family: rixsingose-pro; } .schedule_box .schedule_list li .date span:first-child { margin-right: 6px; font-weight: 700; } .schedule_box .schedule_list li .date span:nth-child(2) { position: relative; top: -1px; } .schedule_box .schedule_list li .time { min-width: 50px; width: 5.5%; font-weight: 400; color: #666; position: relative; top: 1px; font-family: HelveticaWorld, sans-serif; } .schedule_box .schedule_list li div { width: 82%; padding-left: 8px; display: flex; flex-wrap: nowrap; align-items: center; } .schedule_box .schedule_list li div .ic { display: block; width: 35px; margin-right: 14px; } .schedule_box .schedule_list li div h3 { width: calc(100% - 35px); font-weight: 500; position: relative; top: 2px; } .none_schedule { border-bottom: 1px solid #eaeaea; border-top: 1px solid #222; height: 400px; display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; text-align: center; } .none_schedule p { margin-top: 20px; font-size: 1.05rem; line-height: 1.16; font-weight: 500; color: #999; } .actors .search_box { margin: -28px auto 80px; } .actors_txt .img { width: 618px; } .actors_txt .img img { width: 100%; height: auto; } .actors_txt .txt { width: calc(100% - 618px); padding-left: 90px; } .actors_txt .txt p { font-size: 0.94rem; font-weight: 500; line-height: 1.88; letter-spacing: -0.02em; } .actors_filmography .container { padding: 110px 20px 100px; margin-bottom: 100px; border-bottom: 1px solid #eaeaea; } .actors h2.ly_tit { width: 440px; padding-right: 70px; font-family: HelveticaWorld, sans-serif; } .actors .ly_cont { width: calc(100% - 440px); } .actors .actors_history { margin-top: 24px; } .actors .actors_history li { display: none; flex-wrap: nowrap; align-items: flex-start; margin-bottom: 24px; } .actors .actors_history li.on { display: flex; } .actors .actors_history li h3 { width: 70px; font-size: 1.1rem; line-height: 1.8; font-family: HelveticaWorld, sans-serif; } .actors .actors_history li .txt { width: calc(100% - 70px); } .actors .actors_history li .txt p { margin: 2px 0 12px; font-size: 0.94rem; font-weight: 500; line-height: 1.88; letter-spacing: -0.02em; } .actors .history_tit h2 { margin-right: 30px; font-weight: 700; } .actors_discography .container { padding-bottom: 95px; margin-bottom: 100px; border-bottom: 1px solid #eaeaea; } .actors .actors_discography .history { margin-top: 0; } @media (min-width: 1599px) { .actors_filmography .ly_cont { margin-left: -20px; } } .notice_list ul { margin-right: -20px; } .notice_list ul li { width: calc(33.3% - 20px); margin: 0 20px 20px 0; } .notice_list ul li a { display: block; height: 300px; position: relative; padding: 36px 36px 65px; border: 1px solid #eaeaea; } .notice_list ul li a:hover { border-color: #ef4023; } .notice_list ul li p { font-size: 1.1rem; line-height: 1.5; font-weight: 500; white-space: normal; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; } .notice_list ul li .date { position: absolute; bottom: 36px; left: 36px; font-weight: 400; } .ir .sub_header, .news .sub_header { padding-top: 48px; } .news h1 { font-weight: 700; margin: 28px 0 50px; } .no_search_results .container { padding: 100px 0; border-top: 1px solid #eaeaea; border-bottom: 1px solid #eaeaea; text-align: center; } .no_search_results p { font-weight: 300; font-size: 1.2rem; line-height: 1.36; } .news .view_header h1 { margin: 28px 0 80px; } .notice_list ul li a:hover .cate { border-color: #ef4023; color: #ef4023; } .view_header { position: relative; padding: 48px 0 56px; } .view_header::before { content: ""; background: #eee; width: 100%; height: 100vh; position: absolute; bottom: 0; left: 0; z-index: -1; } .view_header .view_tit h2 { margin: 22px 0; line-height: 1.57; word-break: keep-all; font-family: rixsingose-pro; font-weight: 700; } .view_header .view_tit .date { font-weight: 400; } .view_header .view_tit .cate { margin: 0 auto; } div section.view_body .container { max-width: 980px; padding: 80px 0 40px; margin-bottom: 40px; border-bottom: 1px solid #eee; font-size: 0.94rem; letter-spacing: -0.02em; font-weight: 300; line-height: 1.88; color: #383838; font-family: rixsingose-pro; } .about_header span, .brand_txt span, .intro_location .ly_flex li h3, .intro_scroll h2, .ir .btn_down, .view_body .btn_down, .view_body .btn_view button { font-family: HelveticaWorld, sans-serif; } div section.view_body .container .ql-editor * { font-family: rixsingose-pro !important; font-size: 0.94rem !important; line-height: 1.88 !important; } div section.view_body .container .ql-editor [style*="font-size: 16px;"] { font-size: 1.18rem !important; } .ir .btn_down, .view_body .btn_down { margin: 100px 0 -60px; display: flex; flex-wrap: nowrap; align-items: center; font-size: 0.89rem; font-weight: 600; } .ir .btn_down::after, .view_body .btn_down::after { content: ""; width: 44px; height: 44px; border-radius: 50%; background: url(/images/btn_down2.svg) center no-repeat #111; } .ir .btn_down:hover::after, .sustainability .btn_down:hover::after, .view_body .btn_down:hover::after { background-color: #ef4023; } .view_body .btn_view .next::after, .view_body .btn_view .prev::before { background: url(/images/view_prev.svg); width: 6px; height: 12px; content: ""; } .view_body .btn_view { max-width: 980px; margin: 0 auto; display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; } .view_body .btn_view a { position: relative; display: block; font-size: 0; width: 80px; height: 80px; background-color: #111; } .view_body .btn_view a::after { content: ""; background: url(/images/list.svg) no-repeat; width: 22px; height: 12px; position: absolute; z-index: 1; } .view_body .btn_view button { display: flex; flex-wrap: nowrap; align-items: center; background: 0 0; font-size: 1rem; font-weight: 700; cursor: pointer; } .view_body .btn_view .prev::before { margin-right: 8px; position: relative; top: 1px; } .view_body .btn_view .next::after { margin-left: 8px; transform: rotate(180deg); } .view_file { margin-top: 90px; } .view_file li a { position: relative; display: inline-block; margin-bottom: 10px; padding-left: 40px; font-size: 0.89rem; text-transform: capitalize; font-weight: 600; } .view_file li a::before { content: ""; background: url(/images/view_file.svg) no-repeat; width: 30px; height: 30px; position: absolute; top: 0; left: 0; } .about_header { margin: 48px 0 0; } .about_header span { display: block; font-weight: 600; } .about_header h1 { margin: 28px 0 112px; } .brand_scroll, .intro_scroll, .offfice_cont { position: relative; height: 100vh; overflow: hidden; } .brand_scroll .bg, .intro_scroll .bg { position: relative; top: 100px; width: 1488px; height: 100%; margin: 0 auto; z-index: -1; } .brand_box, .brand_creative .bg { height: 100vh; } .intro_scroll h2 { color: #fff; text-align: center; position: absolute; } .intro_scroll h2.f64 { letter-spacing: 0.3em; line-height: 1.25; } .intro_scroll h2.f96 { opacity: 0; word-break: keep-all; } .intro_cont { padding: 200px 0 220px; margin-top: -1px; } .intro_cont ul li { max-width: 1170px; display: flex; flex-wrap: wrap; align-items: center; } .intro_cont ul li:nth-child(2n-1) { margin: 0 auto 180px 0; } .intro_cont ul li:nth-child(2n) { flex-direction: row-reverse; padding-left: 15px; margin: 0 0 180px auto; } .intro_cont ul li .img { width: 661px; } .intro_cont ul li .txt { width: calc(100% - 661px); color: #fff; } .intro_cont ul li:nth-child(2n-1) .txt { padding-left: 110px; } .intro_cont ul li:nth-child(2n) .txt { padding-right: 100px; } .intro_cont ul li .txt span { display: block; color: #ef4023; } .intro_cont ul li .txt h3 { margin: 10px 0 28px; } .intro_cont ul li .txt p { color: #999; line-height: 1.78; font-size: 1rem; } .social_contribution ul li .txt p, :lang(ko) .intro_cont ul li .txt p { word-break: keep-all; } .history_list > li:last-child, .sub_wrap section.error_box:last-of-type, .sub_wrap section.intro_location { padding-bottom: 0; } .intro_location .ly_flex li { width: 50%; display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; } .intro_location .ly_flex li div { padding: 0 20px; } .intro_location .ly_flex li h3 { margin-bottom: 18px; } .intro_location .ly_flex li p { line-height: 1.5; color: #666; } .brand_spirit ul li.f20, .brand_txt p { line-height: 1.6; } .brand_vision { margin-top: -65px; } .brand_vision .ly_flex { position: relative; } .brand_vision .ly_flex .img::before { content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: #fff; } .brand_vision .ly_flex .img:first-child { width: calc(100% - 390px); padding-top: 82px; } .brand_vision .ly_flex .img:first-child::before { animation: 1s linear forwards cover-left; } .brand_vision .ly_flex .img:nth-child(2) { top: 274px; width: 390px; padding-top: 82px; } .brand_vision .ly_flex .img:nth-child(2)::before { left: auto; right: 0; animation: 1s linear forwards cover-right; } .brand_txt { width: 650px; margin: 165px 0 150px auto; } .brand_txt span { display: block; font-weight: 700; } .brand_cont .txt h3, .brand_txt h2 { font-weight: 600; font-family: HelveticaWorld, sans-serif; } .brand_txt h2 { margin: 10px 0 60px; } .brand_txt p { color: #383838; } .brand_scroll .container { position: absolute; top: 0; left: 50%; transform: translateX(-50%); padding: 168px 20px 260px; } .brand_scroll .txt1 { color: #fff; font-family: HelveticaWorld, sans-serif; } .brand_scroll .txt1 h2 { line-height: 0.91; } .brand_scroll .txt2 { display: inline-block; opacity: 0; position: relative; left: 646px; bottom: -252px; color: #fff; line-height: 1.3; font-weight: 700; } .brand_cont { padding: 50px 0 250px; color: #fff; margin-top: -1px; } .brand_cont .brand_txt p { color: #999; word-break: keep-all; } .brand_cont ul { max-width: 1140px; margin: 0 auto; justify-content: space-between; } .brand_cont ul li:first-child { max-width: 510px; } .brand_cont ul li:nth-child(2) { max-width: 400px; } .brand_cont ul li:last-child .txt { margin: 62px 0 36px; } .brand_cont .txt h3 { padding: 40px 0 10px; } .brand_cont .txt p { line-height: 1.78; color: #999; word-break: keep-all; } .brand_cont div.ly_flex { align-items: flex-end; padding: 60px 0 0 180px; } .brand_cont div.ly_flex .img { width: 354px; } .brand_cont div.ly_flex .txt { width: calc(100% - 354px); padding: 0 0 30px 40px; } @keyframes cover-left { from { left: 0; } to { left: -100%; } } @-webkit-keyframes cover-left { from { left: 0; } to { left: -100%; } } @-ms-keyframes cover-left { from { left: 0; } to { left: -100%; } } @keyframes cover-right { from { right: 0; } to { right: -100%; } } @-webkit-keyframes cover-right { from { right: 0; } to { right: -100%; } } @-ms-keyframes cover-right { from { right: 0; } to { right: -100%; } } .brand_spirit { padding: 200px 0; } .brand_spirit ul li { width: 50%; word-break: keep-all; } .brand_spirit .brand_txt { width: 50%; margin: 0; } .brand_creative .container { position: absolute; top: 0; left: 50%; transform: translateX(-50%); padding: 180px 20px 260px; color: #fff; } .brand_creative .txt1 { font-family: HelveticaWorld, sans-serif; } .brand_creative .txt2 { opacity: 0; position: relative; left: 642px; bottom: -500px; color: #fff; line-height: 1.3; font-weight: 700; } .brand_statement { color: #fff; padding: 200px 0; margin-top: -1px; } .brand_statement .ly_flex .brand_txt { margin: 0; } .brand_statement .ly_flex li, .composition_box:nth-child(2) table th { width: 50%; } .brand_statement .ly_flex .f20 { color: #999; line-height: 1.6; } .brand_box { position: relative; margin-top: -1px; } .brand_box .txt, .history_header .txt_box { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; } .brand_box .txt h2 { margin-bottom: 50px; font-family: HelveticaWorld, sans-serif; line-height: 0.91; } .brand_box .txt h2 span { opacity: 0; display: block; white-space: nowrap; transform: translateY(20px); } .brand_box .txt p { opacity: 0; font-weight: 700; transform: translateY(20px); } .brand_identity { padding-top: 200px; margin-top: -1px; } .brand_identity .ly_flex .img, .social_contribution ul li .txt { width: calc(100% - 640px); } .brand_identity .ly_flex .txt, .social_contribution ul li .img { width: 640px; } .brand_identity .ly_flex .txt h2 { line-height: 1.2; font-family: HelveticaWorld, sans-serif; } .brand_identity .ly_flex .txt span { display: block; margin-top: 10px; color: #999; font-family: HelveticaWorld, sans-serif; } .brand_identity .ly_flex .txt p { margin: 40px 0 63px; color: #666; line-height: 1.78; word-break: keep-all; } .brand_identity .ly_flex .txt a { font-size: 0.89rem; display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; width: 197px; height: 43px; background: #111; color: #fff; font-family: HelveticaWorld, sans-serif; } @media (max-width: 1680px) { .brand_vision .ly_flex .img:first-child { padding-right: 60px; } } @media (max-width: 1488px) { .brand_scroll .bg, .intro_scroll .bg { width: 90%; } .brand_creative .container, .brand_scroll .container { width: 90%; height: calc(100% - 100px); top: 100px; padding: 0 20px; overflow: hidden; } .brand_creative .txt2 { bottom: -300px; } .brand_identity .ly_flex .txt { padding-left: 30px; } } .offfice_visual { position: relative; height: 100vh; } .offfice_visual .tit { max-width: 601px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; } .offfice_visual p { opacity: 0; margin: 11px 0; color: #fff; font-size: 3.2rem; line-height: 1.2; letter-spacing: 0.16em; font-weight: 600; font-family: HelveticaWorld, sans-serif; white-space: nowrap; } .offfice_visual p:first-of-type { animation: 1s 0.5s alternate both fadeInUp; } .offfice_visual p:nth-of-type(2) { animation: 1s 0.8s alternate both fadeInUp; } .offfice_visual p:nth-of-type(3) { animation: 1s 1.1s alternate both fadeInUp; } .offfice_visual p:nth-of-type(4) { animation: 1s 1.4s alternate both fadeInUp; } .offfice_visual span { animation: 0.5s linear forwards width; height: 2px; display: block; width: 0; background-color: #fff; } .offfice_visual span:nth-of-type(2) { animation-delay: 0.2s; } .offfice_visual span:nth-of-type(3) { animation-delay: 0.4s; } .offfice_visual span:nth-of-type(4) { animation-delay: 0.6s; } .offfice_visual span:nth-of-type(5) { animation-delay: 0.8s; } @keyframes width { to { width: 100%; } } @-webkit-keyframes width { to { width: 100%; } } @-ms-keyframes width { to { width: 100%; } } .offfice_cont .box { width: 100%; height: 100vh; overflow: hidden; } .offfice_cont .box p span { display: block; opacity: 0; font-weight: 700; white-space: nowrap; } :lang(en) .offfice_cont .box p span { word-break: break-word !important; } :lang(ja) .offfice_cont .box p span, :lang(zh) .offfice_cont .box p span { font-family: HelveticaWorld !important; word-break: break-word !important; } .offfice_cont .box1 { z-index: 2; position: relative; } .offfice_cont .box::before { max-height: 100vh; z-index: -2; background-size: inherit; background-position: center; } .offfice_cont .box .bg { opacity: 0; background: #111; position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; z-index: -1; } .offfice_cont .box1::before { content: ""; width: 100%; height: 100%; background: url(/images/offfice_bg1.jpg) center center no-repeat; position: absolute; left: 0; top: 0; background-size: inherit; } .offfice_cont .box2::before { content: ""; width: 100%; height: 100%; background: url(/images/offfice_bg2.jpg) center center no-repeat; position: absolute; left: 0; top: 0; z-index: 1; background-size: inherit; } .offfice_cont .box2 .box_inner { position: relative; height: 100%; z-index: 1; } .offfice_cont .box .box_inner p { font-weight: 700; line-height: 1.65; letter-spacing: -0.02em; word-break: keep-all; } .offfice_cont .box3::before { content: ""; width: 100%; height: 100%; background: url(/images/offfice_bg3.jpg) center center no-repeat; position: absolute; left: 0; bottom: 0; background-size: inherit; } .offfice_cont .box3 .box_inner { position: relative; height: 100%; } .offfice_cont .box .txt { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; width: 720px; } .offfice_scroll { position: relative; padding-bottom: 200px; } .offfice_scroll .txt_box { display: flex; flex-wrap: wrap; align-items: flex-start; } .offfice_scroll h2 { width: 410px; font-family: HelveticaWorld, sans-serif; } .offfice_scroll p { width: calc(100% - 410px); padding-left: 25px; word-break: keep-all; } .offfice_scroll .sub_contmenu.fix { position: fixed; top: 160px; } .offfice_scroll .sub_contmenu { width: 252px; position: absolute; top: 11vw; left: 40px; } .offfice_scroll .sub_contmenu a { display: block; padding-bottom: 18px; opacity: 0.3; color: #111; font-size: 0.94rem; font-weight: 600; font-family: HelveticaWorld, sans-serif; } .offfice_scroll .page_section { padding-top: 180px; } .offfice_scroll .img_box { display: flex; flex-wrap: wrap; padding-top: 80px; margin-right: -25px; } .offfice_scroll .img_box li { margin-right: 25px; } .offfice_scroll .img_box li ul { margin-right: -25px; } .img_box li div { margin-bottom: 25px; } @media (max-width: 1880px) { :lang(ja) .offfice_scroll .sub_contmenu { display: none; } } @media (max-width: 1720px) { .offfice_scroll .sub_contmenu { display: none; } } .about .history::after, .history_wrap:before { bottom: 158px; background: #dadada; } .page_section.recording span { display: block; position: absolute; top: 0; left: 0; color: #000; font-family: HelveticaWorld, sans-serif !important; font-size: 20px; font-style: normal; font-weight: 600; line-height: normal; } .page_section.recording .col-2 { position: relative; padding-top: 28px; margin-bottom: 72px; display: flex; flex-wrap: wrap; align-items: flex-start; gap: 25px; } .page_section.recording .col-2 > div { width: calc(50% - 25px); margin-bottom: 0; } .page_section.recording .col-3 { position: relative; display: flex; flex-wrap: wrap; align-items: flex-start; gap: 25px; margin-right: 0; } .page_section.recording .col-3 > li { position: relative; padding-top: 28px; margin: 0; width: calc(100% / 3 - 25px); } .page_section.recording .col-3 > li > div { margin-bottom: 72px; } .history_header { height: 100vh; overflow: hidden; position: relative; } .history_header h1 { margin-bottom: 20px; font-weight: 500; line-height: 1.15; word-break: keep-all; font-family: rixsingose-pro; } :lang(en) .history_header h1 { font-family: HelveticaWorld, sans-serif !important; font-weight: 700; } .history_header p, .history_year { font-family: HelveticaWorld, sans-serif; } .history_header p { font-weight: 700; } .history_header .bg { height: 100%; position: relative; z-index: -1; } .about .history { padding: 160px 0 200px; position: relative; } .about .history::after, .history_line, .history_wrap:before { position: absolute; top: 16px; left: calc(50% + 3px); width: 1px; content: ""; } .about .history::after { height: 100%; z-index: -1; } .history h2 { text-align: center; font-weight: 700; } .history_list > li { position: relative; padding-bottom: 100px; display: flex; flex-wrap: nowrap; align-items: flex-start; justify-content: center; gap: 34px; } .history_list > li .company, .ql-align-right { text-align: right; } .history_list > li > div { width: 540px; } .history_list > li .txt_box { margin-bottom: 28px; padding-top: 20px; } .history_list > li .txt_box .history_cate { font-family: HelveticaWorld, sans-serif; display: block; margin-bottom: 8px; font-size: 12px; line-height: 1.25; font-weight: 700; letter-spacing: -0.03em; } .contact_header p, .esg_target.renewal .tit .txt, .esg_target.renewal h3.tit { font-family: HelveticaWorld, sans-serif !important; } .history_list > li .txt_box .txt { font-size: 1.3rem; line-height: 1.4; letter-spacing: -0.02em; color: #666; font-weight: 300; word-break: keep-all; } .history_year { padding: 10px; font-weight: 600; transition: 0.3s ease-out; color: #111; background: #fff; font-size: 2.89rem; z-index: 1; white-space: nowrap; } .history_line { max-height: calc(100% - 74px); height: 0; background: #ef4023; } .file button, .form .file label { font-size: 0; width: 39px; height: 39px; bottom: 9px; right: 0; position: absolute; z-index: 1; } .contact_header { margin: 153px 0 107px; } .contact_header p { margin-bottom: 40px; font-weight: 600; } .contact_header h1 { line-height: 1.3; font-weight: 700; } .contact_box .txt span { display: block; padding-bottom: 11px; } .contact_box .form_wrap { width: 720px; margin: 0 auto; } .contact_box .btn_wrap { padding-top: 34px; margin: 0; } .alert_txt { display: block; margin-top: 12px; font-size: 14px; letter-spacing: -0.03em; line-height: 1.2; color: #ef4023; } @media (max-width: 980px) { .vibe_section .bg_slide { margin-top: 65px; top: 0; } div section.view_body .container { position: relative; width: 100%; padding: 56px 20px 40px; border-bottom: 0; } div section.view_body .container::after { content: ""; background: #eee; margin: 0 20px; width: calc(100% - 40px); height: 1px; position: absolute; left: 0; bottom: 0; } .view_body .btn_view { padding: 0 20px; } .view_body .btn_view a { width: 60px; height: 60px; } .view_file { margin-top: 60px; } .view_file li a { padding-left: 34px; margin-bottom: 6px; } .view_file li a::before { width: 24px; height: 24px; background-size: contain; } .contact_box .form_wrap, .contact_box .tit { width: 100%; } .contact_box .txt { padding-left: 0; width: 100%; } } .form .file label { cursor: pointer; background: url(/images/attach_file.svg) center no-repeat; } .btn_submit, .form .radio span { font-weight: 700; font-size: 0.89rem; cursor: pointer; } .file button { cursor: pointer; background: url(/images/delete_file.svg) center no-repeat; } .file input[type="file"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; top: 50%; right: 10px; } .form_wrap .file .basic { padding-left: 0; } input:-ms-input-placeholder { color: #969696; } input::-webkit-input-placeholder { color: #969696; } input::-moz-placeholder { color: #969696; } input::-o-placeholder { color: #969696; } input:disabled { background: 0 0; color: #666; opacity: 1; } .form > li { margin: 0 0 19px; } .form > li:last-child { position: relative; margin-bottom: 0; margin-right: 0; } .form .privacy h3, .form > li.textarea_tit { margin-bottom: 24px; } .form .input_type { width: 100%; margin-top: 0; height: 57px; font-size: 1rem; color: #111; line-height: 1.16; border: none; border-bottom: 1px solid #c7c7c7; outline: 0; appearance: none; -webkit-appearance: none; position: relative; font-family: "Noto Sans", sans-serif; } .form .input_type:focus { border-bottom: 2px solid; } .form .radio { display: flex; flex-wrap: wrap; width: 100%; } .form .radio label { position: relative; display: flex; align-items: center; margin-right: 12px; } :lang(en) .form .radio label, :lang(ja) .form .radio label, :lang(zh) .form .radio label { margin-bottom: 12px; width: calc(50% - 12px); } .form .radio input { display: none; appearance: none; -webkit-appearance: none; outline: 0; visibility: hidden; cursor: pointer; } .form .radio input:checked + span { color: #111; border-color: #ef4023; } .stock_box ul, table tr { border-bottom: 1px solid #d9d9d9; } .form .radio input:checked + span:after { content: ""; border: 2px solid #111; } .form .radio span { width: 100%; position: relative; padding: 19px 31px; white-space: nowrap; display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; } .form .radio span:after { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%; height: 100%; border: 1px solid #ccc; } .form textarea.input_type { height: 160px; } .form textarea::placeholder { color: #969696; } .form label { position: relative; height: 100%; display: block; } .form li:first-child .label { position: relative; margin-bottom: 20px; top: 0; font-weight: 700; font-size: 0.83rem; line-height: 1; color: #666; } .form li .label { left: 0; width: 100%; z-index: 1; letter-spacing: -0.03em; color: #666; font-weight: 700; transition: 0.2s; } .form li label .label { position: relative; top: 0; font-size: 0.83rem; line-height: 1; color: #666; padding-top: 30px; } .form li label .label.textarea { margin-bottom: 20px; } .ck label { display: inline-block; padding-left: 33px; position: relative; } .ck input, .ck input + span:before { width: 24px; height: 24px; position: absolute; left: 0; top: 0; } .ck input { visibility: visible; opacity: 0; } .ck input + span:before { background: url(/images/ck_box_off.svg) no-repeat; box-sizing: border-box; content: ""; } .ck span { line-height: 24px; letter-spacing: -0.05em; } .ck input:checked + span:before { background-image: url(/images/check_box.svg); } .btn_submit { display: flex; align-items: center; justify-content: center; margin: 0 auto; background: #111; color: #fff; width: 280px; height: 54px; transition: 0.2s linear; } .form .privacy { padding-top: 28px; } .form .privacy .ck-input label { cursor: pointer; display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; } .form .privacy .ck-input label a { display: block; margin-left: 8px; color: #383838; border: 1px solid #383838; padding: 3px 3px 2px; border-radius: 2px; font-size: 13px; } .form .privacy .ck-input span { position: relative; display: flex; flex-wrap: nowrap; align-items: center; word-break: keep-all; font-size: 0.83rem; font-weight: 500; } .form .privacy .ck-input span::before { content: ""; background-image: url(/images/ck_box_off.svg); top: -1px; left: 0; width: 24px; height: 24px; background-repeat: no-repeat; background-size: contain; padding-right: 9px; } .form .privacy .ck-input input:checked + span:before { background-image: url(/images/ck_box.svg); } @media (max-width: 1199px) { .intro_cont .img_box { width: 40%; } .intro_cont ul li .txt { width: 60%; } .form .radio span { padding: 11px 27px; } .form .radio label { margin-right: 16px; } } .sustainability .xs_ttl { text-align: center; margin-bottom: 30px; font-family: rixsingose-pro; } .sustainability .ttl_box { margin-bottom: 80px; text-align: center; } .sustainability .ttl_box p { line-height: 1.88; } .sustainability .btn_down { display: flex; flex-wrap: nowrap; align-items: center; text-transform: capitalize; float: right; } .sustainability .btn_down::after { content: ""; width: 44px; height: 44px; border-radius: 50%; background-color: #111; background-position: center; background-repeat: no-repeat; background-size: auto; } .btn_down1::after { background-image: url(/images/btn_down1.svg); } .btn_down2::after { background-image: url(/images/btn_down2.svg); } .esg_box { position: relative; margin: 78px 0 120px; min-height: 601px; } .esg_box .txt_box { max-width: 680px; width: 51%; padding-right: 60px; } .esg_box .xs_ttl { text-align: left; margin-bottom: 0; line-height: 1.52; font-family: rixsingose-pro, sans-serif; } .esg_box span { display: block; font-weight: 700; color: #c8b46f; line-height: 1.52; font-family: HelveticaWorld, sans-serif; } .esg_box span.gray { color: #999; font-family: rixsingose-pro; } .esg_box p { margin-top: 50px; line-height: 1.88; word-break: keep-all; } .esg_box .right_img { position: absolute; top: 0; right: 0; max-width: 830px; width: 50%; } .esg_target { padding: 180px 0; background: #1a1a1a; color: #fff; } .esg_target .round_box { position: relative; display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; padding-bottom: 105px; margin: 100px 0 70px; } .esg_target .round_box::after, .esg_target.renewal .txt_list::after { content: ""; background: url(/images/round_down.svg); width: 26px; height: 35px; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); } .esg_target .round_box li { display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; width: 280px; height: 280px; border-radius: 50%; text-align: center; font-weight: 700; } .esg_target .round_box li.round1 { right: 20px; position: relative; z-index: 0; background: #fff; color: #1a1a1a; } .esg_target .round_box li.round2 { left: 20px; position: relative; z-index: 1; background: rgba(177, 157, 96, 0.9); } .esg_target .round_box.aos-animate li.round1 { animation: 0.5s linear 1s forwards round-right; } .esg_target .round_box.aos-animate li.round2 { animation: 0.5s linear 1s forwards round-left; } @keyframes round-right { to { right: -20px; } } @-webkit-keyframes round-right { to { right: -20px; } } @-ms-keyframes round-right { to { right: -20px; } } @keyframes round-left { to { left: -20px; } } @-webkit-keyframes round-left { to { left: -20px; } } @-ms-keyframes round-left { to { left: -20px; } } .esg_target_cont { display: flex; flex-wrap: wrap; margin-right: -190px; } .esg_target_cont > li { position: relative; width: calc(33.3% - 95px); margin-right: 95px; padding-right: 95px; } .esg_target_cont > li::after { content: ""; background: #d9d9d9; opacity: 0.1; width: 1px; height: 376px; position: absolute; top: 50%; right: 0; transform: translateY(-50%); } .esg_target_cont > li .tit h3 { margin: 20px 0 8px; line-height: 1.14; word-break: keep-all; } .esg_target_cont > li .tit span.f15 { font-family: HelveticaWorld, sans-serif; font-weight: 400; color: #999; } .esg_target_cont > li p.f17 { text-align: center; color: #c8b46f; margin: 40px 0 52px; line-height: 1.4; font-weight: 500; letter-spacing: -0.02em; word-break: break-word; } .esg_target_cont > li ul { display: inline-block; position: relative; left: 50%; transform: translateX(-50%); } .esg_target_cont > li ul li:not(:first-child) { display: flex; flex-wrap: nowrap; align-items: center; margin-bottom: 4px; letter-spacing: -0.02em; color: #999; font-weight: 500; line-height: 1.37; position: relative; padding-left: 8px; } .esg_target_cont > li ul li:not(:first-child)::before { content: ""; width: 2px; height: 2px; background: #999; position: absolute; top: 10px; left: 0; } .esg_target_cont > li ul li:first-child { text-align: center; margin-bottom: 14px; } .esg_target.renewal h3.tit { margin-top: 90px; text-align: center; color: #c8b46f; line-height: 84.21px; text-transform: uppercase; font-weight: 700; font-size: 70px; } .esg_target.renewal .txt_list { position: relative; display: flex; justify-content: center; align-items: center; gap: 16px; margin: 24px 0 70px; padding-bottom: 105px; } .esg_target.renewal .txt_list li { width: 280px; height: 74px; text-align: center; line-height: 1.2; color: #c8b46f; font-weight: 700; border: 1px solid rgba(200, 180, 111, 0.4); display: flex; align-items: center; justify-content: center; } .esg_target.renewal .tit .ic img { width: 100px; } .esg_target.renewal .tit .ic img:last-child { margin-left: 6px; } .esg_target.renewal .esg_target_cont > li::after { top: 50%; height: 303px; margin-top: 6px; } .esg_target.renewal .esg_target_cont li h3 { margin-top: 26px; } .esg_target.renewal .tit .txt { color: #999; line-height: 20.45px; } .esg_target.renewal .desc { margin-top: 40px; text-align: center; line-height: 26px; color: #ccc; } @media (max-width: 1280px) and (min-width: 768px) { .esg_target .esg_target_cont > li .desc br.pc { display: none; } } @media (max-width: 925px) and (min-width: 768px) { .esg_target.renewal h3.tit { line-height: 69px; } .esg_target.renewal .tit .ic img { width: 80px; } .esg_target.renewal .esg_target_cont li h3 { font-size: 1.2rem; } .esg_target.renewal .esg_target_cont li .txt { font-size: 0.85rem; } .esg_target.renewal .esg_target_cont li .desc { margin-top: 25px; font-size: 0.9rem; } } .esg_certification, .esg_committee { padding: 160px 0; background: #f5f5f5; } .esg_committee .btn_down { justify-content: flex-end; font-weight: 700; text-transform: uppercase; margin-bottom: 24px; } .esg_committee ul { display: flex; flex-wrap: wrap; margin-right: -20px; clear: both; } .esg_committee ul li { margin-right: 20px; padding: 50px; width: calc(33.3% - 20px); background: #fff; border: 1px solid #eee; } .esg_committee ul li h3 { margin-bottom: 8px; } .esg_committee ul li span.f14 { color: #666; font-weight: 500; } .esg_committee .committee_box { margin-top: 48px; font-size: 0.89rem; letter-spacing: -0.03em; } .esg_committee .committee_box span { display: inline-flex; flex-wrap: wrap; justify-content: center; align-items: center; padding: 10px 12px 8px; margin-bottom: 16px; background: #111; color: #fff; font-weight: 700; text-transform: capitalize; } .esg_committee .committee_box p { line-height: 1.8; color: #111; font-weight: 300; } .esg_organization { padding: 160px 0; text-align: center; } .esg_certification ul { display: flex; flex-wrap: wrap; text-align: center; justify-content: center; margin-right: -40px; } .esg_certification ul li { text-align: left; max-width: 297px; width: calc(33.3% - 60px); margin-right: 60px; } .esg_certification ul li .img img { box-shadow: 10px 10px 24px rgba(0, 0, 0, 0.08); } .esg_certification ul li h3 { margin-top: 48px; font-weight: 700; font-family: rixsingose-pro; line-height: 1.4; } .composition_box table td, .ct-label, .esg_certification ul li span, .graph_bar > div h2, .graph_bar > div p, .graph_box .bg li p, .guide_list li a, .ir_list ul li .num, .ir_list ul li p, .total, .with_major_achievements span.f20, .with_major_achievements ul li h3, .yg_instagram h2 { font-family: HelveticaWorld, sans-serif; } .esg_certification ul li span { display: block; margin: 14px 0 17px; font-weight: 700; color: #afa06b; } .esg_certification ul li p { font-weight: 300; line-height: 2; letter-spacing: -0.02em; word-break: keep-all; } .esg_guide { padding: 160px 0; } .guide_list li { position: relative; padding: 32px; width: calc(33.3% - 20px); height: 300px; margin: 0 20px 20px 0; background: #f5f5f5; } .guide_list li h3 { font-weight: 700; line-height: 1.1; } .guide_list li p, .with_box .with_cont p { line-height: 1.88; word-break: keep-all; } .guide_list li p { margin-top: 18px; letter-spacing: -0.02em; font-weight: 300; } .guide_list li a { position: absolute; bottom: 32px; right: 40px; font-weight: 600; font-size: 0.89rem; } .esg_report .guide_list li h3 { -webkit-line-clamp: 4; line-height: 1.3; } .with_box { position: relative; padding: 72px 0 253px; } .with_box .img_box { position: absolute; left: 0; bottom: 10px; } .with_box .img_box li:last-child { top: -90px; left: 385px; position: relative; } .with_box .xs_ttl { width: 475px; letter-spacing: -0.03em; line-height: 1.52; text-align: left; font-weight: 700; } .with_box .with_cont { width: calc(100% - 475px); padding-left: 174px; } .with_box .with_cont ul { display: flex; margin-top: 150px; } .with_box .with_cont ul li:last-child { display: flex; flex-wrap: nowrap; margin-left: 24px; } .with_box .with_cont ul li:last-child::before { content: ""; width: 4px; height: 40px; background: #111; margin-right: 21px; } @media (min-width: 2000px) { .offfice_cont .box1::before, .offfice_cont .box2::before, .offfice_cont .box3::before { background-size: cover; } .esg_box .right_img { right: auto; left: calc(50% + 500px); transform: translateX(-50%); } .with_box .img_box { left: calc(50% - 740px); transform: translateX(-50%); } } .with_major_achievements { background: #1a1a1a; color: #fff; padding: 170px 0 180px; text-align: center; } .with_major_achievements span.f20 { display: block; margin-top: 12px; color: #999; font-weight: 400; } .with_major_achievements ul { display: flex; flex-wrap: wrap; justify-content: center; margin-right: -132px; padding-top: 80px; } .with_major_achievements ul li { position: relative; max-width: 346px; width: calc(33.3% - 66px); margin-right: 66px; padding-right: 66px; } .with_major_achievements ul li::after { content: ""; width: 2px; height: 190px; background: #eee; opacity: 0.1; position: absolute; top: 0; right: 0; } .with_major_achievements ul li h3 { margin: 20px 0 16px; font-weight: 700; white-space: nowrap; } .with_major_achievements ul li h3 .f18 { padding-left: 2px; font-family: rixsingose-pro; } :lang(en) .with_major_achievements ul li h3 .f18 { padding: 0 4px; } .with_major_achievements ul li p { color: #999; font-weight: 700; display: block; } .social_contribution { padding: 170px 0; } .social_contribution h2 { text-align: center; margin-bottom: 80px; } .social_contribution ul li { display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 100px; } .social_contribution ul li:nth-child(2n-1) .txt { padding-left: 75px; } .social_contribution ul li:nth-child(2n) { flex-direction: row-reverse; } .social_contribution ul li:nth-child(2n) .txt { padding-right: 75px; } .yg_instagram h2 { margin-bottom: 80px; } .yg_instagram ul li { width: calc(25% - 20px); margin-right: 20px; margin-bottom: 20px; } .compliance_utilize ul, .graph_list { display: flex; flex-wrap: wrap; margin-right: -40px; } .compliance_utilize ul li { width: calc(50% - 40px); margin-right: 40px; margin-bottom: 40px; border: 1px solid #eaeaea; padding: 40px; } .compliance_utilize ul li h3 { margin: 30px 0 16px; } .compliance_utilize ul li p { letter-spacing: -0.02em; word-break: keep-all; } .compliance_policy { background: #a5924e; color: #fff; padding: 160px 0; } .sub_wrap section.compliance_policy:last-of-type { padding-bottom: 160px; } .sub_wrap section.compliance_policy .container { max-width: 1128px; z-index: 1; } .compliance_policy .container::after { content: ""; background: url(/images/compliance_policy_bg.svg) no-repeat; width: 588px; height: 588px; position: absolute; top: -56px; right: 0; z-index: -1; } .compliance_policy .ttl_box p, .mt30, .stock_view .table { margin-top: 30px; } .compliance_policy .txt_box { margin-bottom: 40px; } .compliance_policy .txt_box p { margin-bottom: 16px; font-weight: 700; } .num_list { padding-left: 20px; } .num_list li { font-weight: 500; font-size: 0.89rem; line-height: 1.75; letter-spacing: -0.02em; list-style: decimal; } @media (min-width: 767px) { #me1 .img_box li:first-child, #me3 .img_box > li:first-child, #me3 .img_box > li:nth-child(4), #me5 .img_box > li:first-child, #me5 .img_box > li:nth-child(3), #me6 .img_box > li:first-child, #me8 .img_box > li:nth-child(2), #me8 .img_box > li:nth-child(3) { width: calc(66.66% - 25px); } #me1 .img_box li:nth-child(2), #me3 .img_box > li:nth-child(2), #me3 .img_box > li:nth-child(3), #me5 .img_box > li:nth-child(2), #me6 .img_box > li:nth-child(2), #me8 .img_box > li:first-child, #me8 .img_box > li:nth-child(4) { width: calc(33.33% - 25px); } #me3 .img_box, #me8 .img_box { align-items: flex-end; } #me3 .img_box > li:nth-child(5) { width: calc(66.66% - 435px); text-align: left; margin-left: 33.33%; } #me3 .img_box > li ul li, #me6 .img_box ul li, #me8 .img_box ul li { margin-bottom: 25px; } #me4 .img_box > li:first-child { width: calc(100% - 25px); } #me4 .img_box > li ul li { width: calc(33.3% - 25px); } #me7 .img_box > li { width: calc(50% - 25px); } #me8 .img_box > li:nth-child(5) { width: calc(66.66% - 25px); text-align: right; } .compliance_box.esg_box .txt_box { padding-right: 40px; } } .ir h1 { margin: 40px 0 66px; font-weight: 700; font-family: rixsingose-pro; } .composition_box h2, .directors_box h2, .graph_box .bg li, .mb30, .stock_box h2 { margin-bottom: 30px; } table::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 1px; background: #383838; } table tr.bg { background: #f8f8f8; } .stock_box ul li, table td, table th { border-right: 1px solid #d9d9d9; } .composition_box table th:last-child, .stock_box ul li:last-child, table td:last-child, table th:last-child { border-right: 0; } .directors_box table { font-size: 0.89rem; color: #383838; font-weight: 700; } .directors_box table tr { height: 134px; } .directors_box table tr td { width: 28%; padding-top: 44px; padding-bottom: 44px; border-right: 1px solid #d9d9d9; text-align: center; } .directors_box table tr td:last-child { width: 44%; border-right: 0; text-align: left; padding-left: 40px; font-weight: 500; } .directors_box table tr p { position: relative; line-height: 1.8; } .directors_box table tr p::before { content: "· "; } @media (max-width: 1180px) and (min-width: 767px) { .offfice_scroll p { font-size: 0.89rem; } .offfice_cont .box .box_inner p br.pc { display: none; } #me3 .img_box > li:nth-child(5) img { min-width: 226px; } .directors_box table tr td { width: 20%; } .directors_box table tr td:last-child { width: 60%; } } .legend li, .table1 table td h3 { margin-bottom: 10px; } .total { margin-bottom: 20px; display: flex; flex-wrap: nowrap; justify-content: flex-end; align-items: center; font-size: 1rem; color: #999; } .ct-label, .legend { font-weight: 600; display: none; } .total span { padding-left: 6px; color: #383838; font-weight: 500; } .composition_box .ly_flex { align-items: flex-start; } .composition_box table { font-size: 0.94rem; font-weight: 500; letter-spacing: -0.02em; } .composition_box table th { padding-top: 4px; border-right: 1px solid #d9d9d9; background: #eee; height: 46px; font-size: 0.83rem; } .composition_box table td { height: 62px; text-align: center; font-weight: 600; } .composition_box:nth-child(3) table td:first-child { width: 40%; font-weight: 500; font-family: rixsingose-pro; font-size: 0.83rem; letter-spacing: -0.02em; } .composition_box:nth-child(3) table td:nth-child(2) { width: 30%; } .composition_box:nth-child(3) table td:nth-child(3) { width: 30%; border-right: 0; } .composition_box .ly_flex table { width: calc(100% - 502px - 86px); } .composition_box .ly_flex .img { width: calc(502px + 86px); padding-left: 86px; } .legend { margin: 20px 0 0 55px; letter-spacing: -0.02em; line-height: 1.3; color: #999; font-size: 0.78rem; } .legend li { display: flex; flex-wrap: nowrap; position: relative; } .legend li span { display: block; margin-right: 6px; width: 17px; height: 17px; border-radius: 50%; } .ct-label { text-align: center; fill: #111; color: #111; font-size: 0.83rem; line-height: 1; opacity: 0.9; } @media (max-width: 1023px) and (min-width: 768px) { .with_major_achievements ul li h3 { font-size: 2.25rem; } .ct-chart svg { width: 400px !important; } .composition_box .ly_flex .img { margin: 0 auto 40px; padding-left: 0; display: flex; flex-wrap: nowrap; align-items: center; width: auto; } } .ir_list ul { border-top: 1px solid #383838; } .ir_list ul li { display: flex; flex-wrap: nowrap; align-items: center; height: 76px; border-bottom: 1px solid rgba(17, 17, 17, 0.15); } .ir_list ul li .num { width: 5.5%; text-align: center; font-weight: 400; font-size: 0.89rem; color: #666; } .ir_list ul li h2 { width: 79.5%; padding-left: 44px; font-weight: 500; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .ir_list ul li span { width: 29px; } .ir_list ul li .ic { width: 29px; display: block; } .ir_list ul li p { width: calc(15% - 29px); padding-left: 22px; font-size: 0.89rem; color: #666; text-align: center; } .ir_disclosure.ir_list ul li > a { width: 100%; display: flex; flex-wrap: nowrap; align-items: center; height: 76px; } .ir_disclosure.ir_list ul li h2 { width: 69.5%; } .ir_disclosure.ir_list ul li .ent { width: 14%; text-align: center; font-size: 0.89rem; color: #666; } .ir_disclosure.ir_list ul li p { width: 11%; padding-left: 0; } .graph_list > li { width: calc(33.3% - 40px); margin-right: 40px; } .graph_list .f22 { font-weight: 700; margin-bottom: 40px; } .graph_box { position: relative; padding-bottom: 21px; } .graph_box .bg li { display: flex; flex-wrap: nowrap; align-items: center; } .graph_box .bg li:last-child .line { background-color: #111; height: 2px; } .graph_box .bg li p { width: 68px; font-size: 0.89rem; font-weight: 400; text-align: right; white-space: nowrap; } .graph_box .bg li .line { width: calc(100% - 68px); margin-left: 2px; height: 1px; background-color: #eaeaea; } .graph_bar { position: absolute; bottom: 0; left: 97px; width: calc(100% - 97px); height: 100%; display: flex; flex-wrap: nowrap; align-items: flex-end; margin-right: -41px; } .graph_bar > div { width: calc(33.3% - 41px); margin-right: 41px; text-align: center; } .graph_bar > div .bar_box { display: flex; flex-wrap: wrap; align-items: flex-end; position: absolute; bottom: 30px; width: calc(33.3% - 41px); height: calc(100% - 39px); } .graph_bar > div p { margin-bottom: 2px; font-size: 0.89rem; font-weight: 400; white-space: nowrap; } .graph_bar > div h2 { margin-top: 12px; font-weight: 600; font-size: 1rem; white-space: nowrap; } .graph_bar > div .bar { position: relative; display: block; width: 60px; margin: 0 auto; background: #bbb; } .graph_bar > div .bar span { position: absolute; left: 50%; top: -18px; transform: translateX(-50%); font-family: HelveticaWorld, sans-serif !important; } .error_box h1, .finance_box tbody td:not(:first-child), .stock_box h2 span, .stock_box table td, .stock_list table td, .stock_view p.f16 span, .stock_view ul li div p span, .stock_view ul li h3, .stock_view ul li:last-child p span, .table1 table th { font-family: HelveticaWorld, sans-serif; } .graph_bar > div:last-child .bar { background: #ef4023; } .finance_box .unit { margin: 80px 0 20px; text-align: right; font-size: 0.79rem; letter-spacing: -0.02em; color: #999; } .finance_box thead th { width: 25%; background: #eee; height: 46px; } .finance_box tbody td:first-child, .finance_box thead th:first-child { color: #666; font-size: 0.83rem; letter-spacing: -0.02em; } .finance_box thead th:not(:first-child) { font-size: 1rem; font-family: HelveticaWorld, sans-serif; } .finance_box tbody td { height: 61px; text-align: center; } .finance_box tbody td:not(:first-child) { font-weight: 400; font-size: 1rem; } @media (max-width: 1180px) and (min-width: 768px) { .header2 .navbar .sub_menu { padding-bottom: 12px; } .actors_txt .txt p, .brand_cont .txt p, .brand_identity .ly_flex .txt p, .compliance_policy .ttl_box p, .compliance_utilize ul li p, .discography_cont .body_box p, .esg_box p, .esg_target_cont > li p.f17, .esg_target_cont > li ul li:not(:first-child), .guide_list li p, .intro_cont ul li .txt p, .social_contribution ul li .txt p, .sustainability .ttl_box p, .with_box .with_cont p, div section.view_body .container { font-size: 0.89rem; } .schedule_box .schedule_list li div h3 { font-size: 1.2rem; } .schedule_box .schedule_list li .time { top: 0; } .actors .history_tit h2 { font-size: 0.8rem; } .brand_cont ul li:nth-child(2) .txt p br, .brand_creative .bg .pc, .brand_statement .ly_flex .f20 br.pc, .esg_target_cont > li p.f17 br.pc, .intro_scroll .bg .pc, .with_box .xs_ttl > br.pc { display: none; } .brand_creative .bg .tab, .intro_scroll .bg .tab { display: block; } .brand_spirit ul li.f20, .brand_statement .ly_flex .f20, .brand_txt p { font-size: 1rem; } .brand_cont ul li:nth-child(2) .txt { margin-top: 450px; } .brand_creative .txt2 { bottom: -60vh; } .esg_box .right_img { width: 39%; } .esg_box .txt_box { width: 61%; } .esg_target_cont { margin-right: 0; } .esg_target_cont > li { width: 33.3%; padding: 0 48px; margin: 0; } .with_box .with_cont p, .with_box .xs_ttl { padding-bottom: 60px; } .with_box { padding-bottom: 410px; } .with_box .xs_ttl { width: 100%; } .with_box .with_cont { width: 100%; padding-left: 0; overflow: hidden; } .with_box .with_cont ul { width: 50%; float: right; justify-content: flex-end; margin-top: 80px; } .ir_list ul li h2 { width: 76.5%; } .ir_list ul li p { width: calc(18% - 29px); } .graph_bar > div p, .graph_box .bg li p { font-size: 0.7rem; } .graph_bar > div .bar_box { bottom: 29px; width: 33.3%; height: calc(100% - 35px); } :lang(en) .graph_bar > div .bar_box, :lang(ja) .graph_bar > div .bar_box, :lang(zh) .graph_bar > div .bar_box { bottom: 28px; } } .privacy_header h1 { padding: 212px 0 80px; line-height: 1.15; } .privacy_header p { color: #383838; text-align: left; font-weight: 300; } .privacy_box { color: #383838; } .privacy_box .first_num { margin: 60px 0 110px; } .privacy_box .first_num li { font-size: 1rem; font-weight: 700; line-height: 1.1; margin-bottom: 16px; } .privacy_cont { margin-bottom: 110px; } .privacy_cont:last-child a:after { content: ""; background: url(/images/privacy_more.svg) 0 0 / contain no-repeat; width: 15px; height: 15px; margin-left: 10px; } .privacy_cont:last-child a span::after { content: ""; background-color: #111; width: 100%; height: 1px; position: absolute; bottom: 5px; left: 0; } .privacy_cont .f17 { margin-bottom: 30px; font-weight: 300; line-height: 1.76; letter-spacing: -0.03em; color: #383838; } .privacy_cont .f16, .privacy_cont .txt_box p, .privacy_cont .txt_box span, .table1 table td p { font-weight: 300; line-height: 1.87; } .dot_list li, .pop .pop_content, .pop .pop_head h2, .privacy_cont .f16, .privacy_cont .txt_box p, .stock_box table th, .stock_list table td, .table1 table td p { letter-spacing: -0.02em; } .dot_list li { position: relative; padding-left: 10px; text-align: left; font-size: 0.94rem; font-weight: 300; line-height: 1.76; color: #383838; list-style: none; } .dot_list li::before { content: ""; width: 3px; height: 3px; background-color: #383838; border-radius: 50%; top: 13px; left: 0; position: absolute; } .num_list .table1, .privacy_cont li .txt_box { margin-left: -20px; } .table1 table th { width: 22%; padding: 50px; background: #eee; font-size: 1.3rem; font-weight: 700; line-height: 1.08; word-break: keep-all; } .table1 table td { width: 78%; padding: 50px; } .table1 table td p { margin-bottom: 20px; } .table2 table th { padding: 15px 0 13px; text-align: center; background: #eee; font-size: 0.83rem; font-weight: 700; line-height: 1.13; } .table2 table th:first-child { width: 16%; } .table2 table th:nth-child(2) { width: 21%; } .table2 table th:nth-child(3) { width: 44%; } .table2 table th:nth-child(4) { width: 19%; } .table2 table td { padding: 22px 20px 20px; font-size: 0.89rem; line-height: 1.75; text-align: center; } .privacy_cont .txt_box .f18 { font-weight: 700; letter-spacing: -0.02em; } .privacy_cont .txt_box p { font-size: 0.89rem; color: #383838; } .privacy_cont .txt_box span { display: block; margin-top: 10px; font-size: 0.89rem; } .error_box { height: 100vh; display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; } .error_box .inner { margin-top: -100px; width: 100%; } .error_box h1 { text-align: center; } .error_box p { margin: 16px 0 68px; text-align: center; } .error_box .btn_box { justify-content: center; margin-right: -10px; } .error_box a { width: 190px; height: 52px; margin-right: 10px; display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; font-weight: 700; font-size: 0.89rem; line-height: 1.25; } .error_box a.btn_w { border: 1px solid #999; } .error_box a.btn_b { border: 1px solid #111; background: #111; color: #fff; } .stock_box h2.ko { font-family: rixsingose-pro, sans-serif; } .stock_box h2 span { padding-left: 10px; } .stock_box ul { display: flex; flex-wrap: wrap; border-top: 1px solid #111; } .stock_view table th { width: 25%; } .stock_box table th { padding: 15px 0 13px; background: #eee; font-weight: 700; font-size: 0.83rem; text-align: center; } .stock_box table td { padding: 20px 0 18px; text-align: center; } .stock_view ul li { display: flex; flex-wrap: nowrap; align-items: center; width: 50%; padding: 60px 70px 66px; } .stock_view ul li div { font-weight: 700; width: 35%; } .stock_view ul li div p { display: flex; flex-wrap: nowrap; white-space: nowrap; font-size: 0.83rem; font-weight: 500; } :lang(en) .stock_view ul li div p span, :lang(ja) .stock_view ul li div p span, :lang(zh) .stock_view ul li div p span { width: 50px; text-align: left; margin-left: 0; } .stock_view ul li div p span { position: relative; display: flex; flex-wrap: nowrap; align-items: center; margin: -4px 0 0 45px; font-weight: 700; font-size: 1.1rem; } .stock_view ul li div p:nth-child(2) span { margin-left: 42px; } .stock_view ul li div p span::before { content: ""; width: 12px; height: 10px; margin-right: 4px; position: absolute; left: -15px; } .stock_list table tr.up td:nth-child(4) span::before, .stock_major ul .up div p span::before, .stock_view ul li div p span.up::before { background: url(/images/stock_up.svg); } .stock_list table tr.down td:nth-child(4) span::before, .stock_major ul .down div p span::before, .stock_view ul li div p span.down::before { background: url(/images/stock_down.svg); } .stock_list table tr.down td:nth-child(3), .stock_list table tr.down td:nth-child(4), .stock_major ul .down div, .stock_view ul li div p span.down, .stock_view ul li h3.down { color: #2f5dff; } .stock_view ul li div p:last-child { margin-top: 20px; } .stock_view ul li h3 { font-size: 3.88rem; width: 65%; padding-left: 0; text-align: right; } .stock_view ul li:last-child p { text-align: center; font-size: 0.83rem; font-weight: 500; } .stock_view ul li:last-child p span { display: block; margin-top: 20px; font-weight: 700; font-size: 1.1rem; } .stock_view p.f16 { margin-top: 12px; color: #666; font-weight: 400; text-align: right; } .stock_view p.f16 span { padding-right: 4px; } .stock_list { margin-top: 70px; } .stock_list table td { font-weight: 400; } .stock_list table td:last-child, .stock_list table td:nth-last-child(2) { text-align: right; padding-right: 10px; } .stock_list table tr td span { position: relative; padding-left: 16px; } .stock_list table tr td span::before, .stock_major ul li div p span::before { content: ""; width: 12px; height: 10px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .stock_major { margin-top: 100px; } .stock_major ul li { width: 33.3%; padding: 31px 39px; } .stock_major ul li p { display: flex; flex-wrap: nowrap; align-items: center; margin-right: 12px; font-weight: 700; font-family: rixsingose-pro; } .stock_major ul li p span { position: relative; padding-right: 2px; top: -2px; font-size: 1rem; font-family: HelveticaWorld, sans-serif; } .stock_major ul li div p span { position: relative; display: block; padding: 0 2px 0 16px; font-weight: 600; font-family: HelveticaWorld, sans-serif; } .stock_major ul li div { display: flex; flex-wrap: nowrap; align-items: flex-end; justify-content: flex-end; font-family: HelveticaWorld, sans-serif; } .stock_major ul li div h3 { margin-bottom: -4px; } @media (max-width: 1280px) { .container { width: 100%; padding-left: 20px; padding-right: 20px; } .artists_member .ly_cont, .ly_cont { width: 60%; } .search_box { padding: 0 20px; } .fix_btn { right: 20px; bottom: 20px; } .fix_btn .to_top { width: 60px; height: 60px; } .fix_btn.lock { top: 58vh; } .sns_fix.lock { bottom: -56vh; top: auto; position: absolute; } .sns_fix { top: auto; right: 28px; bottom: 96px; } .sns_fix ul { display: none; } .sns_fix .sns_more, .sns_fix ul.on { display: block; } .artists_member .ly_cont li .img { position: relative; width: 100%; height: auto; } .artists_member .ly_cont li .img::after { display: block; content: ""; padding-bottom: 100%; } .artists_member .ly_cont li .img img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; } .artists_debut .container .img { height: auto; } .artists_history .ly_tit, .artists_member .ly_tit { max-width: 440px; } .artists_history .ly_cont, .artists_member .ly_cont { width: calc(100% - 440px); } .artists_member .ly_flex { justify-content: flex-start; margin-right: -24px; } .artists_list .ly_cont { right: 20px; } .txt_slide { left: 20px; } .txt_slide li.swiper-slide-active p { width: 100vw; } .stock_view ul li h3 { padding-left: 30px; } } @media (max-width: 1180px) { .btn_more.invert:hover { color: #ef4023; } .btn_more.invert::after { background: url(/images/btn_more.svg) no-repeat; filter: invert(1); } .btn_more.invert:hover::after { background: url(/images/btn_more_color.svg) no-repeat; filter: invert(0); } .visual-grid ul { margin-right: -12px; } .visual-grid .artist-list li { width: calc(50% - 12px); margin: 0 12px 12px 0; } .visual-grid { margin-bottom: 116px; } .visual-bg-slider, .visual_section, .visual_slide_box { height: calc(100vw * (880 / 1180)); } .visual_section .swiper-slide .txt_box { left: 70px; bottom: 80px; } .visual_section .swiper-slide .txt_box span { font-size: 1.4rem; } .visual_section .swiper-slide .txt_box h2 { font-size: 4.1rem; } .visual_section .btn_wrap { left: 70px; bottom: 50px; } .visual_section .btn_box { left: 213px; } .visual_section .ttl { margin-bottom: 40px; } .drag_section .bg, .drag_section .tab, .drag_slide_m, .slide_box { position: relative; } .vibe_section .bg_slide { width: 60%; } .drag_section { height: auto; } .drag_section > .container { z-index: 1; background: #fff; } .drag_section .tab > .container { z-index: 2; height: auto; } .drag_section::after { left: 20px; top: auto; bottom: 21px; } .drag_section .tab .pc, .offfice_visual .bg .pc { display: none; } .drag_section .tab .mo { display: block; width: calc(100% - 20px); overflow: hidden; margin-left: 20px; } .drag_slide_m { height: 66vh; top: 0; z-index: 0; } .drag_slide_m > div { height: 100%; padding-bottom: 21px; } .drag_slide_m .swiper-slide { position: relative; overflow: hidden; } .drag_slide_m a { font-size: 2.7rem; white-space: nowrap; line-height: 1; position: absolute; bottom: 15px; left: 50%; transform: translateX(-50%); z-index: 10; font-weight: 700; text-transform: uppercase; font-family: HelveticaWorld, sans-serif; -webkit-text-stroke: 1px #fff; color: transparent; } .drag_slide_m .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 3px; } .drag_slide_m .swiper-pagination-bullet { width: 6px; height: 6px; background: #111; } .drag_slide_m .swiper-pagination-bullet-active { background: #111; } .drag_slide_m .swiper-pagination-custom, .drag_slide_m .swiper-pagination-fraction, .drag_slide_m.swiper-container-horizontal > .swiper-pagination-bullets { bottom: 20px; } .drag_section .drag_slide_m .swiper-pagination { bottom: 0; } .drag_slide_m .swiper-slide a { opacity: 0; } .drag_slide_m .swiper-slide.swiper-slide-active a { animation: 1s 0.2s alternate both fadeInUp2; } @keyframes fadeInUp2 { from { opacity: 0; transform: translate3d(-50%, 50px, 0); } to { opacity: 1; transform: translate3d(-50%, 0, 0); } } @-webkit-keyframes fadeInUp2 { from { opacity: 0; transform: translate3d(-50%, 50px, 0); } to { opacity: 1; transform: translate3d(-50%, 0, 0); } } @-ms-keyframes fadeInUp2 { from { opacity: 0; transform: translate3d(-50%, 50px, 0); } to { opacity: 1; transform: translate3d(-50%, 0, 0); } } .top_btn { width: 100%; padding: 60px 0 16px; } .top_btn ul li { margin-right: 12px; } .top_btn ul li > a:first-child { font-size: 1.42rem; } .top_btn ul li a { color: #111; } .top_btn ul li a:last-child { top: 60px; right: 0; } .artists_list_cont li { width: calc(33.3% - 20px); } .slide_poster .slide_contents { padding-right: 200px; } .slide_box.slide_poster .container { padding-right: 0; } .slide_box .ly_flex { margin-bottom: 25px; } .slide_box .scroll { margin: 0 -20px; padding: 0 20px; overflow-x: scroll; } .slide_box .scroll li { width: 265px !important; display: block; white-space: initial; margin-right: 40px; } .slide_cont .scroll .swiper > li:last-child { width: 285px !important; padding-right: 20px; } .slide_box .scroll li:last-child { width: 305px !important; padding-right: 40px; } .intro_location .ly_flex li h3 { font-size: 2rem; } .intro_cont ul li:nth-child(2n-1) .txt { padding-left: 55px; } .intro_cont ul li:nth-child(2n) .txt { padding-right: 50px; } .offfice_visual .bg .tab { display: block; } .offfice_cont .box1::before { background-size: cover !important; background: url(/images/offfice_bg1_tab.jpg) center center no-repeat; } .offfice_cont .box2::before { background-size: cover !important; background: url(/images/offfice_bg2_tab.jpg) center center no-repeat; } .offfice_cont .box3::before { background-size: cover !important; background: url(/images/offfice_bg3_tab.jpg) center center no-repeat; } .page_section.recording span { font-size: 20px; } .page_section.recording .col-2 { padding-top: 28px; margin-bottom: 72px; gap: 25px; } .page_section.recording .col-2 > div { width: calc(50% - 25px); margin-bottom: 0; } .page_section.recording .col-3 { gap: 25px; } .page_section.recording .col-3 > li { padding-top: 28px; width: calc(100% / 3 - 25px); } .page_section.recording .col-3 > li > div { margin-bottom: 72px; } .history_list > li { gap: calc(100vw * (34 / 1180)); } .history_list > li > div { width: calc(100vw * (400 / 1180)); } .form_wrap .email_form .input:first-child { width: calc(75% - 46px); } .form_wrap .email_form .input:last-child { width: calc(25% - 46px); } .guide_list li { width: calc(50% - 20px); height: 300px; } .ir_disclosure.ir_list ul li h2 { width: 63.5%; } .ir_disclosure.ir_list ul li .ent { width: 20%; } .stock_major ul li { width: 100%; border-right: 0; padding: 30px 0; border-bottom: 1px solid #d9d9d9; } .stock_box ul li:last-child { border-bottom: 0; } .stock_major ul li div h3 { width: 100%s; line-height: 1; padding-bottom: 10px; text-align: right; } .stock_major ul li div p { width: 100%; justify-content: flex-end; margin-right: 0; } .stock_major ul li div { display: flex; flex-wrap: wrap; flex-direction: column-reverse; align-items: flex-end; margin-top: -24px; } } .pop_wrap { display: none; position: fixed; top: 0; left: 0; z-index: 1000; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); } .pop { display: none; position: relative; top: 50%; transform: translateY(-50%); width: 650px; margin: 0 auto; padding: 66px 77px; background: #fff; max-height: 100%; } .pop .close { position: absolute; top: 20px; right: 20px; width: 30px; height: 30px; background: url(/images/ic_x.svg) no-repeat; cursor: pointer; } .pop .pop_head { margin: 0 0 34px; text-align: center; } .pop .pop_head h2 { font-size: 1.78rem; font-weight: 700; } .pop .pop_content { text-align: center; word-break: break-all; font-size: 0.94rem; line-height: 1.88; font-weight: 500; } .pop .pop_container { margin: 30px 0 0; } .pop .pop_btn { display: flex; flex-wrap: wrap; justify-content: center; margin: 30px -10px 0 0; } .pop .pop_btn .btn { display: flex; align-items: center; justify-content: center; width: 200px; height: 54px; line-height: 54px; margin: 0 10px 0 0; font-size: 0.89rem; font-weight: 500; cursor: pointer; } .pop .pop_btn .btn_dark { background: #000; color: #fff; } .pop .pop_btn .btn_light { background: #ddd; } .s_tit_pop { margin: 30px 0 12px; color: #151515; line-height: 1.2; } .pop_concert .pop { max-width: 580px; width: 100%; background: 0 0; padding: 0; overflow-y: scroll; } .pop_concert .pop::-webkit-scrollbar { width: 10px; background: 0 0; } .pop_concert .pop .close { filter: invert(1); left: 100%; transform: translateX(-100%); position: relative; top: 0; margin-bottom: 10px; } @media (min-width: 768px) { header.down { height: 72px; } .down .header2 .nav .nav-icon { padding-top: 0; } .visual-grid .artist-list > li:not(:last-child):hover .hover { opacity: 1; transition: opacity 0.5s; } .visual-grid .artist-list ul li:hover .hover-box::after, .visual-grid .artist-list ul li:hover .hover-box::before, .visual-grid .artist-list > li:not(:last-child):hover .hover-box::after, .visual-grid .artist-list > li:not(:last-child):hover .hover-box::before { width: 20px; } .visual-grid .artist-list ul li:hover::after, .visual-grid .artist-list ul li:hover::before, .visual-grid .artist-list > li:not(:last-child):hover::after, .visual-grid .artist-list > li:not(:last-child):hover::before { height: 20px; } .visual-grid .artist-list ul li:hover a::before { opacity: 0.3; } .visual-grid .artist-list ul li.none:hover a::before { opacity: 0; } .visual-grid .artist-list ul li:hover .hover { opacity: 1; } .form .col { width: calc(50% - 22px); } .sustainability .ttl_box { padding-top: 40px; } :lang(ja) .stock_view ul li h3, :lang(zh) .stock_view ul li h3 { padding-left: 80px; } .s_tit_pop { font-size: 0.937rem; } } @media (max-width: 1023px) { .artists_history .ly_tit, .artists_member .ly_tit { max-width: 300px; } .actors .ly_cont, .artists_history .ly_cont, .artists_member .ly_cont { width: calc(100% - 300px); } .artists_member .ly_flex { justify-content: flex-start; margin-right: -24px; } .brand_cont ul li:first-child, .txt_slide { width: 60%; } .img_slide { width: 50%; left: auto; right: 0; } .img_slide .swiper-slide { width: 100%; height: 100%; } .brand_identity .ly_flex .txt, .discography_cont, .ly_disc .disc_box { width: 100%; padding-left: 0; } .discography_box .ly_flex > .img { width: 100%; height: auto; } .discography_box .ly_flex > .img img { object-fit: contain; } .discography_cont .head_box { margin: 25px 0; padding-bottom: 25px; } .composition_box .ly_flex table, .ly_disc h2 { width: 100%; } .ly_disc .disc_box { margin-top: 14px; } .actors h2.ly_tit { width: 300px; } .actors_txt .img, .social_contribution ul li .img, .social_contribution ul li .txt { width: 50%; } .actors_txt .txt { width: 50%; padding-left: 40px; } .actors .history_tit { flex-wrap: wrap; padding-left: 0; } .actors .history_tit h2 { margin-bottom: 28px; white-space: nowrap; } .brand_vision .ly_flex .img:nth-child(2) { display: none; } .brand_vision .ly_flex .img:first-child { width: 100%; padding-right: 27px; } .brand_identity .ly_flex .img { width: 100%; margin-bottom: 75px; text-align: center; } .brand_txt { width: 100%; margin: 45px 0 70px; } .brand_txt h2 { margin-bottom: 25px; } .brand_scroll .bg { width: 100%; top: 0; } .brand_creative .txt2, .brand_scroll .txt2 { float: right; left: auto; } .brand_scroll .container { top: 50px; width: 100%; height: calc(100% - 50px); } .brand_cont ul li:nth-child(2) { width: 35%; } .brand_cont div.ly_flex { padding-left: 60px; } .brand_identity .ly_flex .txt a { margin: 0 auto; } .form_wrap .input { width: calc(100% - 46px); } .form_wrap .basic { padding-left: 105px; } .form .radio label { flex-wrap: nowrap; } .esg_box { height: auto; margin-top: 30px; padding-bottom: 100px; } .esg_target_cont > li { width: 33.3%; padding: 0 30px; margin: 0; } .with_box { padding-top: 30px; } .with_box .img_box li:first-child { width: 400px; } .with_box .img_box { bottom: 28px; } .with_major_achievements ul li:last-child { margin-bottom: 0; padding-bottom: 0; } .social_contribution ul li:nth-child(2n-1) .txt { padding-left: 40px; } .social_contribution ul li:nth-child(2n) .txt { padding-right: 40px; } .with_box .xs_ttl span { display: inline; } .composition_box .ly_flex { flex-direction: column-reverse; } .legend { margin: 180px 0 0 48px; } .graph_bar { left: 68px; width: calc(100% - 68px); } .graph_bar > div .bar { width: 40px; } .stock_view ul li { width: 100%; justify-content: center; } .stock_view ul li:first-child { border-bottom: 1px solid #d9d9d9; border-right: 0; } .stock_major ul li:nth-child(2) { border-right: 0; } .stock_major ul li:last-child { border-bottom: 0; } .pop { overflow-y: scroll; } } :lang(ja), :lang(ja) .privacy_cont .txt_box p.ja, :lang(zh), :lang(zh) .privacy_cont .txt_box p.zh { font-family: "Noto Sans", sans-serif !important; } @media (min-width: 1201px) { header.over::after { height: 392px; } .language > li > a::after, header.over .logo img { filter: invert(1); } .down .header1 .gnb > li, .down .language, header.over .gnb > li li:hover a, header.over .gnb > li:hover, header.over .language { color: #fff; } .down .language > li > a::after, header.over .language > li > a::after { filter: invert(0); } header.over .header1 .gnb > li .sub_menu { display: block; width: 100%; white-space: nowrap; min-height: 300px; } header.down.over .gnb > li, header.over .gnb > li, header.over .gnb > li li a { color: rgba(255, 255, 255, 0.6); } :lang(en) header.over .header1 .gnb > li:last-child .sub_menu, :lang(ja) header.over .header1 .gnb > li:last-child .sub_menu, :lang(zh) header.over .header1 .gnb > li:last-child .sub_menu { min-width: 205px; } } .ir .sub_header em { display: block; margin: -16px 0 80px; color: #999; text-align: center; font-family: HelveticaWorld, sans-serif !important; font-size: 15px; font-style: normal; font-weight: 400; line-height: normal; } @media (max-width: 767px) { html { font-size: 87.5%; } body.fix, html.fix { overflow: hidden; } header { height: 75px; } header .logo { width: 150px; } .actors .ly_cont, .artists_history .ly_cont, .brand_cont ul li:first-child, .brand_cont ul li:nth-child(2), .brand_spirit .brand_txt, .brand_spirit ul li, .brand_statement .ly_flex li, .discography_back .discography_list li .img, .discography_back .discography_list > li > a .img, .graph_bar > div .bar, .header2 .nav .nav-icon div, .header2 .nav .nav-icon:after, .header2 .nav .nav-icon:before, .intro_cont ul li .txt, .intro_location .ly_flex li, .ly_cont, .ly_tit, .offfice_cont .box .txt p, .schedule_box .schedule_list li .ic img, .search_box, .social_contribution ul li .img, .table2 table, .with_box .xs_ttl, header .logo img { width: 100%; } .main header .container, .sub_wrap.on header .container { border-bottom: 0; } header .container { justify-content: flex-start; } .sub_wrap header .container { border-bottom: 1px solid #eaeaea; } .header2 .navbar > li > a { font-size: 1.14rem; display: inline-block; } .header2 .navbar .nav_language, .news .search_box, .sustainability .ttl_box { margin-bottom: 40px; } .ir_list.ir_disclosure ul li, .language:hover > li ul { height: auto; } body div .header2 { top: 0; height: 52px; } .header2 .nav { right: 20px; top: 50%; } .header2 .nav .nav-icon { padding-top: 7px; width: 19px; height: 16px; } .header2 .nav .nav-icon:before { margin-top: -6px; } .header2 .nav .nav-icon:after { margin-top: 4px; } .language > li > a::after { filter: invert(1); } .down .language > li > a::after { filter: invert(0); } .down .language { color: #fff; margin-top: 0; } .header2 .navbar { width: 100vw; padding: 16px 20px; z-index: 0; } .header2 .navbar > li:nth-child(2) { overflow-x: scroll; height: calc(100% - 106px); } .header2 .navbar.active { width: 100vh; top: -10px; left: 0; right: auto; background: #111; } .header2 .navbar > li:last-child { width: 100%; position: absolute; padding: 0 0 70px; bottom: 0; background: #111; } .header2 .navbar .gnb > ul > li > a { min-width: 192px; padding-bottom: 18px; } .header2 .navbar .sub_menu { padding-bottom: 14px; } .header2 .navbar .sub_menu li a { padding-bottom: 5px; display: block; } .discography_box .disc.hidden, .esg_committee .committee_box, .pagination .nav-links { margin-top: 30px; } .pagination .page-numbers { width: 35px; height: 35px; line-height: 32px; } .history_header .bg .mo, .mo, .sub_wrap section.mo:last-of-type .sns_fix, .visual-grid ul { display: block; } .sub_wrap section:last-of-type { padding-bottom: 100px; } .sub_wrap header .container .logo::after { background: url(/images/logo_black_m.svg) 0 0 / contain no-repeat; width: 100%; height: 100%; } .cursor, .pc, .visual-grid .artist-list .none, .visual_section .btn_box div::before { display: none; } .intro_cont ul li:nth-child(2n) .txt, .ly_tit, .visual_section .container { padding-right: 0; } .discography_box .disc_list li, .discography_content .ly_flex input, .error_box a, .search_box .search .inner input { height: 42px; } .big_ttl::before, .sub_header h1::before { top: -1px; } .btn_more { font-size: 11px; } .f104 { font-size: 5.78rem; } .big_ttl, .f96 { font-size: 3.43rem; line-height: 0.93; } .f68 { font-size: 3.78rem; } .f66 { font-size: 3.67rem; } .f64 { font-size: 2.5rem; } .f60 { font-size: 3.3rem; } .f58 { font-size: 3.2rem; } .f54, .s_ttl { font-size: 3rem; } .f52 { font-size: 2.89rem; line-height: 1.34; } .f48 { font-size: 2.67rem; } .f44 { font-size: 2.4rem; } .f40 { font-size: 2.2rem; line-height: 1.2; } .f38, .xs_ttl { font-size: 2.1rem; line-height: 1.25; } .f34 { font-size: 1.89rem; line-height: 1.47; } .f30 { font-size: 1.67rem; } .f28 { font-size: 1.56rem; } .f24 { font-size: 1.4rem; } .f22 { font-size: 1rem; line-height: 1.7; letter-spacing: -0.03em; } .f20 { font-size: 0.85rem; } .f18 { font-size: 1rem; line-height: 1.3; } .f17 { font-size: 0.94rem; line-height: 1.88; } .f16 { font-size: 0.89rem; } .f15 { font-size: 0.83rem; } .f14 { font-size: 0.78rem; } .btn_more_plus { margin-top: 30px; font-size: 1.07rem; } .btn_more_plus::after { width: 8.5px; height: 9px; background-size: contain; } .visual-grid { margin-bottom: 52px; } .actors_filmography .scroll, .artists_debut .img, .compliance_utilize .scroll, .esg_certification .scroll, .privacy_cont .scroll, .visual-grid .scroll, .yg_instagram .scroll { margin: 0 -20px; } .visual-grid li { display: inline-block; } .visual-grid ul ul { width: 100%; display: inline-flex; flex-wrap: nowrap; } .visual-grid .artist-list .hover { width: 100%; height: 100%; opacity: 1; left: 0; bottom: 0; } .visual-grid .artist-list .hover a { align-items: flex-end; justify-content: flex-start; padding: 15px 20px; } .visual-grid .artist-list > li:not(:last-child) { width: 300px; } .visual-grid .artist-list > li:last-child { width: 624px; } .btn-grid-more { font-size: 12.5px; padding-right: 35px; } .btn-grid-more::after { width: 28px; height: 28px; background-size: contain; } .brand_box .bg, .offfice_scroll .scroll ul li img, .visual_section, .visual_slide_box { height: 100%; } .graph_list .f22, .ir .finance_header h1, .visual_section .ttl { margin-bottom: 20px; } .visual-bg-slider { height: calc(100vw * (608 / 750)); } .visual-bg-slider .slide-inner { position: relative; } .visual_section .swiper-slide .txt_box h2 { font-size: 2.14rem; } .visual_section .swiper-slide .txt_box span { font-size: 0.92rem; } .visual_section .swiper-slide .txt_box { bottom: 50px; top: auto; left: 20px; } .visual_section .btn_wrap { left: 20px; bottom: 28px; } .btn_box .swiper-button-next, .btn_box .swiper-button-prev { width: 20px; } .btn_wrap .swiper-pagination-progressbar { max-width: 100px; } .visual_section .btn_box div::after { width: 50px; height: 30px; } .btn_wrap .btn_box .swiper-button-next { left: 0; } .visual_section .btn_box { left: 150px; } .drag_section .tab .mo { margin-left: 0; width: 100%; } .drag_slide_m { left: 20px; width: calc(100% - 20px); overflow: hidden; height: 300px; } .news_section { padding: 70px 0 99px; } .news_section .news_box { margin-top: 50px; display: flex; flex-wrap: nowrap; overflow-x: scroll; margin-right: -20px; margin-left: -20px; padding: 0 20px; -ms-overflow-style: none; scrollbar-width: none; } .news_section .news_box::-webkit-scrollbar { display: none; } .news_section .news_box li { width: 100%; min-width: 254px; margin-right: 28px; } .artists_member .ly_flex, .esg_committee ul, .esg_target_cont, .graph_list, .graph_list > li, .guide_list, .news_section .news_box li:last-child, .notice_list ul { margin-right: 0; } .news_section .news_box span { width: 100%; height: auto; margin-bottom: 12px; font-size: 1rem; } .news_section .news_box h3 { font-size: 1.4rem; line-height: 1.4; height: 55px; } .compliance_utilize, .vibe_section { padding-bottom: 70px; } .vibe_section .ttl_box h2 { font-size: 4.1rem; line-height: 0.93; } .vibe_section .ttl_box p { margin: 19px 0 45px; font-size: 1.28rem; } .vibe_section .bg_slide::before { width: calc(100% + 3px); height: calc(100% + 3px); } .vibe_section .ttl_box a::after { top: 1px; } .bottom_section .ly_flex, .brand_box, .brand_creative { height: 100vh; } .bottom_section .ly_flex > li { width: 100%; height: 50%; } .bottom_section .ly_flex > li:last-child { border-left: 0; border-top: 1px solid rgba(255, 255, 255, 0.3); } .bottom_section .ly_flex h3 { margin-bottom: 30px; font-size: 2.2rem; } .bottom_section .ly_flex ul li { width: 50%; height: 100%; } .bottom_section .ly_flex ul li:last-child { border-left: 1px solid rgba(255, 255, 255, 0.3); } footer { padding: 55px 20px 50px; } footer .sns_box li { width: 30px; margin-right: 6px; } footer .logo { width: 78px; } footer .ly_flex:last-child { margin-top: 65px; } footer .f_gnb span { font-size: 10px; margin-bottom: 4px; } footer .f_gnb ul { font-size: 1.5rem; } footer .f_gnb ul li { margin-bottom: 4px; } .discography_content h3, footer .info_box { text-align: left; } footer .info_box ul { justify-content: flex-start; margin: 40px 0 20px; } footer .info_box ul li { margin: 0 20px 0 0; font-size: 12px; } footer .info_box p { font-size: 10px; margin-bottom: 9px; } .finance_box .unit, footer .info_box p:last-child { margin: 0; } .fix_btn.lock { top: 260px; } .artists_list .ly_cont, .compliance_policy .container::after, .history_header .bg .pc, .intro_scroll .bg .tab, .ir_disclosure.ir_list ul li .num, .mo .sns_fix .sns_more, .sns_fix, .tab_tit h2:first-child { display: none; } .artists_member .container::after, .mo .sns_fix { width: calc(100% - 40px); bottom: 0; left: 20px; right: 20px; } .artists .history_tit.scroll { overflow-x: inherit; overflow-y: hidden; padding-left: 0; } .sns_fix { right: 30.5px; } .mo .sns_fix { display: block; margin-top: 50px; position: relative; } .mo .sns_fix ul { display: flex; flex-wrap: wrap; align-items: center; margin-right: -12px; } .mo .sns_fix ul li { width: calc(16.66% - 12px); margin-right: 12px; } .ir .sub_header, .news .sub_header, .sub_header { padding-top: 45px; } .scroll { overflow-x: scroll; padding-left: 20px; white-space: nowrap; } .sub_header ul { margin: 15px -22px 37px 0; font-size: 1.07rem; justify-content: center; display: inline-flex; flex-wrap: nowrap; } .history_tit h2, .sub_header ul li { margin-right: 22px; } .sub_header ul li { font-size: inherit; } .sub_header ul li.on::after { bottom: -7px; } .sub_header .big_ttl { padding: 15px 0; } .actors .sub_header .big_ttl, .artists .sub_header .big_ttl { font-size: 2.85rem; } .sub_wrap section.artists_debut:last-of-type { padding-bottom: 0; } .artists_debut .debut_txt { justify-content: flex-start; margin-top: 14px; } .artists_debut .debut_txt p:first-child { margin-right: 7px; } .artists_debut .debut_txt p { margin: 0 6px 0 0; } .artists_debut .debut_txt p.title { margin: 0 7px 0 8px; } .artists_member { margin: 50px 0 0; } .actors .actors_history, .artists_member .member_name { margin-top: 10px; } .artists_member .member_name p { flex-wrap: nowrap; align-items: center; font-size: 1.1rem; } .artists_member .member_name p span { font-size: 0.86rem; font-weight: 400; margin: 0; } .artists_member .ly_tit { width: 100%; padding: 0 0 25px; } .artists_member .ly_cont { width: 100%; margin-right: 0; justify-content: space-between; } .artists_member .ly_cont li { width: calc(50% - 7px); margin: 0 0 25px; } .artists_member .container { position: relative; padding-bottom: 25px; border-bottom: 0; } .artists_member .container::after { content: ""; height: 1px; background-color: #eaeaea; position: absolute; } .artists_history { padding-top: 50px; } .artists_history .ly_tit { padding-bottom: 25px; width: 100%; } .history_tit { margin-bottom: 30px; } .history_tit h2.on::after { height: 2px; } .artists_history .history > li h3, .schedule_box .schedule_list li .date span:first-child { font-size: 1.07rem; } .artists_history .history .month { padding-right: 9px; font-size: 1.07rem; } .artists_history .history > li > ul { padding-left: 0; width: calc(100% - 55px); } .artists_history .history .dot_list li { margin-bottom: 10px; font-size: 1rem; } .artists_history .history .dot_list li:last-child, .finance_box .mo .table:last-child, .page_section.recording .col-3 > li > div, .sustainability .esg_box .xs_ttl { margin-bottom: 0; } .artists_list .ly_flex:first-of-type { margin: 45px 0 30px; } .tab_tit h2 { margin-left: 10px; width: 20px; height: 20px; background-repeat: no-repeat; background-size: contain; } .tab_tit h2.on::after { bottom: -6px; } .artists_list { height: auto; margin-bottom: -40px; } .artists_list .ly_flex { align-items: center; margin: 97px 0 30px; } .artists_list .ly_tit, .pop_wrap.discography_pop .pop .pop_btn .btn { width: 50%; } .artists_list_cont li { width: calc(50% - 20px); margin: 0 20px 40px 0; } .artists_list_cont li p { margin-top: 10px; line-height: 1.2; } .artists_list .ly_flex > h2, .history_list > li .txt_box .txt { font-size: 1.1rem; } .actors .history_tit, .artists_video .video_container, .discography_slide.album_box li .txt, .form .privacy .ck-input { margin-top: 0; } .discography_slide.album_box li .txt h2 { font-size: 1.7rem; line-height: 1.2; margin-top: 15px; } .discography_slide.album_box li .txt h2.ko { font-size: 1.3rem; font-family: rixsingose-pro; position: relative; top: 2px; } .discography_slide.album_box li .txt h2.en { font-size: 1.35rem; } .discography_slide.album_box li .txt p { margin: 10px 0 2px; line-height: 1.2; } .sub_wrap section:last-of-type.discography_wrap { padding-bottom: 100px; } .discography_wrap { margin-bottom: -40px; } .discography_back .discography_list { padding: 0; } .discography_back .discography_list li .txt { margin-top: 20px; padding-left: 0; width: 100%; } .album_box, .discography_box, .ly_disc, .stock_major { margin-top: 70px; } .album_box .album_slide .swiper-slide.swiper-slide-active h3 { font-size: 30px; } .discography_box .ly_flex > .img { width: calc(100% + 40px); height: auto; margin: 0 -20px; } .discography_cont .head_box .f22 { margin: 6px 0 4px; } .discography_box .disc_box p { margin: 16px 0 8px; } .album_box { padding-top: 50px; height: 100%; } .album_box .album_slide { left: 0; width: 250px; margin: 100px auto 0; } .album_box .album_slide .swiper-slide { width: 160px !important; height: 360px !important; } .album_box .album_slide .swiper-slide.swiper-slide-active { width: 250px !important; height: 250px !important; } .pop_wrap.discography_pop { width: 100%; margin: 0; padding: 8vw 4vw; } .pop_wrap.discography_pop .pop { width: 100%; margin: 0; } .discography_faq h3 { margin-bottom: 12px; } .discography_faq ul { margin-bottom: 11px; } .concert_btn { margin: 20px 0 45px -10px; } .concert_btn a { margin-left: 10px; } .concert_btn a::before { margin-right: 3px; } .compliance_policy .ttl_box p, .slide_poster li p { margin-top: 15px; } .slide_poster h2 { padding-bottom: 25px; } .slide_cont { position: relative; padding-bottom: 50px; } .slide_cont::before { content: ""; background: #eaeaea; height: 1px; width: calc(100% - 40px); position: absolute; bottom: 0; left: 20px; } .schedule_box .schedule_ic { margin: 30px 0 11px; } .schedule_box .schedule_ic li { font-size: 12px; margin-left: 15px; } .schedule_box .schedule_list { margin-top: 11px; } .schedule_box .schedule_list li { flex-wrap: wrap; height: auto; padding: 15px; } .schedule_box .schedule_list li .date { padding: 0; display: flex; flex-wrap: nowrap; align-items: center; width: 50px; } .schedule_box .schedule_list li .time { top: 0; width: calc(100% - 50px); padding-left: 6px; font-size: 1.07rem; line-height: 1.88; } .schedule_box .schedule_list li .date span:nth-child(2) { font-size: 12px; top: 1px; } .schedule_box .schedule_list li div { margin-top: 6px; align-items: flex-start; width: 100%; padding-left: 0; } .schedule_box .schedule_list li div .ic { width: 20px; margin-right: 7px; } .schedule_box .schedule_list li div h3 { top: -1px; font-size: 1.2rem; line-height: 1.4; } .actors h2.ly_tit { width: 100%; padding-right: 0; margin-bottom: 20px; } .actors .search_box { margin: 0 auto 40px; } .actors_txt .img { width: calc(100% + 40px); margin: 0 -20px 30px; } .actors_txt .txt, .composition_box .ly_flex .img, .ir_disclosure.ir_list ul li h2, .offfice_scroll p, .with_box .with_cont { width: 100%; padding-left: 0; } .actors_filmography .container { padding: 50px 20px; } .actors_filmography .history_tit { display: inline-flex; margin-top: 0; flex-wrap: nowrap; } .actors_filmography .history_tit.scroll, .table1 table td, .table1 table th { padding: 20px; } .history_tit.scroll { overflow-x: scroll; overflow-y: hidden; display: flex !important; margin-bottom: 0 !important; padding-left: 0; padding-bottom: 30px; } .actors_discography .container, .actors_filmography .container { border-bottom: 0; margin-bottom: 50px; position: relative; } .actors .history_tit h2, .artists .history_tit h2 { font-size: 1.07rem; margin-right: 22px; margin-bottom: 0; } .actors .actors_history li h3, .graph_box .bg li p { width: 55px; } .actors .actors_history li .txt, .graph_box .bg li .line { width: calc(100% - 55px); } .actors_discography .container:after, .actors_filmography .container::after { content: ""; width: calc(100% - 40px); margin: 0 20px; height: 1px; background: #eaeaea; position: absolute; left: 0; bottom: 0; } .actors_discography .container { padding-bottom: 50px; } .notice_list ul li { width: 100%; margin: 0 0 10px; } .notice_list ul li a { padding: 20px 20px 38px; height: 225px; } .notice_list ul li .date { bottom: 20px; left: 20px; } .news .view_header h1, .news h1 { margin: 20px 0 45px; font-size: 3.43rem; } .news .view_header h1 { margin-top: 14px; } .report.notice_list ul li a { height: 160px; } .about_header { margin-top: 45px; } .about_header h1 { margin: 20px 0 60px; } .intro_scroll .bg { width: 90%; top: 0; } .intro_scroll h2.f64 { font-size: 2.2rem; font-weight: 700; line-height: 1.3; } .intro_scroll h2.f96 { font-size: 3.07rem; font-weight: 700; line-height: 0.95; } .brand_cont, .brand_spirit, .brand_statement, .compliance_policy, .esg_certification, .esg_committee, .esg_guide, .esg_organization, .esg_target, .intro_cont, .social_contribution, .with_major_achievements { padding: 70px 0; } .intro_cont .img_box { width: 100%; margin-bottom: 30px; } .finance_box .mo .table, .intro_cont ul li:nth-child(2n-1) { margin-bottom: 60px; } .intro_cont ul li:nth-child(2n-1) .txt, .social_contribution ul li:nth-child(2n-1) .txt, :lang(en) .stock_view ul li h3, :lang(ja) .stock_view ul li h3, :lang(zh) .stock_view ul li h3 { padding-left: 0; } .intro_cont ul li:nth-child(2n) { padding-left: 0; margin-bottom: 60px; } .intro_location .ly_flex li:first-child { padding: 60px 20px; } :lang(ja) .intro_cont ul li .txt h3 { font-size: 2rem; } .brand_scroll .txt1 h2 { line-height: 1.05; font-size: 3.07rem; } .brand_scroll .txt2 { max-width: 200px; position: absolute; float: none; left: auto; right: 20px; bottom: 20%; } .brand_cont .brand_txt { margin-top: 0; margin-bottom: 55px; } .brand_txt { margin: 45px 0 70px; } .brand_txt h2 { margin: 5px 0 25px; } .brand_txt p { line-height: 1.7; } .brand_cont .txt h3 { padding: 0 0 9px; } .brand_cont ul li { padding-left: 30px; margin: 0 -20px 0 0; } .brand_cont ul li:nth-child(2n) { display: flex; flex-wrap: wrap; flex-direction: column-reverse; } .brand_cont ul li .txt, .brand_cont ul li:last-child .txt, .brand_identity .ly_flex .txt p, .ir h1 { margin: 20px 0 45px; } .brand_cont div.ly_flex { padding: 0 0 0 30px; margin-right: -20px; } .brand_cont div.ly_flex .txt { padding: 20px 0 0; width: 100%; } .brand_cont ul li:first-child .img, .brand_cont ul li:nth-child(2) .img { margin-right: -20px; } .brand_creative .container { position: relative; width: 100%; height: calc(100% - 50px); top: 50px; } .brand_creative .txt1 { padding-left: 20px; } .brand_creative .txt2 { bottom: 20%; right: 40px; position: absolute; } .brand_creative .bg { position: absolute; top: 0; left: 0; right: 0; z-index: -1; } .brand_box .txt { top: 129px; transform: translate(-50%, 0); } .brand_box .txt h2 { font-size: 3.07rem; line-height: 0.95; margin-bottom: 14px; } .brand_box .txt p { font-size: 1.14rem; } .brand_identity { padding-top: 90px; } .brand_identity .ly_flex .img { width: 210px; margin: 0 auto 75px; } .brand_identity .ly_flex .txt a { height: 39px; width: 160px; margin: 0 auto; font-weight: 700; font-size: 1.07rem; line-height: 1.2; } .brand_identity .ly_flex .txt span { margin-top: 5px; } .offfice_cont .box1::before { background-size: cover !important; background: url(/images/offfice_bg1_m.jpg) center center/cover no-repeat; } .offfice_cont .box2::before { background-size: cover !important; background: url(/images/offfice_bg2_m.jpg) center center/cover no-repeat; } .offfice_cont .box2 .txt, .offfice_cont .box3 .txt { padding: 0 60px; } .offfice_cont .box3::before { background-size: cover !important; background: url(/images/offfice_bg3_m.jpg) center center no-repeat; } .offfice_visual .tit { max-width: 100%; padding: 0 20px; } .offfice_visual p { margin: 8px 0; font-size: 2.4rem; letter-spacing: 0.1em; } .offfice_cont .box .txt { width: 100%; padding: 0 20px; } .offfice_cont .box .txt p.f52 { font-size: 2.1rem; word-break: keep-all; } :lang(en) .offfice_cont .box p span, :lang(ja) .offfice_cont .box p span, :lang(zh) .offfice_cont .box p span { font-size: 1.8rem; } .offfice_scroll, .sub_wrap section.compliance_policy:last-of-type { padding-bottom: 100px; } .offfice_scroll .page_section { padding-top: 70px; } .offfice_scroll h2 { width: 100%; margin-bottom: 25px; } .offfice_scroll .img_box { padding-top: 55px; margin-right: 0; display: inline-flex; flex-wrap: nowrap; } .offfice_scroll .scroll { margin: 55px -20px 0; } .offfice_scroll .scroll ul { display: inline-flex; flex-wrap: nowrap; height: 183px; width: auto; } .offfice_scroll .scroll ul li { height: 100%; width: max-content; margin-right: 15px; } .page_section.recording .col-2 > div, .page_section.recording .col-3 > li > div { max-width: 287px; height: 100%; width: max-content; } .offfice_scroll .page_section.recording .img_box { padding-top: 0; display: inline-flex; height: 211px; } .offfice_scroll .page_section.recording .img_box > li:last-child { display: inline-flex; margin-right: -15px; } .page_section.recording .scroll { overflow-y: hidden; } .page_section.recording span { font-size: 16px; } .page_section.recording .col-2 { padding-top: 28px; display: inline-flex; flex-wrap: nowrap; gap: 15px; margin-bottom: 0; } .page_section.recording .col-3 { gap: 15px; flex-wrap: nowrap; margin-right: 15px; height: 100%; } .page_section.recording .col-3 > li { padding-top: 28px; width: max-content; height: 100%; } .about .history { padding: 80px 0 100px; } .about .history::after { top: 0; } .history_header h1 { font-size: 2.1rem; line-height: 1; margin-bottom: 10px; } :lang(ko) .history_header h1 { line-height: 1.3; } .history_header p { font-size: 1.28rem; } .history_list > li { padding-bottom: 50px; gap: calc(100vw * (20 / 767)); } .history_list > li > div { width: calc(100vw * (280 / 767)); } .history_list > li .txt_box { margin-bottom: 0; padding: 20px 8px; } .history_wrap:before { bottom: 138px; } .contact_header { margin: 45px 0 65px; } .composition_box h2, .contact_header p, .sustainability .xs_ttl { margin-bottom: 25px; } .contact_box .form_wrap { width: 100%; padding-left: 0; margin: 60px 0 0 auto; } .contact_box .btn_wrap { padding-top: 25px; } .alert_txt { font-size: 12px; margin-top: 12px; } .file label, .form_wrap .label { font-size: 0.86rem; } .file button, .file label { margin-left: 6px; } .form_wrap .basic { padding-left: 70px; height: 50px; line-height: 50px; } .form_wrap .email_form .input:first-child, .form_wrap .form .email_form .input:last-child { width: calc(100% - 46px); } .form_wrap .email_form .email1 { width: calc(60% - 7px); } .form_wrap .email_form .email2 { width: calc(40% + 7px); } .form_wrap .email_form .mark { left: calc(60% - 7px); line-height: 55px; } .form_wrap .ck-box { min-height: 24px; } .form_wrap .privacy { padding: 20px 15px; } .form_wrap .msg textarea { height: 200px; padding: 15px; } .file .upload_name { height: 40px; line-height: 38px; padding: 0 15px; } .form .file { padding-bottom: 6.4vw; } .file label { background-position: center right 15px; } .file button, .form .file label { bottom: 22px; } .form .col, .form > li { margin-bottom: 6.4vw; } .form .input_type { height: 40px; padding: 0; margin-top: 0; font-size: 1rem; } .form .radio { margin-right: -5px; } .form .radio label, :lang(zh) .form .radio label { margin: 0 5px 5px 0; width: calc(50% - 5px); } .form .radio input { width: 0; height: 100%; } .form .radio span:before { width: 100%; height: 100%; } .form .radio span { padding: 0 13px; width: 100%; min-width: 51px; height: 35px; } :lang(en) .form .radio span { white-space: break-spaces; } :lang(zh) .form .radio { justify-content: space-between; margin-right: -5px; } .form li .label { top: 15px; } .form textarea.input_type { height: 100px; } .btn_submit { height: 48px; max-width: 100%; font-size: 0.92rem; } .ck label { padding-left: 25px; } .ck input, .ck input + span:before { width: 18px; height: 19px; } .ck span { font-size: 1rem; line-height: 19px; } .form .privacy { word-break: keep-all; } .form .privacy .ck-input span { padding-left: 30px; } .form .privacy .ck-input span::before { padding-right: 0; width: 24px; height: 24px; position: absolute; top: 50%; transform: translateY(-50%); } .form .privacy .ck-input label a { font-size: 12px; padding: 4px 4px 3px; } .esg_target.renewal h3.tit { margin-top: 50px; line-height: 45px; font-size: 45px; } .esg_target.renewal .txt_list li { width: 50%; height: 60px; line-height: 60px; font-size: 17px; } .esg_target.renewal .esg_target_cont > li::after { top: auto; margin: 0; height: 1px; } .esg_target.renewal .txt_list { margin: 30px 0 50px; padding-bottom: 85px; } .esg_target.renewal .esg_target_cont li h3 { margin: 20px 0 9px; } .esg_certification ul li h3, .esg_report .guide_list li a, .esg_target.renewal .desc { margin-top: 20px; } .esg_target.renewal .tit .ic img { width: calc(136px / 2); } .esg_box, .esg_target_cont > li:last-child { margin-bottom: 0; padding-bottom: 0; } .esg_target_cont > li ul li:not(:first-child)::before { top: 7px; } .esg_box { display: flex; flex-direction: column-reverse; } .esg_box .txt_box { max-width: 100%; width: 100%; padding: 30px 0 70px; } .esg_box .right_img { position: relative; width: 100%; } .esg_box p { margin-top: 25px; } .esg_target .round_box { padding-bottom: 70px; margin: 0 0 35px; font-size: 1.3rem; } .esg_target .round_box li { width: 160px; height: 160px; } .esg_target .round_box li.round1 { right: 10px; } .esg_target .round_box li.round2 { left: 10px; } .esg_committee .btn_down { justify-content: center; } @keyframes round-right { to { right: -10px; } } @-webkit-keyframes round-right { to { right: -10px; } } @-ms-keyframes round-right { to { right: -10px; } } @keyframes round-left { to { left: -10px; } } @-webkit-keyframes round-left { to { left: -10px; } } @-ms-keyframes round-left { to { left: -10px; } } .esg_target_cont > li, .with_major_achievements ul li { width: 100%; margin: 0 0 50px; padding: 0 0 50px; } .esg_target_cont > li::after { width: 100%; height: 1px; top: auto; bottom: 0; transform: translateY(0); } .esg_target_cont > li .tit h3, .with_major_achievements ul li h3 { margin: 10px 0 8px; } .esg_target_cont > li p.f17 { margin: 35px 0; } .esg_target_cont > li ul li:first-child { margin-bottom: 8px; } .esg_committee ul li { padding: 20px; margin: 0 0 20px; width: 100%; } .esg_committee .committee_box span { padding: 8px 12px 6px; margin-bottom: 10px; } .esg_certification ul { margin-right: 0; display: inline-flex; flex-wrap: nowrap; } .esg_certification ul li { width: 200px; margin-right: 20px; white-space: initial; } .esg_certification ul li p { margin-top: 12px; } .guide_list li { padding: 20px; width: 100%; height: auto; margin: 0 0 20px; } .guide_list li a { position: relative; bottom: 0; right: 0; float: right; margin-top: 40px; } .with_major_achievements ul { margin-right: 0; padding-top: 45px; } .with_major_achievements ul li::after { width: 100%; height: 1px; top: auto; right: 0; bottom: 0; } .with_box { padding: 35px 0 70px; } .with_box .img_box { margin: 0 0 100px -20px; position: relative; left: 0; bottom: 0; } .with_box .with_cont ul { margin-top: 40px; } .with_box .with_cont ul li:first-child { width: 45px; } .with_box .with_cont ul li:nth-child(2) { margin-left: 12px; } .with_box .with_cont ul li:nth-child(2) img { width: 120px; } .with_box .with_cont ul li:last-child::before { width: 2px; height: 100%; margin-right: 9px; } .with_box .img_box li:first-child { width: 70%; } .with_box .img_box li:last-child { width: 40%; left: auto; top: 100px; right: 0; position: absolute; } .with_major_achievements span.f20 { margin-top: 8px; } .social_contribution h2, .yg_instagram h2 { margin-bottom: 45px; } .directors_box, .social_contribution ul li { margin-bottom: 50px; } .social_contribution ul li .txt { width: 100%; padding: 20px 0 0; } .social_contribution ul li .txt h3, .total { margin-bottom: 10px; } .yg_instagram ul { display: inline-flex; flex-wrap: nowrap; margin: 0; } .yg_instagram ul li { width: 175px; margin-bottom: 0; } .compliance_utilize ul { display: inline-flex; flex-wrap: nowrap; margin-right: 0; } .compliance_utilize ul li { padding: 20px; width: 250px; margin: 0 20px 0 0; white-space: initial; } .compliance_utilize ul li h3 { margin: 15px 0 8px; } .directors_box h2, .pop .pop_head { margin-bottom: 15px; } .directors_box table tr td { padding: 20px 10px; } .directors_box table tr td:first-child { width: 18%; } .directors_box table tr td:last-child { width: 54%; padding: 16px 0 16px 16px; line-height: 1.3; } .directors_box table tr p { margin-bottom: 5px; } .ct-chart svg { height: 300px !important; } .ct-label { font-size: 0.94rem; } .composition_box, .privacy_cont { margin-bottom: 70px; } .composition_box table td { height: 50px; } .composition_box table td:first-child { line-height: 1.3; padding: 10px; } .legend { display: flex; flex-wrap: wrap; margin: 30px 0 30px 40px; } .legend li { display: inline-flex; width: 50%; font-size: 12px; padding-left: 19px; } .legend li span { position: absolute; left: 0; width: 14px; height: 14px; } .ir_list ul li { height: 76px; padding: 10px 0; } .ir_list ul li h2 { padding-left: 10px; width: 64.5%; } .ir_list ul li .ic { width: 25px; } .ir_list ul li p { padding-left: 10px; width: calc(30% - 25px); } .ir_disclosure.ir_list ul li > a { flex-wrap: wrap; } .ir_disclosure.ir_list ul li .ent { width: calc(100% - 65px); text-align: left; padding: 0 5px 0 0; word-break: break-word; } .ir_disclosure.ir_list ul li p { width: 65px; } .graph_list > li { width: 100%; margin-bottom: 40px; } .graph_box { padding-bottom: 19px; } .graph_bar { left: 80px; width: calc(100% - 80px + 18px); } .finance_box .mo .ly_flex { justify-content: space-between; align-items: center; margin-bottom: 20px; } .finance_box .mo p.f22 { font-weight: 700; } .finance_box tbody td { width: 50%; height: 45px; } .graph_bar > div .bar_box { bottom: 26px; height: calc(100% - 32px); } .privacy_header h1 { padding: 107px 0 40px; } .privacy_box .first_num { margin: 30px 0 60px; } .privacy_cont h2 { margin-bottom: 25px; line-height: 1.4; } .dot_list li { padding-left: 8px; } .dot_list li::before { top: 10px; } .table2 { width: 635px; padding-right: 20px; } .table2 table td { text-overflow: ellipsis; white-space: initial; } .error_box { height: calc(100vh - 52px); } .error_box .inner { margin-top: -52px; padding: 0 20px; } .error_box p { margin: 8px 0 40px; } .stock_major ul li p span { position: relative; top: -1px; } .stock_view ul li h3 { padding-left: 30px; white-space: nowrap; } .stock_view ul li { padding: 30px 0; } .stock_view ul li:last-child p { width: 25%; margin-right: 0; } .stock_box table th { padding: 15px 5px 13px; white-space: nowrap; } .stock_box table td { padding: 20px 5px 18px; white-space: nowrap; } .stock_list .table { overflow-x: scroll; margin: 0 -20px; padding: 0 20px; -ms-overflow-style: none; scrollbar-width: none; } .stock_list .table::-webkit-scrollbar { display: none; } .stock_list .table table { width: 100%; min-width: 520px; } .stock_major ul li div { margin-top: -18px; } :lang(en) .stock_view ul li div p:first-child span, :lang(ja) .stock_view ul li div p:first-child span, :lang(zh) .stock_view ul li div p:first-child span { margin-left: 22px; } .pop, .pop_concert .pop { width: calc(100% - 30px); } .pop { margin: 0 15px; padding: 8vw 4vw; } .pop .pop_btn .btn { width: calc(50% - 10px); height: 44px; line-height: 44px; } .pop .close { width: 15px; height: 15px; background-size: contain; } .ir .sub_header em { margin: -20px 0 45px; } }