@charset "UTF-8"; #header { position: fixed; top: 0; left: 0; width: 100%; z-index: 1000; display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center; padding-left: 2.8125rem; padding-right: 2.8125rem; color: #fff; -moz-transition: background .3s, color .3s, transform .3s; -webkit-transition: background .3s, color .3s, transform .3s; -ms-transition: background .3s, color .3s, transform .3s; -o-transition: background .3s, color .3s, transform .3s; transition: background .3s, color .3s, transform .3s; } #header.__join { color: #222; background-color: #fff; box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.1); } #header.__join .logo .day_cal { color: #666; } #header.__join .sign_menu a { color: #222222; } #header.__join:not(:hover) #gnb .search_area { background-color: #fafafa; } #header.__join .g_nav .depth_1 > li > a { color: #222222; } #header.__join .g_nav .depth_1 > li.on > a { color: #ef7a00; } #header.__sub .g_nav .depth_2 > ul { min-height: 26.5625rem; } #header.__scroll { background-color: #fff; box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.1); color: #222; } #header.__scroll #gnb { min-height: 7.5rem; padding-top: 0; } #header.__scroll .sign_menu { display: none; } #header .logo { display: block; margin-right: -4px; font-size: 0.8125rem; min-width: 15rem; vertical-align: middle; } #header .logo a { display: inline-block; } #header .logo img { height: 1.6875rem; vertical-align: top; } #header .logo .day_info { margin-bottom: 0.625rem; letter-spacing: -0.39px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #header .logo .day_cal { letter-spacing: -0.91px; font-family: 'Open Sans','OpenSans','Roboto',sans-serif; margin-top: 0.375rem; font-size: 1.15385em; text-align: center; } #header .logo .info { display: block; font-weight: 500; } #header .logo .info mark { display: inline-block; margin-right: 0.3125rem; font-size: 0.875rem; line-height: 1; font-style: normal; font-weight: 500; background-color: #ef7a00; color: #ffffff; border-radius: 1.875rem; vertical-align: middle; padding-left: 0.625rem; padding-right: 0.625rem; padding-top: 0.3125rem; padding-bottom: 0.3125rem; } #header #gnb { display: block; width: 100%; vertical-align: middle; padding-top: 0.8125rem; -moz-transition: padding .3s; -webkit-transition: padding .3s; -ms-transition: padding .3s; -o-transition: padding .3s; transition: padding .3s; } #header #gnb .gnb_top { position: absolute; top: 0; right: 2.8125rem; font-size: 1rem; } #header #gnb .gnb_top .home { color: #ffffff; } #header #gnb .gnb_bottom { height: 100%; text-align: center; } #header .sign_menu { padding-top: 0.875rem; } #header .sign_menu a { color: #fff; } #header .sign_menu .gretting span { display: inline-block; font-size: 1em; line-height: 1; margin-right: 0.71429em; } #header .sign_menu .home { display: inline-block; } #header .sign_menu .home [class*=iconFt_], #header .sign_menu .home [class^=iconFt_] { font-size: 1rem; display: inline-block; padding: .4em; border-radius: 50%; background-color: #ef7a00; vertical-align: top; } #header .sign_menu li { vertical-align: middle; font-weight: 400; font-size: 1rem; display: inline-block; position: relative; letter-spacing: -.025rem; margin-right: 0.625rem; } #header .sign_menu li:not(.nrb) { padding-right: 0.6875rem; } #header .sign_menu li:not(.nrb)::after { content: ''; display: block; position: absolute; top: 50%; right: 0; border-right: 1px solid #d2d2d2; height: 0.625rem; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } #header .sign_menu li:first-child { margin-right: 0.375rem; padding-right: 0.375rem; } #header .sign_menu li:first-child::after { display: none; } #header .sign_menu li:last-child { margin-right: 0; padding-right: 0; } #header .sign_menu li:last-child::after { display: none; } #header #gnb .search_area { background-color: #fff; border-radius: 1.14286em; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 0.875em; color: #999999; padding: 0.57143em 0.85714em; letter-spacing: -.35px; line-height: 1; white-space: nowrap; } #header #gnb .search_area#moSearchBtn { display: none; } #header #gnb .search_area::after { content: ''; display: block; vertical-align: top; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14.001' height='14' viewBox='0 0 14 14'%3E%3Cpath fill='%23EF7A00' d='M13.7,12.3l-2.8-2.8C11.6,8.5,12,7.3,12,6c0-3.3-2.7-6-6-6S0,2.7,0,6s2.7,6,6,6c1.3,0,2.5-0.4,3.5-1.1l2.8,2.8 L13.7,12.3z M6,10c-2.2,0-4-1.8-4-4c0-2.2,1.8-4,4-4c2.2,0,4,1.8,4,4C10,8.2,8.2,10,6,10z'/%3E%3C/svg%3E%0A"); width: 1em; height: 1em; margin-left: 0.42857em; margin-top: -1px; background-size: 100% auto; background-position: center; background-repeat: no-repeat; } #header .g_nav { display: inline-block; padding-right: 3.125rem; width: 100%; } #header .g_nav .subs { font-size: 0.8em; } #header .g_nav .depth_2 .depth_box.on ._unfold .cross::before, #header .g_nav .depth_2 .depth_box.on ._unfold .cross::after { transform: none; background-color: #ef7a00; } #header .g_nav ._unfold { position: relative; } #header .g_nav ._unfold .cross { display: block; position: absolute; top: 50%; right: 0; height: 1px; width: 1px; } #header .g_nav ._unfold .cross::before, #header .g_nav ._unfold .cross::after { content: ''; display: block; width: 0.625rem; height: 0.125rem; background-color: #222222; position: absolute; top: 0; right: 0.9375rem; } #header .g_nav ._unfold .cross::before { transform-origin: center; -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } #header .g_nav .depth_1 { display: -ms-flexbox; display: -webkit-flex; display: flex; /*Center horizontaly */ justify-content: center; } #header .g_nav .depth_1::after { content: ''; display: block; clear: both; } #header .g_nav .depth_1 > li { display: -ms-flexbox; display: -webkit-flex; display: flex; /* Center vertically */ align-items: center; /*Center horizontaly */ justify-content: center; /*Center horizontaly ie */ -ms-flex-pack: center; text-align: center; min-height: 8.75rem; line-height: 1.5; font-size: 1.25rem; padding-left: 1.25rem; padding-right: 1.25rem; letter-spacing: -.0125em; } #header .g_nav .depth_1 > li > a { font-weight: 600; color: #fff; } #header .g_nav .depth_1 > li.on > a { font-weight: 600; color: #ef7a00; } #header .g_nav .depth_1 > li.on .depth_2 { z-index: 10; -moz-transform: scaleY(1); -webkit-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); transform: scaleY(1); border-bottom: 1px solid #dddddd; } #header .g_nav .depth_2 { z-index: -1; -moz-transition: all .3s; -webkit-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; -moz-transform: scaleY(0); -webkit-transform: scaleY(0); -ms-transform: scaleY(0); -o-transform: scaleY(0); transform: scaleY(0); transform-origin: top; position: absolute; background-color: #fff; top: 100%; left: 0; height: auto; width: 100%; border-top: 1px solid #dddddd; text-align: center; } #header .g_nav .depth_2.n3 > ul { max-width: 1080px; } #header .g_nav .depth_2.n3 > ul::after, #header .g_nav .depth_2.n3 > ul::before { width: 33.333%; left: 33.33333%; border-left: 1px solid #ddd; border-right: 1px solid #ddd; } #header .g_nav .depth_2.n3 > ul::after { width: 66.6666%; border-left: 0; border-right: 0; } #header .g_nav .depth_2.n3 > ul > li { width: 33.3333%; } #header .g_nav .depth_2.n2 > ul { max-width: 1080px; } #header .g_nav .depth_2.n2 > ul::after, #header .g_nav .depth_2.n2 > ul::before { left: 0; width: 50%; border-left: 0; border-right: 1px solid #ddd; } #header .g_nav .depth_2.n2 > ul::after { display: none; width: 66.6666%; border-left: 0; } #header .g_nav .depth_2.n2 > ul > li { width: 50%; } #header .g_nav .depth_2 > ul { display: -webkit-box; display: -ms-flexbox; display: flex; align-content: flex-start; align-items: normal; flex-flow: wrap; text-align: left; min-height: 22.5rem; border-left: 1px solid #dddddd; border-right: 1px solid #dddddd; position: relative; padding-bottom: 1.25rem; } #header .g_nav .depth_2 > ul:before, #header .g_nav .depth_2 > ul:after { content: ''; display: block; clear: both; position: absolute; left: 25%; top: 0; width: 100%; height: 100%; z-index: 1; width: 50%; border-left: 1px solid #ddd; border-right: 1px solid #ddd; } #header .g_nav .depth_2 > ul::after { left: 50%; border-right: 0; } #header .g_nav .depth_2 > ul > li { width: 25%; padding-left: 1.875rem; padding-right: 1.875rem; padding-top: 2.0625rem; position: relative; z-index: 10; min-height: 6rem; } #header .g_nav .depth_2 > ul > li:nth-child(4n) { border-right: 0; } #header .g_nav .depth_2 > ul > li .depth_box:hover > a, #header .g_nav .depth_2 > ul > li .depth_box.on > a, #header .g_nav .depth_2 > ul > li._unfold .depth_box:hover > a { color: #ef7a00; } #header .g_nav .depth_2 > ul > li .depth_box:hover > a::after, #header .g_nav .depth_2 > ul > li .depth_box.on > a::after, #header .g_nav .depth_2 > ul > li._unfold .depth_box:hover > a::after { transform: none; } #header .g_nav .depth_2 > ul > li .depth_box:hover .cross::before, #header .g_nav .depth_2 > ul > li .depth_box:hover .cross::after, #header .g_nav .depth_2 > ul > li .depth_box.on .cross::before, #header .g_nav .depth_2 > ul > li .depth_box.on .cross::after, #header .g_nav .depth_2 > ul > li._unfold .depth_box:hover .cross::before, #header .g_nav .depth_2 > ul > li._unfold .depth_box:hover .cross::after { background-color: #ef7a00; } #header .g_nav .depth_2 > ul > li .depth_box + .depth_box { padding-top: 1.25rem; } #header .g_nav .depth_2 .icon_cover { display: none; position: absolute; top: 50%; right: 0.9375rem; color: #ef7a00; -moz-transform: translateY(-50%) rotate(90deg); -webkit-transform: translateY(-50%) rotate(90deg); -ms-transform: translateY(-50%) rotate(90deg); -o-transform: translateY(-50%) rotate(90deg); transform: translateY(-50%) rotate(90deg); transform-origin: center; } #header .g_nav .depth_box { display: block; min-height: 3.5em; font-weight: 600; color: #222; letter-spacing: -.05em; } #header .g_nav .depth_box > .in_text { position: absolute; top: 50%; left: 0.625rem; padding-right: 2.8125rem; width: 100%; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } #header .g_nav .depth_box::after { content: ''; display: block; position: absolute; bottom: -1px; left: 0; width: 100%; border-bottom: 1px solid #ff8200; -moz-transform: scale(0); -webkit-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); -moz-transition: all .3s; -webkit-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; transform-origin: left; } #header .g_nav .depth_box > a { display: block; font-size: 1.125rem; border-bottom: 1px solid #dddddd; position: relative; padding-left: 0.625rem; min-height: 4.6875rem; } #header .g_nav .depth_box > a .in_text { position: absolute; left: 0.625rem; top: 50%; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); display: block; width: 100%; padding-right: 3.125rem; } #header .g_nav .depth_box > a:hover .icon_cover { display: block; } #header .g_nav .depth_3 { display: none; padding-top: 1.25rem; padding-bottom: 1.25rem; } #header .g_nav .depth_3 > li { font-size: 1rem; font-weight: 300; margin-bottom: 0.25rem; font-size: 1rem; padding-left: 0.625rem; font-weight: 600; } #header .g_nav .depth_3 > li:last-child { margin-bottom: 0; } #header .g_nav .depth_3 > li a { -moz-transition: color .1s; -webkit-transition: color .1s; -ms-transition: color .1s; -o-transition: color .1s; transition: color .1s; } #header .g_nav .depth_3 > li a:hover { color: #ef7a00; } #header .right_menu { position: absolute; top: 50%; right: 2.8125rem; margin-top: -0.8125rem; } #header .right_menu .all_menu_btn { position: relative; width: 2.1875rem; height: 1.625rem; } #header .right_menu .all_menu_btn .bugger { display: block; width: 100%; height: 2px; background-color: #fff; } #header .right_menu .all_menu_btn .bugger::after, #header .right_menu .all_menu_btn .bugger::before { content: ''; display: block; width: 100%; height: 2px; position: absolute; left: 0; background-color: #fff; } #header .right_menu .all_menu_btn .bugger::after { top: 0; } #header .right_menu .all_menu_btn .bugger::before { bottom: 0; } #header .right_menu #moSearchBtn .fc { fill: #ffffff !important; } #header:hover { color: #222222; background: #ffffff; box-shadow: 0 0 1.25rem rgba(0, 0, 0, 0.15); } #header:hover .logo .day_cal { color: #666666; } #header:hover #gnb .right_menu .all_menu_btn .bugger, #header:hover #gnb .right_menu .all_menu_btn .bugger::before, #header:hover #gnb .right_menu .all_menu_btn .bugger::after { background-color: #222222; } #header:hover #gnb .right_menu #moSearchBtn .fc { fill: #222 !important; } #header:hover #gnb .search_area { background-color: #f6f6f6; color: #999999; } #header:hover .sign_menu a { color: #222222; } #header:hover .g_nav .depth_1 > li > a { color: #222222; } #header:hover .g_nav .depth_1 > li.on > a { color: #ef7a00; } #header._fixed, #header._fixed:hover, .login_wrap #header { color: #222222; background: #ffffff; box-shadow: 0 0 1.25rem rgba(0, 0, 0, 0.15); } #header._fixed .logo .day_cal, #header._fixed:hover .logo .day_cal, .login_wrap #header .logo .day_cal { color: #666666; } #header._fixed .sign_menu a, #header._fixed:hover .sign_menu a, .login_wrap #header .sign_menu a { color: #222222; } #header._fixed #gnb .search_area, #header._fixed:hover #gnb .search_area, .login_wrap #header #gnb .search_area { background-color: #f6f6f6; color: #999999; } #header._fixed #gnb .right_menu .all_menu_btn .bugger, #header._fixed #gnb .right_menu .all_menu_btn .bugger::before, #header._fixed #gnb .right_menu .all_menu_btn .bugger::after, #header._fixed:hover #gnb .right_menu .all_menu_btn .bugger, #header._fixed:hover #gnb .right_menu .all_menu_btn .bugger::before, #header._fixed:hover #gnb .right_menu .all_menu_btn .bugger::after, .login_wrap #header #gnb .right_menu .all_menu_btn .bugger, .login_wrap #header #gnb .right_menu .all_menu_btn .bugger::before, .login_wrap #header #gnb .right_menu .all_menu_btn .bugger::after { background-color: #222; } #header._fixed .g_nav .depth_1 > li > a, #header._fixed:hover .g_nav .depth_1 > li > a, .login_wrap #header .g_nav .depth_1 > li > a { color: #222222; } #header._fixed .g_nav .depth_1 > li.on > a, #header._fixed:hover .g_nav .depth_1 > li.on > a, .login_wrap #header .g_nav .depth_1 > li.on > a { color: #ef7a00; } #header.__join #gnb .right_menu .all_menu_btn .bugger, #header.__join #gnb .right_menu .all_menu_btn .bugger::before, #header.__join #gnb .right_menu .all_menu_btn .bugger::after { background-color: #222; } #header.__scroll { -moz-transform: translate(0, -100%); -webkit-transform: translate(0, -100%); -ms-transform: translate(0, -100%); -o-transform: translate(0, -100%); transform: translate(0, -100%); } #header.__scroll .g_nav .depth_1 > li.on .depth_2 { -moz-transform: scaleY(0); -webkit-transform: scaleY(0); -ms-transform: scaleY(0); -o-transform: scaleY(0); transform: scaleY(0); } @media all and (max-width: 1650px) { #header .g_nav .depth_1 > li { font-size: 1.125rem; padding-left: 1.4375rem; padding-right: 1.4375rem; } #header .g_nav .depth_box > a { font-size: 1rem; } #header .g_nav .depth_3 > li { font-size: 0.9375rem; } } @media all and (max-width: 1501px) { #header .logo { font-size: 0.75rem; } #header .logo img { height: 1.6875rem; max-width: none; } #header .logo .info mark { font-size: 0.8125rem; } #header .g_nav .depth_1 > li { font-size: 1rem; } #header .g_nav .depth_box > a { font-size: 0.9375rem; } #header .g_nav .depth_3 > li { font-size: 0.875rem; } #header .sign_menu li { font-size: 0.9375rem; } #header .sign_menu .gretting span { font-size: 0.8125rem; } #header .sign_menu .home [class*=iconFt_], #header .sign_menu .home [class^=iconFt_] { font-size: 0.875rem; } #header .right_menu { margin-top: -0.75rem; } #header .right_menu .all_menu_btn { position: relative; width: 2.0625rem; height: 1.625rem; } #header .right_menu .all_menu_btn .bugger { display: block; width: 100%; height: 2px; background-color: #fff; } #header .right_menu .all_menu_btn .bugger::after { top: 0; } #header .right_menu .all_menu_btn .bugger::before { bottom: 0; } } @media all and (max-width: 1440px) { #header .g_nav .depth_1 > li { font-size: 1rem; padding-left: 0.9375rem; padding-right: 0.9375rem; } } @media all and (max-width: 1280px) { #header { height: 8.75636rem; padding-left: 2.50182rem; padding-right: 2.50182rem; } #header .logo { font-size: 1.06327rem; } #header .logo .info { transform: none; white-space: nowrap; } #header .logo .info mark { display: none; } #header .logo .day_info { white-space: nowrap; } #header .logo img { height: 2.31418rem; } #header #gnb .gnb_top, #header #gnb .gnb_bottom .g_nav { display: none; } #header #gnb .search_area { font-size: 1.50109rem; display: none; } #header #gnb .search_area#moSearchBtn { display: -webkit-box; display: -ms-flexbox; display: flex; } #header .right_menu { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-top: 0; transform: translateY(-50%); } #header .right_menu button + button { margin-left: 1.376rem; } #header .right_menu .all_menu_btn { width: 3.00218rem; height: 2.18909rem; } } @media all and (max-width: 800px) { #header .logo img { height: 2.18909rem; } #header .logo .info { display: none; } body.__sub #header .right_menu .all_menu_btn .bugger, body.__sub #header .right_menu .all_menu_btn .bugger::before, body.__sub #header .right_menu .all_menu_btn .bugger::after { background-color: #222; } } #allSearchWrap { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(2, 2, 2, 0.3); z-index: 5005; visibility: hidden; opacity: 0; transition: visible .3s, opacity .3s; } #allSearchWrap .search_wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; height: 25rem; background-color: #fff; transform: translateY(-105%); transition: transform .35s; } #allSearchWrap.on { visibility: visible; opacity: 1; } #allSearchWrap.on .search_wrap { transform: none; } #allSearchWrap.on .edit_close::before { -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } #allSearchWrap.on .edit_close::after { -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } #allSearchWrap .search_box { background-color: inherit; max-width: 800px; width: 100%; margin-left: auto; margin-right: auto; font-size: 1.375rem; } #allSearchWrap .search_box .fm_inp { position: relative; border-bottom: 2px solid #222; padding-top: 1.09091em; padding-bottom: 1.09091em; height: auto; } @media all and (max-width: 1280px) { #allSearchWrap .search_box .fm_inp { padding-top: 0.81818em; padding-bottom: 0.81818em; } } #allSearchWrap .search_box .inp { padding-left: 0; padding-right: 2.27273em; } #allSearchWrap .search_box .fm_inp, #allSearchWrap .search_box .inp { background-color: inherit; width: 100%; max-width: 100%; } #allSearchWrap .search_box .fm_inp:focus, #allSearchWrap .search_box .fm_inp:active, #allSearchWrap .search_box .inp:focus, #allSearchWrap .search_box .inp:active { background-color: inherit; } #allSearchWrap .search_box .search_btn { font-size: 1em; width: 1.13636em; height: 1.13636em; border: 0; position: absolute; top: 50%; right: 1.09091em; transform: translateY(-50%); z-index: 10; } #allSearchWrap .search_box .all_search_inp { position: relative; } #allSearchWrap .all_search_close { flex: none; position: absolute; top: 0; right: 0; width: 5.625rem; height: 5.625rem; color: #ffffff; background: #ef7a00; } #allSearchWrap .all_search_close > i { position: absolute; width: 100%; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; font-size: 1.625rem; } #allSearchWrap .edit_close::before, #allSearchWrap .edit_close::after { content: ''; display: block; position: absolute; top: 50%; left: 50%; width: 2.375rem; margin-left: -1.1875rem; border-top: 3px solid #fff; transition: all .5s; -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } @media all and (max-width: 1280px) { #allSearchWrap .edit_close::before, #allSearchWrap .edit_close::after { width: 3.125rem; margin-left: -1.5625rem; border-top-width: 2px; } } #skipNav a { position: absolute; display: block; font-size: 0px; top: -9999px; left: -9999px; } #skipNav a:focus { top: 0; left: 0; width: 100%; height: 40px; line-height: 40px; background: #333; color: #fff; font-size: 20px; z-index: 9999; text-align: center; } html { width: 100%; height: 100%; } body { width: 100%; height: 100%; transition: opacity .2s; opacity: 1; } body img { width: auto; max-width: 100%; } body._load { opacity: 0; } #container { word-break: keep-all; position: relative; letter-spacing: -0.05em; min-height: 90%; overflow-x: hidden; } #con { background: #ffffff; overflow: hidden; } #con._gray { background-color: #f8f8f8; } .underline { text-decoration: underline; } .title_1 { margin-top: 7.1875rem; margin-bottom: 4.0625rem; line-height: normal; color: #222; letter-spacing: 0.025em; } .title_1.st_2 { margin-bottom: 5.625rem; } .title_1.st_3 { margin-bottom: 2.5rem; } .title_1 > span { text-transform: initial; } .title_1 .subs { display: block; font-size: 0.75em; } .title_1 + .title_txt { margin-top: -0.625rem; } @media all and (max-width: 1280px) { .title_1 { text-align: center; } .title_1 + .title_txt { text-align: center; } } .title_4 { margin-bottom: 2.8125rem; } @media all and (max-width: 1280px) { .title_4:not([class*=t_]) { text-align: center; } } .title_3 { margin-bottom: 3.125rem; } .title_2 { margin-top: 4.6875rem; margin-bottom: 2.1875rem; font-size: 1.875rem; } @media all and (max-width: 800px) { .title_2 { text-align: center; font-size: 2.125rem; } } .tfr_up { text-transform: uppercase; } .file_btn { width: 1.875rem; height: 1.875rem; background-color: #eee; border-radius: 50%; position: relative; top: 0; } @media all and (max-width: 1280px) { .file_btn { width: 2.5rem; height: 2.5rem; font-size: 1.25rem; top: 0; } } .table_list_ul .none_data { position: relative; } .table_list_ul .none_data::after { content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; border-bottom: 1px solid #ddd; } .all_search_wrap .none_data { border-top: 2px solid #222; } .none_data { padding: 5rem 0 4.375rem; } .none_data.small { padding-top: 3.125rem; padding-bottom: 3.125rem; } .none_data.small_con p { margin-top: 1.09091em; } .none_data.middle { padding-top: 3.75rem; padding-bottom: 3.75rem; } .none_data .nd_img { font-size: 0; } .none_data .nd_img::after { content: "\e924"; font-family: 'iconFont' !important; font-size: 2.5rem; width: 7.5rem; height: 7.5rem; line-height: 7.5rem; border-radius: 50%; border: 1px solid #ddd; display: inline-block; background-color: #fff; } .none_data .nd_img2::after { width: 6.25rem; height: 6.25rem; line-height: 6.25rem; color: #222; } .none_data .nd.brd_none::after { border: 0; } .none_data .no_data_text { letter-spacing: -0.45px; } .none_data .nd_con p { margin-top: 2rem; font-size: 1.375rem; } .route { border-radius: 50%; margin-right: 0.6875rem; display: inline-block; } .route.route_0 { border-radius: 3.125rem; } .route_0 { background-color: #4ea9e3; padding: 0.25rem 0.875rem; } .route_0.dst_1 { display: inline-block; margin-left: -4.4375rem; } @media all and (max-width: 1280px) { .route_0.dst_1 { margin-left: 0; } } .route_2 { background-color: #18c32c; width: 2.125rem; height: 2.125rem; line-height: 2.125rem; text-align: center; } .route_5 { background-color: #881ac6; width: 2.125rem; height: 2.125rem; line-height: 2.125rem; text-align: center; } .route_7 { background-color: #789539; width: 2.125rem; height: 2.125rem; line-height: 2.125rem; text-align: center; } .route_9 { background-color: #c7a41e; width: 2.125rem; height: 2.125rem; line-height: 2.125rem; text-align: center; } .route_1_bus { background-color: #2765e2; } .route_2_bus { background-color: #ffcc00; } .route_3_bus { background-color: #66c80f; } .route_4_bus { background-color: #4ea9e3; } .route_5_bus { background-color: #e80e0e; } .route_bus { padding: 0.25rem 0.9375rem; border-radius: 3.125rem; line-height: 1; margin-right: 0.75rem; } @media all and (max-width: 1280px) { .route_bus { display: inline-block; padding: 0.4375rem 0.9375rem; margin-bottom: 0.3125rem; } } @media all and (max-width: 1280px) { .route { margin: 0 auto; } } .num_tit { display: block; margin-bottom: 2.5rem; } .num_tit_number { color: #ff8200; display: inline-block; border: 0.125rem solid #ff8200; border-radius: 50%; line-height: 1.5625rem; width: 1.875rem; height: 1.875rem; text-align: center; margin-right: 0.6875rem; font-weight: bold; } .num_tit_update { float: right; color: #999999; font-size: 1rem; letter-spacing: -0.8px; } .pl_5 { padding-left: 0.3125rem; } .pl_10 { padding-left: 0.625rem; } .pl_15 { padding-left: 0.9375rem; } .pl_20 { padding-left: 1.25rem; } .pl_25 { padding-left: 1.5625rem; } .pl_30 { padding-left: 1.875rem; } .pl_35 { padding-left: 2.1875rem; } .pl_40 { padding-left: 2.5rem; } .pl_45 { padding-left: 2.8125rem; } .pl_50 { padding-left: 3.125rem; } .pl_55 { padding-left: 3.4375rem; } .pl_60 { padding-left: 3.75rem; } .pl_65 { padding-left: 4.0625rem; } .pl_70 { padding-left: 4.375rem; } .pl_75 { padding-left: 4.6875rem; } .pl_80 { padding-left: 5rem; } .pl_85 { padding-left: 5.3125rem; } .pl_90 { padding-left: 5.625rem; } .pl_95 { padding-left: 5.9375rem; } .pr_5 { padding-right: 0.3125rem; } .pr_10 { padding-right: 0.625rem; } .pr_15 { padding-right: 0.9375rem; } .pr_20 { padding-right: 1.25rem; } .pr_25 { padding-right: 1.5625rem; } .pr_30 { padding-right: 1.875rem; } .pr_35 { padding-right: 2.1875rem; } .pr_40 { padding-right: 2.5rem; } .pr_45 { padding-right: 2.8125rem; } .pr_50 { padding-right: 3.125rem; } .pr_55 { padding-right: 3.4375rem; } .pr_60 { padding-right: 3.75rem; } .pr_65 { padding-right: 4.0625rem; } .pr_70 { padding-right: 4.375rem; } .pr_75 { padding-right: 4.6875rem; } .pr_80 { padding-right: 5rem; } .pr_85 { padding-right: 5.3125rem; } .pr_90 { padding-right: 5.625rem; } .pr_95 { padding-right: 5.9375rem; } .pt_5 { padding-top: 0.3125rem; } .pt_10 { padding-top: 0.625rem; } .pt_15 { padding-top: 0.9375rem; } .pt_20 { padding-top: 1.25rem; } .pt_25 { padding-top: 1.5625rem; } .pt_30 { padding-top: 1.875rem; } .pt_35 { padding-top: 2.1875rem; } .pt_40 { padding-top: 2.5rem; } .pt_45 { padding-top: 2.8125rem; } .pt_50 { padding-top: 3.125rem; } .pt_55 { padding-top: 3.4375rem; } .pt_60 { padding-top: 3.75rem; } .pt_65 { padding-top: 4.0625rem; } .pt_70 { padding-top: 4.375rem; } .pt_75 { padding-top: 4.6875rem; } .pt_80 { padding-top: 5rem; } .pt_85 { padding-top: 5.3125rem; } .pt_90 { padding-top: 5.625rem; } .pt_95 { padding-top: 5.9375rem; } .pb_5 { padding-bottom: 0.3125rem; } .pb_10 { padding-bottom: 0.625rem; } .pb_15 { padding-bottom: 0.9375rem; } .pb_20 { padding-bottom: 1.25rem; } .pb_25 { padding-bottom: 1.5625rem; } .pb_30 { padding-bottom: 1.875rem; } .pb_35 { padding-bottom: 2.1875rem; } .pb_40 { padding-bottom: 2.5rem; } .pb_45 { padding-bottom: 2.8125rem; } .pb_50 { padding-bottom: 3.125rem; } .pb_55 { padding-bottom: 3.4375rem; } .pb_60 { padding-bottom: 3.75rem; } .pb_65 { padding-bottom: 4.0625rem; } .pb_70 { padding-bottom: 4.375rem; } .pb_75 { padding-bottom: 4.6875rem; } .pb_80 { padding-bottom: 5rem; } .pb_85 { padding-bottom: 5.3125rem; } .pb_90 { padding-bottom: 5.625rem; } .pb_95 { padding-bottom: 5.9375rem; } .ml_5 { margin-left: 0.3125rem; } .ml_10 { margin-left: 0.625rem; } .ml_15 { margin-left: 0.9375rem; } .ml_20 { margin-left: 1.25rem; } .ml_25 { margin-left: 1.5625rem; } .ml_30 { margin-left: 1.875rem; } .ml_35 { margin-left: 2.1875rem; } .ml_40 { margin-left: 2.5rem; } .ml_45 { margin-left: 2.8125rem; } .ml_50 { margin-left: 3.125rem; } .ml_55 { margin-left: 3.4375rem; } .ml_60 { margin-left: 3.75rem; } .ml_65 { margin-left: 4.0625rem; } .ml_70 { margin-left: 4.375rem; } .ml_75 { margin-left: 4.6875rem; } .ml_80 { margin-left: 5rem; } .ml_85 { margin-left: 5.3125rem; } .ml_90 { margin-left: 5.625rem; } .ml_95 { margin-left: 5.9375rem; } .mr_5 { margin-right: 0.3125rem; } .mr_10 { margin-right: 0.625rem; } .mr_15 { margin-right: 0.9375rem; } .mr_20 { margin-right: 1.25rem; } .mr_25 { margin-right: 1.5625rem; } .mr_30 { margin-right: 1.875rem; } .mr_35 { margin-right: 2.1875rem; } .mr_40 { margin-right: 2.5rem; } .mr_45 { margin-right: 2.8125rem; } .mr_50 { margin-right: 3.125rem; } .mr_55 { margin-right: 3.4375rem; } .mr_60 { margin-right: 3.75rem; } .mr_65 { margin-right: 4.0625rem; } .mr_70 { margin-right: 4.375rem; } .mr_75 { margin-right: 4.6875rem; } .mr_80 { margin-right: 5rem; } .mr_85 { margin-right: 5.3125rem; } .mr_90 { margin-right: 5.625rem; } .mr_95 { margin-right: 5.9375rem; } .mt_5 { margin-top: 0.3125rem; } .mt_10 { margin-top: 0.625rem; } .mt_15 { margin-top: 0.9375rem; } .mt_20 { margin-top: 1.25rem; } .mt_25 { margin-top: 1.5625rem; } .mt_28 { margin-top: 1.75rem; } .mt_30 { margin-top: 1.875rem; } .mt_35 { margin-top: 2.1875rem; } .mt_40 { margin-top: 2.5rem; } .mt_45 { margin-top: 2.8125rem; } .mt_50 { margin-top: 3.125rem; } .mt_55 { margin-top: 3.4375rem; } .mt_60 { margin-top: 3.75rem; } .mt_65 { margin-top: 4.0625rem; } .mt_70 { margin-top: 4.375rem; } .mt_75 { margin-top: 4.6875rem; } .mt_80 { margin-top: 5rem; } .mt_85 { margin-top: 5.3125rem; } .mt_90 { margin-top: 5.625rem; } .mt_95 { margin-top: 5.9375rem; } .mb_5 { margin-bottom: 0.3125rem; } .mb_10 { margin-bottom: 0.625rem; } .mb_12 { margin-bottom: 0.75rem; } .mb_15 { margin-bottom: 0.9375rem; } .mb_20 { margin-bottom: 1.25rem; } .mb_25 { margin-bottom: 1.5625rem; } .mb_28 { margin-bottom: 1.75rem; } .mb_30 { margin-bottom: 1.875rem; } .mb_35 { margin-bottom: 2.1875rem; } .mb_40 { margin-bottom: 2.5rem; } .mb_45 { margin-bottom: 2.8125rem; } .mb_50 { margin-bottom: 3.125rem; } .mb_55 { margin-bottom: 3.4375rem; } .mb_60 { margin-bottom: 3.75rem; } .mb_65 { margin-bottom: 4.0625rem; } .mb_70 { margin-bottom: 4.375rem; } .mb_75 { margin-bottom: 4.6875rem; } .mb_80 { margin-bottom: 5rem; } .mb_85 { margin-bottom: 5.3125rem; } .mb_90 { margin-bottom: 5.625rem; } .mb_95 { margin-bottom: 5.9375rem; } .mr_bm_10 { margin-bottom: 0.625rem; } .mr_bm_11 { margin-bottom: 0.6875rem; } .mr_bm_12 { margin-bottom: 0.75rem; } .mr_bm_13 { margin-bottom: 0.8125rem; } .mr_bm_14 { margin-bottom: 0.875rem; } .mr_bm_15 { margin-bottom: 0.9375rem; } .mr_bm_16 { margin-bottom: 1rem; } .mr_bm_17 { margin-bottom: 1.0625rem; } .mr_bm_18 { margin-bottom: 1.125rem; } .mr_bm_19 { margin-bottom: 1.1875rem; } .mr_bm_20 { margin-bottom: 1.25rem; } .mr_bm_21 { margin-bottom: 1.3125rem; } .mr_bm_22 { margin-bottom: 1.375rem; } .mr_bm_23 { margin-bottom: 1.4375rem; } .mr_bm_24 { margin-bottom: 1.5rem; } .mr_bm_25 { margin-bottom: 1.5625rem; } .mr_bm_26 { margin-bottom: 1.625rem; } .mr_bm_27 { margin-bottom: 1.6875rem; } .mr_bm_28 { margin-bottom: 1.75rem; } .mr_bm_29 { margin-bottom: 1.8125rem; } .mr_bm_30 { margin-bottom: 1.875rem; } .mr_bm_31 { margin-bottom: 1.9375rem; } .mr_bm_32 { margin-bottom: 2rem; } .mr_bm_33 { margin-bottom: 2.0625rem; } .mr_bm_34 { margin-bottom: 2.125rem; } .mr_bm_35 { margin-bottom: 2.1875rem; } .mr_bm_36 { margin-bottom: 2.25rem; } .mr_bm_37 { margin-bottom: 2.3125rem; } .mr_bm_38 { margin-bottom: 2.375rem; } .mr_bm_39 { margin-bottom: 2.4375rem; } .mr_bm_40 { margin-bottom: 2.5rem; } .mr_bm_41 { margin-bottom: 2.5625rem; } .mr_bm_42 { margin-bottom: 2.625rem; } .mr_bm_43 { margin-bottom: 2.6875rem; } .mr_bm_44 { margin-bottom: 2.75rem; } .mr_bm_45 { margin-bottom: 2.8125rem; } .mr_bm_46 { margin-bottom: 2.875rem; } .mr_bm_47 { margin-bottom: 2.9375rem; } .mr_bm_48 { margin-bottom: 3rem; } .mr_bm_49 { margin-bottom: 3.0625rem; } .mr_bm_50 { margin-bottom: 3.125rem; } .mr_bm_51 { margin-bottom: 3.1875rem; } .mr_bm_52 { margin-bottom: 3.25rem; } .mr_bm_53 { margin-bottom: 3.3125rem; } .mr_bm_54 { margin-bottom: 3.375rem; } .mr_bm_55 { margin-bottom: 3.4375rem; } .mr_bm_56 { margin-bottom: 3.5rem; } .mr_bm_57 { margin-bottom: 3.5625rem; } .mr_bm_58 { margin-bottom: 3.625rem; } .mr_bm_59 { margin-bottom: 3.6875rem; } .mr_bm_60 { margin-bottom: 3.75rem; } .mr_bm_61 { margin-bottom: 3.8125rem; } .mr_bm_62 { margin-bottom: 3.875rem; } .mr_bm_63 { margin-bottom: 3.9375rem; } .mr_bm_64 { margin-bottom: 4rem; } .mr_bm_65 { margin-bottom: 4.0625rem; } .mr_bm_66 { margin-bottom: 4.125rem; } .mr_bm_67 { margin-bottom: 4.1875rem; } .mr_bm_68 { margin-bottom: 4.25rem; } .mr_bm_69 { margin-bottom: 4.3125rem; } .mr_bm_70 { margin-bottom: 4.375rem; } .mr_bm_71 { margin-bottom: 4.4375rem; } .mr_bm_72 { margin-bottom: 4.5rem; } .mr_bm_73 { margin-bottom: 4.5625rem; } .mr_bm_74 { margin-bottom: 4.625rem; } .mr_bm_75 { margin-bottom: 4.6875rem; } .mr_bm_76 { margin-bottom: 4.75rem; } .mr_bm_77 { margin-bottom: 4.8125rem; } .mr_bm_78 { margin-bottom: 4.875rem; } .mr_bm_79 { margin-bottom: 4.9375rem; } .mr_bm_80 { margin-bottom: 5rem; } .mr_bm_81 { margin-bottom: 5.0625rem; } .mr_bm_82 { margin-bottom: 5.125rem; } .mr_bm_83 { margin-bottom: 5.1875rem; } .mr_bm_84 { margin-bottom: 5.25rem; } .mr_bm_85 { margin-bottom: 5.3125rem; } .mr_bm_86 { margin-bottom: 5.375rem; } .mr_bm_87 { margin-bottom: 5.4375rem; } .mr_bm_88 { margin-bottom: 5.5rem; } .mr_bm_89 { margin-bottom: 5.5625rem; } .mr_bm_90 { margin-bottom: 5.625rem; } .mr_bm_91 { margin-bottom: 5.6875rem; } .mr_bm_92 { margin-bottom: 5.75rem; } .mr_bm_93 { margin-bottom: 5.8125rem; } .mr_bm_94 { margin-bottom: 5.875rem; } .mr_bm_95 { margin-bottom: 5.9375rem; } .mr_bm_96 { margin-bottom: 6rem; } .mr_bm_97 { margin-bottom: 6.0625rem; } .mr_bm_98 { margin-bottom: 6.125rem; } .mr_bm_99 { margin-bottom: 6.1875rem; } .mr_bm_100 { margin-bottom: 6.25rem; } .mr_bm_101 { margin-bottom: 6.3125rem; } .mr_bm_102 { margin-bottom: 6.375rem; } .mr_bm_103 { margin-bottom: 6.4375rem; } .mr_bm_104 { margin-bottom: 6.5rem; } .mr_bm_105 { margin-bottom: 6.5625rem; } .mr_bm_106 { margin-bottom: 6.625rem; } .mr_bm_107 { margin-bottom: 6.6875rem; } .mr_bm_108 { margin-bottom: 6.75rem; } .mr_bm_109 { margin-bottom: 6.8125rem; } .mr_bm_110 { margin-bottom: 6.875rem; } .mr_bm_111 { margin-bottom: 6.9375rem; } .mr_bm_112 { margin-bottom: 7rem; } .mr_bm_113 { margin-bottom: 7.0625rem; } .mr_bm_114 { margin-bottom: 7.125rem; } .mr_bm_115 { margin-bottom: 7.1875rem; } .mr_bm_116 { margin-bottom: 7.25rem; } .mr_bm_117 { margin-bottom: 7.3125rem; } .mr_bm_118 { margin-bottom: 7.375rem; } .mr_bm_119 { margin-bottom: 7.4375rem; } .mr_bm_120 { margin-bottom: 7.5rem; } #footer { background-color: #272727; padding-left: 3.125rem; padding-right: 3.125rem; padding-top: 5rem; padding-bottom: 5rem; } #footer .wrap_f { position: relative; margin-bottom: 3.75rem; display: -webkit-box; display: -ms-flexbox; display: flex; } @media all and (max-width: 1280px) { #footer .wrap_f { -ms-flex-wrap: wrap; flex-wrap: wrap; } } #footer .f_logo { margin-bottom: 1.5625rem; margin-top: 1.875rem; } #footer .f_logo a { display: inline-block; margin-right: 1.25rem; } #footer .f_logo a:last-child { margin-right: 0; } #footer .f_left { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; font-size: 0.875rem; letter-spacing: 0; flex: 1 auto; gap: 6.25rem; } #footer .f_left .sub_info li { margin-bottom: 0.5rem; } #footer .f_left .ft_tit { display: block; font-size: 1rem; font-weight: 600; margin-bottom: 0.9375rem; } #footer .f_left > div { display: inline-block; vertical-align: top; } #footer .f_left > div:last-child { margin-right: 0; } #footer .f_left .hosted { color: #ddd; } #footer .f_left .secret { color: #ccc; } #footer .f_right { flex: 0 0 auto; } #footer .f_right .btn { background-color: #2e2e2e; border-width: 0; color: #dddddd; font-size: 1rem; -moz-transition: all .4s; -webkit-transition: all .4s; -ms-transition: all .4s; -o-transition: all .4s; transition: all .4s; } #footer .f_right .fr_top .btn { display: inline-flex;align-items: center;justify-content: center; max-width: 11.5rem;text-align: center; } #footer .f_right .fr_top li { float: left; margin-right: 0.625rem; } #footer .f_right .fr_top li:last-child { margin-right: 0; } #footer .f_right .fr_bottom { position: absolute; right: 0; bottom: 0; } #footer .f_right .fr_bottom .sns_share::after { content: ''; display: block; clear: both; } #footer .f_right .fr_bottom .sns_share a { display: inline-block; font-size: 0; border-radius: 50%; width: 3.75rem; height: 3.75rem; position: relative; vertical-align: top; } #footer .f_right .fr_bottom .sns_share a.facebook { background-color: #00549f; } #footer .f_right .fr_bottom .sns_share a.twitter { background-color: #000; } #footer .f_right .fr_bottom .sns_share a.insta { background: #d6249f; background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%); background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%); } #footer .f_right .fr_bottom .sns_share a.youtube { background-color: #e62d27; } #footer .f_right .fr_bottom .sns_share a.youtube [class*=iconFt], #footer .f_right .fr_bottom .sns_share a.youtube [class^=iconFt] { font-size: 1.75rem; } #footer .f_right .fr_bottom .sns_share a [class*=iconFt], #footer .f_right .fr_bottom .sns_share a [class^=iconFt] { color: #ffffff; font-size: 1.375rem; position: absolute; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } #footer .f_right .fr_bottom .sns_share li { float: left; margin-right: 0.625rem; } #footer .f_right .fr_bottom .sns_share li:last-child { margin-right: 0; } #footer .f_info_lists > span { display: inline-block; margin-right: 0.625rem; padding-right: 0.625rem; position: relative; } #footer .f_info_lists > span::after { content: '/'; display: block; font-size: 1em; position: absolute; top: 0; right: 0; -moz-transform: translateX(50%); -webkit-transform: translateX(50%); -ms-transform: translateX(50%); -o-transform: translateX(50%); transform: translateX(50%); } #footer .f_info_lists > span:last-child::after { display: none; } @media all and (max-width: 1280px) { #footer { position: relative; } #footer .wrap_f { position: static; margin-bottom: 4.06545rem; } #footer .f_left { width: 100%; font-size: 1.50109rem; padding-top: 6.25455rem; gap: 2.50182rem; } #footer .f_left > div { display: block; width: 100%; } #footer .f_left .ft_tit { font-size: 1.50109rem; } #footer .f_right { display: block; width: 100%; position: static; height: auto; } #footer .f_right .fr_top { position: absolute; top: 0; left: 0; width: 100%; border-bottom: 1px solid #383838; } #footer .f_right .fr_top ul::after { content: ''; display: block; clear: both; } #footer .f_right .fr_top li { width: 50%; margin-right: 0; } #footer .f_right .fr_top li:first-child { border-right: 1px solid #383838; } #footer .f_right .fr_top .btn { width: 100%; height: 7.50545rem; line-height: 7.50545rem; max-width: none; border-radius: 0; background-color: initial; font-size: 1.62618rem; } #footer .f_right .fr_bottom { position: static; margin-top: 3.12727rem; } #footer .f_right .fr_bottom .sns_share a { width: 5.00364rem; height: 5.00364rem; } #footer .f_right .fr_bottom .sns_share a [class*=iconFt], #footer .f_right .fr_bottom .sns_share a [class^=iconFt] { display: inline-block; font-size: 1.87636rem; } #footer .f_right .fr_bottom .sns_share a.youtube [class*=iconFt], #footer .f_right .fr_bottom .sns_share a.youtube [class^=iconFt] { font-size: 2.37673rem; } #footer .f_info_lists > span { margin-top: .5rem; } #footer .f_info_lists > span:first-child { margin-top: 0; } #footer .f_info_lists > span::after { display: none; } } #side_right { position: fixed; right: 0; top: 0%; height: 100%; z-index: 3000; background-color: #222; -moz-transform: translateX(100%); -webkit-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); -moz-transition: all .3s; -webkit-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; } #side_right .__close { display: none; } @media all and (max-width: 1280px) { #side_right { width: 100%; } #side_right .am_close { flex: none; position: absolute; top: 0; right: 0; width: 5.625rem; height: 5.625rem; color: #ffffff; background: #ef7a00; } #side_right .am_close > i { position: absolute; width: 100%; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; font-size: 1.625rem; } #side_right .edit_close::before, #side_right .edit_close::after { content: ''; display: block; position: absolute; top: 50%; left: 50%; width: 2.375rem; height: 1px; margin-left: -1.1875rem; margin-top: -0.0625rem; border-top: 3px solid #fff; transition: all .5s; -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } #side_right.on .edit_close::before { -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } #side_right.on .edit_close::after { -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } } #side_right.on { transform: none; box-shadow: -20px 0px 20px 0px rgba(0, 0, 0, 0.1); } #side_right.on .__open { display: none; } #side_right.on .__close { display: block; } #side_right .side_btn { position: absolute; top: auto; bottom: 50%; left: -4.6875rem; width: 4.6875rem; border-radius: 0.3125rem 0 0 0.3125rem; overflow: hidden; box-shadow: -20px 0px 20px 0px rgba(0, 0, 0, 0.05); -moz-transform: translateY(50%); -webkit-transform: translateY(50%); -ms-transform: translateY(50%); -o-transform: translateY(50%); transform: translateY(50%); } #side_right .side_btn li:first-child { height: auto; } #side_right .side_btn li:first-child > .toggle_box > div { height: 5.25rem; } #side_right .side_btn li:first-child > .toggle_box > div:first-child, #side_right .side_btn li:first-child > .toggle_box > div:nth-child(2), #side_right .side_btn li:first-child > .toggle_box > div:nth-child(3), #side_right .side_btn li:first-child > .toggle_box > div:nth-child(4), #side_right .side_btn li:first-child > .toggle_box > div:nth-child(5) { border-bottom: 1px solid #444; } #side_right .side_btn li:first-child > .toggle_box > div:hover, #side_right .side_btn li:first-child > .toggle_box > div.on { height: 5.25rem; } #side_right .side_btn li:first-child .plus_btn { display: none; } #side_right .side_btn li:nth-child(2) { height: 4.625rem; } #side_right .side_btn li:nth-child(2) button [class^=iconFt_], #side_right .side_btn li:nth-child(2) button [class*=iconFt_] { display: block; font-size: 0.625rem; } #side_right .side_btn a, #side_right .side_btn button { display: block; position: relative; font-size: 1.375rem; background-color: #222222; width: 100%; height: 100%; } #side_right .side_btn a span, #side_right .side_btn button span { position: absolute; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } #side_right .side_btn a .sub_text, #side_right .side_btn button .sub_text { font-weight: 400; font-size: 0.75rem; color: #dddddd; -moz-transition: color .1s; -webkit-transition: color .1s; -ms-transition: color .1s; -o-transition: color .1s; transition: color .1s; } #side_right .side_btn a [class^=iconFt_], #side_right .side_btn a [class*=iconFt_], #side_right .side_btn button [class^=iconFt_], #side_right .side_btn button [class*=iconFt_] { font-size: 1.5rem; } #side_right .side_btn a .__hov, #side_right .side_btn button .__hov { display: block; margin-top: 0.1875rem; position: static; top: auto; left: auto; transform: none; line-height: 1.125em; } #side_right .side_btn a:hover .sub_text.hov, #side_right .side_btn button:hover .sub_text.hov { color: #ef7a00; } #side_right .side_btn .down .__close { line-height: 1; } #side_right .side_btn .down .__close .edit_close { display: inline-block; width: 1.5rem; height: 1.5rem; position: relative; text-align: center; } #side_right .side_btn .down .__close .edit_close::before, #side_right .side_btn .down .__close .edit_close::after { content: ''; display: block; position: absolute; top: 50%; left: 50%; width: 100%; height: 0px; margin-left: -0.75rem; margin-top: -0.0625rem; border-top: 2px solid #eeeeee; -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); transform-origin: center; } #side_right .side_btn .down .__close .edit_close::before { -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } #side_right .side_btn .down .__close .edit_close::after { -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } #side_right .side_btn .down button:hover .__close .edit_close::before, #side_right .side_btn .down button:hover .__close .edit_close::after { border-top-color: #ff8200; } #side_right .side_btn .gallery { text-align: center; letter-spacing: .3px; } #side_right .side_btn .gallery [class*=iconFt_] { font-size: 1.5em; } #side_right .side_btn .top button { background-color: #ef7a00; } #side_right .side_btn .top button .sub_text { font-weight: 500; font-size: 1rem; color: #fff; } #side_right .download_wrap { width: 27.25rem; padding-top: 4.375rem; padding-left: 2.5rem; padding-right: 2.5rem; } @media all and (max-width: 1280px) { #side_right .download_wrap { width: 100%; padding-top: 8.13091rem; } } #side_right .download_wrap .tit_2 { font-size: 2rem; letter-spacing: 0; color: #fff; font-weight: 900; } @media all and (max-width: 1280px) { #side_right .download_wrap .tit_2 { letter-spacing: .025em; font-size: 2.50182rem; } } #side_right .download_wrap > ul { margin-top: 3.125rem; max-height: 75vh; overflow-y: auto; } #side_right .download_wrap > ul button { width: 100%; height: 100%; padding-left: 5.9375rem; padding-right: 3.75rem; text-align: left; color: #fff; font-size: 1.125rem; } #side_right .download_wrap > ul button > [class^=iconFt_], #side_right .download_wrap > ul button > [class*=iconFt_] { position: absolute; left: 2.125rem; top: 50%; font-size: 2.125rem; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } #side_right .download_wrap > ul button:hover { color: #ef7a00; } #side_right .download_wrap > ul button:hover .right_circle { color: #fff; } #side_right .download_wrap > ul li { background-color: #2e2e2e; width: 100%; height: 6.25rem; position: relative; margin-bottom: 1.25rem; } #side_right .download_wrap > ul li .right_circle { position: absolute; right: 1.25rem; top: 50%; width: 2.5rem; height: 2.5rem; margin-top: -1.25rem; border-radius: 50%; background-color: #222222; font-size: 1.125rem; } #side_right .download_wrap > ul li .right_circle [class^=iconFt_], #side_right .download_wrap > ul li .right_circle [class*=iconFt_] { position: absolute; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } @media all and (max-width: 1280px) { #side_right .download_wrap > ul { margin-top: 3.75273rem; } #side_right .download_wrap > ul button { font-size: 1.62618rem; } #side_right .download_wrap > ul button > [class^=iconFt_], #side_right .download_wrap > ul button > [class*=iconFt_] { left: 2.50182rem; font-size: 2.50182rem; } #side_right .download_wrap > ul li .right_circle { width: 3.75273rem; height: 3.75273rem; font-size: 1.25091rem; margin-top: -1.87636rem; } } @media all and (max-width: 1280px) { #side_right .side_btn { width: 7.50545rem; left: -7.50545rem; padding-right: 1.25091rem; box-shadow: none; overflow: visible; bottom: 0; margin-bottom: 17.51273rem; } #side_right .side_btn li:first-child { position: relative; } #side_right .side_btn li:first-child .plus_btn { display: block; height: 6.25455rem; border-bottom: 0; transition: transform .3s; transform-origin: center; } #side_right .side_btn li:first-child .plus_btn button { display: block; width: 6.25455rem; height: 100%; border-radius: 100%; background-color: #222222; position: relative; box-shadow: 4px 3px 14px 0px rgba(0, 0, 0, 0.15); } #side_right .side_btn li:first-child .plus_btn .cross { display: block; position: absolute; top: 50%; left: 50%; height: 1px; width: 1px; margin-left: -1px; } #side_right .side_btn li:first-child .plus_btn .cross::before, #side_right .side_btn li:first-child .plus_btn .cross::after { content: ''; display: block; width: 2.064rem; height: 0.18764rem; background-color: #ffffff; position: absolute; top: 0; right: 0; margin-right: -1.032rem; } #side_right .side_btn li:first-child .plus_btn .cross::before { transform-origin: center; -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } #side_right .side_btn li:first-child .plus_btn.on.plus_btn { -moz-transform: rotate(45.001deg); -webkit-transform: rotate(45.001deg); -ms-transform: rotate(45.001deg); -o-transform: rotate(45.001deg); transform: rotate(45.001deg); } #side_right .side_btn li:first-child .toggle_box { display: none; position: absolute; bottom: 100%; right: 0; margin-bottom: 1.25rem; border-radius: 5px; overflow: hidden; width: 100%; transform-origin: bottom; transition: transform .3s, width .3s; } #side_right .side_btn li:first-child .toggle_box > div:hover, #side_right .side_btn li:first-child .toggle_box > div.on { height: 5.25rem; } #side_right .side_btn li:first-child .toggle_box.__active { display: block; width: 21.70182rem; -moz-transform: scaleX(1); -webkit-transform: scaleX(1); -ms-transform: scaleX(1); -o-transform: scaleX(1); transform: scaleX(1); } #side_right .side_btn li:first-child .toggle_box.__active a .sub_text, #side_right .side_btn li:first-child .toggle_box.__active button .sub_text { display: block; } #side_right .side_btn li:first-child .toggle_box a .sub_text, #side_right .side_btn li:first-child .toggle_box button .sub_text { display: none; left: 0; width: 19.70182rem; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); text-align: left; padding-left: 1.87636rem; padding-right: 0.93818rem; vertical-align: middle; font-size: 1.62618rem; } #side_right .side_btn li:first-child .toggle_box a .sub_text [class*=iconFt_], #side_right .side_btn li:first-child .toggle_box a .sub_text [class^=iconFt_], #side_right .side_btn li:first-child .toggle_box button .sub_text [class*=iconFt_], #side_right .side_btn li:first-child .toggle_box button .sub_text [class^=iconFt_] { position: absolute; top: 50%; left: 1.87636rem; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); font-size: 1.62618rem; } #side_right .side_btn li:first-child .toggle_box a .sub_text .__hov, #side_right .side_btn li:first-child .toggle_box button .sub_text .__hov { display: block; width: 100%; margin-top: 0; padding-left: 2.68945rem; } #side_right .side_btn li:first-child .toggle_box a .sub_text.__close, #side_right .side_btn li:first-child .toggle_box button .sub_text.__close { display: none; } #side_right .side_btn li:first-child .gallery [class*=iconFt_] { font-size: 1.25091rem !important; } #side_right .side_btn li:first-child .notice { border-radius: 5px 5px 0 0; } #side_right .side_btn li:first-child .down { border-radius: 0 0 5px 5px; } #side_right .side_btn li:nth-child(2) { margin-top: 0.62545rem; height: 6.25455rem; } #side_right .side_btn .top button { box-shadow: 4px 3px 14px 0px rgba(0, 0, 0, 0.15); border-radius: 100%; background-color: #ffffff; } #side_right .side_btn .top button .sub_text { color: #222222; font-size: 1.376rem; font-weight: 700; } #side_right .side_btn .top button .sub_text [class^=iconFt_], #side_right .side_btn .top button .sub_text [class*=iconFt_] { font-size: 10px; } } #sideBottom { position: fixed; bottom: 3.75rem; left: 0; z-index: 2500; width: 100%; background-color: rgba(3, 13, 38, 0.9); letter-spacing: 0; padding-bottom: 1.5625rem; font-size: 1.125rem; -moz-transition: all .3s; -webkit-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; -moz-transform: translateY(100%) rotate(-0.01deg); -webkit-transform: translateY(100%) rotate(-0.01deg); -ms-transform: translateY(100%) rotate(-0.01deg); -o-transform: translateY(100%) rotate(-0.01deg); transform: translateY(100%) rotate(-0.01deg); } #sideBottom .__hide { display: none; } #sideBottom .__show { display: block; } #sideBottom .side_btn i { -moz-transform: scaleY(-1); -webkit-transform: scaleY(-1); -ms-transform: scaleY(-1); -o-transform: scaleY(-1); transform: scaleY(-1); } #sideBottom.on { transform: none; bottom: 0rem; } #sideBottom.on .side_btn { background-color: #ef7a00; } #sideBottom.on .side_btn i { transform: none; } #sideBottom.on .__hide { display: block; } #sideBottom.on .__show { display: none; } #sideBottom.on .act_side_bottom { width: auto; } #sideBottom .wrap_s { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center; flex-wrap: wrap; } @media all and (max-width: 1480px) and (min-width: 1280px) { #sideBottom .wrap_s { padding-left: 2.0625rem; padding-right: 2.0625rem; } } #sideBottom .left, #sideBottom .right { height: 11.375rem; } #sideBottom .left .inner, #sideBottom .right .inner { height: 8.375rem; } #sideBottom .right { width: 40%; padding-left: 1rem;} #sideBottom .right .inner { line-height: 8.375rem; } #sideBottom .right .inner a { height: 5rem; vertical-align: middle; display: inline-block; padding-right: 1.25rem; font-size: 1.125rem; } #sideBottom .right .inner a .icon_box { display: inline-block; width: 5rem; height: 100%; border-radius: 50%; background-color: #242c42; margin-right: 0.9375rem; position: relative; } #sideBottom .right .inner a .icon_box [class^=iconFt_], #sideBottom .right .inner a .icon_box [class*=iconFt_] { font-size: 2.5rem; color: #fff; position: absolute; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } #sideBottom .right .inner a:hover .txt_box { text-decoration: underline; } #sideBottom .right .inner a .txt_box { display: inline-block; height: 100%; line-height: 5rem; color: #fff; vertical-align: top; } #sideBottom .right .inner a:last-child { padding-right: 0; } #sideBottom .right.ty_2 .inner { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; justify-content: space-between; text-align: center; } #sideBottom .right.ty_2 .inner a { padding-right: .75rem; padding-left: .75rem; } #sideBottom .right.ty_2 .inner a:first-child { padding-left: 0; } #sideBottom .right.ty_2 .inner a:last-child { padding-right: 0; } #sideBottom .right.ty_2 .inner a .icon_box { display: block; height: 5rem; margin: auto; } #sideBottom .right.ty_2 .inner a .txt_box { line-height: 1.4; padding: .825rem 0; } @media all and (max-width: 1280px) { #sideBottom .right.ty_2 .inner a .icon_box { height: 7.81818rem; } #sideBottom .right.ty_2 .inner a:first-child { margin-right: 0; } } #sideBottom .left { width: 60%; padding-right: 1rem; } #sideBottom .left .col_12 { width: 50%; } #sideBottom .left .col_12:nth-child(2) { padding-left: 0.625rem; } #sideBottom .left a { color: #ff8200; line-height: 1.25em; font-weight: 500; position: relative; } #sideBottom .left a .icon_cover { display: inline-block; position: absolute; right: 0.1875rem; top: 50%; -moz-transform: translateY(-50%) rotate(90deg); -webkit-transform: translateY(-50%) rotate(90deg); -ms-transform: translateY(-50%) rotate(90deg); -o-transform: translateY(-50%) rotate(90deg); transform: translateY(-50%) rotate(90deg); transform-origin: center; } #sideBottom .left a:hover { text-decoration: underline; } #sideBottom .left a.subs { color: #fff; font-weight: 300; font-size: 1.0625rem; } #sideBottom .left a.subs [class^=iconFt_], #sideBottom .left a.subs [class*=iconFt_] { position: absolute; right: 0.1875rem; top: 50%; font-size: 1.625rem; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } #sideBottom .left .abst::after { content: ''; display: block; clear: both; } #sideBottom .left .abst li { float: left; width: 50%; padding-right: 0.625rem; } #sideBottom .left .abst .inner { border-radius: 0.3125rem; padding: 0 1.25rem; border: 1px solid rgba(255, 255, 255, 0.2); } @media all and (min-width: 1281px) and (max-width: 1440px) { #sideBottom .left .abst .inner { padding: 0 0.625rem; } } #sideBottom .left .abst a { display: block; padding: 0.9375rem 0; } #sideBottom .left .abst a:first-child { border-bottom: 1px dashed rgba(255, 255, 255, 0.2); } #sideBottom .left .abst a.subs { padding-left: 1.5625rem; position: relative; } #sideBottom .left .abst a.subs::before { content: '┗'; display: block; position: absolute; top: 50%; left: 0; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } #sideBottom .left .resist .inner { border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 0.3125rem; padding-left: 1rem; padding-right: 1rem; } #sideBottom .left .resist a { display: inline-block; width: 50%; margin-left: -0.25rem; margin-right: -0.25rem; padding: 0.9375rem 0; } #sideBottom .left .resist a:first-child { padding-right: 1.5625rem; position: relative; } #sideBottom .left .resist a:first-child::after { content: ''; display: block; position: absolute; right: 0; top: 50%; border-right: 1px dashed rgba(255, 255, 255, 0.2); height: 3.25rem; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } #sideBottom .left .resist a:first-child .icon_cover { right: 1.5625rem; } #sideBottom .left .resist a:nth-child(2) { padding-left: 1.5625rem; } #sideBottom .left .resist a.line { line-height: 4.625rem; padding-top: 0; padding-bottom: 0; vertical-align: top; } #sideBottom .left .resist a.subs { display: block; text-align: center; width: 100%; border-top: 1px dashed rgba(255, 255, 255, 0.2); } #sideBottom .left .resist a.subs:hover > span { text-decoration: underline; } #sideBottom .left .resist a.subs > span { display: inline-block; position: relative; text-align: left; padding-right: 2.8125rem; padding-left: 1.5625rem; } #sideBottom .left .resist a.subs > span::before { content: '┗'; display: block; position: absolute; top: 50%; left: 0; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } #sideBottom .act_side_bottom { height: 3.75rem; width: 100%; transition: width .3s; text-align: left; } #sideBottom .side_tit { display: inline-block; font-size: 1.125rem; font-weight: 500; color: #fff; letter-spacing: 0.1em; } #sideBottom .side_btn { width: 3.75rem; height: 3.75rem; background-color: #ef7a00; position: absolute; top: 0; right: -3.75rem; display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center; justify-content: center; } #sideBottom .side_btn [class^=iconFt], #sideBottom .side_btn [class*=iconFt] { font-size: 1.25rem; color: #fff; } #sideBottom .mo_btn { display: none; } #sideBottom .line_break { flex-basis: 100%; height: 0; } #sideBottom .bottom { width: 100%; margin-top: 3.125rem; } #sideBottom .bottom ul { display: flex; justify-content: space-between; align-items: center; } #sideBottom .bottom ul li { display: flex; justify-content: center; align-items: center; width: 30%; height: 5.375rem; background-color: #fff; } #sideBottom .bottom ul li:nth-of-type(3) { background-color: #242c42; } @media all and (min-width: 1281px) and (max-width: 1440px) { #sideBottom .left { width: 60%; } #sideBottom .side_btn { right: 0; } } @media all and (max-width: 1280px) { #sideBottom { bottom: 8.944rem; padding-bottom: 0; transition: none; } #sideBottom.on .mo_btn { border-top: 1px solid rgba(48, 53, 69, 0.9); } #sideBottom .side_tit { font-size: 1.62618rem; } #sideBottom .items { font-size: 1.376rem; } #sideBottom .left a.subs { font-size: 1.31345rem; } #sideBottom .left .abst { margin-left: -1.25091rem; } #sideBottom .left .abst li { padding-right: 0; padding-left: 1.25091rem; } #sideBottom .left .abst a { padding: 1.87636rem 0; } #sideBottom .left .col_12:nth-child(2) { padding-left: 0; } #sideBottom .left .resist a, #sideBottom .left .resist a.line { padding-top: 1.87636rem; padding-bottom: 1.87636rem; } #sideBottom .left .resist a.line { line-height: 3.12727rem; } #sideBottom .right .inner { display: -webkit-box; display: -ms-flexbox; display: flex; align-items: flex-start; } #sideBottom .right .inner a { font-size: 1.376rem; height: 7.81818rem; } #sideBottom .right .inner a:first-child { margin-right: 1.56364rem; } #sideBottom .right .inner a .icon_box { width: 7.81818rem; } #sideBottom .right .inner a .icon_box [class^=iconFt_], #sideBottom .right .inner a .icon_box [class*=iconFt_] { font-size: 3.12727rem; } #sideBottom .right .inner a .txt_box { line-height: 7.81818rem; } #sideBottom .wrap_s { display: block; padding-left: 0; padding-right: 0; } #sideBottom .wrap_s .left, #sideBottom .wrap_s .right, #sideBottom .wrap_s .bottom { width: 100%; display: none; height: auto; padding: 1.25091rem 2.50182rem; } #sideBottom .wrap_s .left .inner, #sideBottom .wrap_s .right .inner { height: 12.50909rem; } #sideBottom .wrap_s .items { display: none; width: 100%; } #sideBottom .wrap_s .items.on { display: block; } #sideBottom .wrap_s .side_btn { display: none; } #sideBottom .mo_btn { display: block; text-align: center; width: 100%; } #sideBottom .mo_btn > ul { display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center; font-size: 1.00073rem; padding-top: 0.62545rem; padding-bottom: 0.62545rem; } #sideBottom .mo_btn > ul > li { display: block; width: 100%; height: 7.81818rem; position: relative; } #sideBottom .mo_btn > ul > li:last-child::after { display: none; } #sideBottom .mo_btn > ul > li::after { content: ''; display: block; position: absolute; right: 0; top: 50%; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); border-right: 1px solid rgba(48, 53, 69, 0.9); height: 1.87636rem; } #sideBottom .mo_btn > ul button { color: #ffffff; display: inline-block; width: 100%; padding: 0 0.93818rem; position: absolute; top: 50%; left: 50%; line-height: 1.125; -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); word-break: break-all; } #sideBottom .mo_btn > ul [class*=iconFt_], #sideBottom .mo_btn > ul [class^=iconFt_] { display: block; text-align: center; font-size: 2.81455rem; margin-bottom: 0.62545rem; } #sideBottom .bottom {margin-top: 0;} } @media all and (max-width: 501px) { #sideBottom .mo_btn > ul button { font-size: 1.4rem; } } body.__scrolloff { overflow: visible; } .on .edit_close::before { -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .on .edit_close::after { -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .allmenu_wrap { position: fixed; z-index: 5000; top: 0; right: 0; left: 0; height: 100%; font-size: 1.125rem; font-weight: 300; background: #ffffff; overflow: hidden; overflow-y: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; -moz-transform: translate(0, -100%); -webkit-transform: translate(0, -100%); -ms-transform: translate(0, -100%); -o-transform: translate(0, -100%); transform: translate(0, -100%); -moz-transition: -moz-transform .3s; -webkit-transition: -webkit-transform .3s; -ms-transition: -ms-transform .3s; -o-transition: -o-transform .3s; transition: transform .3s; } .allmenu_wrap .allMenu_tit { display: none; } .allmenu_wrap::after, .allmenu_wrap::before { content: ''; display: block; position: absolute; background-size: cover; background-repeat: no-repeat; } .allmenu_wrap::before { background-image: url("../images/main/main_sect_1_bg2.png"); top: 0; left: 0; background-position: right bottom; width: 16.125rem; height: 24rem; } .allmenu_wrap::after { background-image: url("../images/main/main_sect_1_bg3.png"); bottom: 0; right: 0; background-position: left top; width: 13.75rem; height: 22.5rem; } .allmenu_wrap .subs { font-size: .8em; } .allmenu_wrap .am_left { width: 100%; position: relative; } .allmenu_wrap .am_left .icon_cover { display: none; } .allmenu_wrap .am_left::after { content: ''; display: block; position: absolute; top: 0; left: 50%; height: 100%; border-right: 1px solid rgba(22, 22, 22, 0.15); } .allmenu_wrap .am_right { display: none; position: absolute; left: 77.08%; bottom: 5.9375rem; color: #ffffff; } .allmenu_wrap .am_right .am_right_wrap li { margin-top: 1.25rem; padding-left: 1.875rem; } .allmenu_wrap .am_right .am_right_wrap .all_menu_logo { margin-top: 3.5625rem; } .allmenu_wrap .am_right .am_right_wrap .btn { min-width: 16.25rem; border-radius: 1.6875rem; font-size: 1rem; font-weight: 700; color: #ef7a00; } .allmenu_wrap .am_close { flex: none; position: absolute; top: 0; right: 0; width: 5.625rem; height: 5.625rem; color: #ffffff; background: #ef7a00; } .allmenu_wrap .am_close > i { position: absolute; width: 100%; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; font-size: 1.625rem; } .allmenu_wrap .depth_1 { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; flex-wrap: wrap; font-size: 1.4375rem; letter-spacing: -0.05em; color: #222222; font-weight: 500; line-height: 1.27; max-width: 1460px; margin-left: auto; margin-right: auto; border-left: 1px solid rgba(22, 22, 22, 0.15); border-right: 1px solid rgba(22, 22, 22, 0.15); padding-top: 5.625rem; padding-bottom: 5.625rem; position: relative; } .allmenu_wrap .depth_1::after, .allmenu_wrap .depth_1::before { content: ''; display: block; height: 100%; position: absolute; top: 0; border-right: 1px solid rgba(22, 22, 22, 0.15); } .allmenu_wrap .depth_1::after { left: 75%; } .allmenu_wrap .depth_1::before { left: 25%; } .allmenu_wrap .depth_1 > li { position: relative; margin-bottom: 1.75rem; width: 25%; padding-left: 1.875rem; padding-right: 1.875rem; } .allmenu_wrap .depth_1 > li > a { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; align-items: center; justify-content: flex-start; height: 2.5em; position: relative; font-weight: 700; } .allmenu_wrap .depth_1 > li > a br { display: none; } .allmenu_wrap .depth_1 > li > a::after { content: ''; display: block; width: 100%; border-bottom: 0.1875rem solid #ef7a00; position: absolute; left: 0; bottom: 0; -moz-transform: scaleX(0); -webkit-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); -moz-transition: all .3s; -webkit-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; transform-origin: left; } .allmenu_wrap .depth_1 > li:last-child { margin-bottom: 0; } .allmenu_wrap .depth_1 > li.on > a::after, .allmenu_wrap .depth_1 > li:hover > a::after { transform: scaleX(1); } .allmenu_wrap .depth_1 > li:nth-child(6) br { display: block; } .allmenu_wrap .depth_1 .depth_2 { display: block; width: 100%; margin-top: 1.25rem; } .allmenu_wrap .depth_1 .depth_2 .wrap_s > li { font-size: 1.25rem; line-height: 1.5; font-weight: 500; letter-spacing: 0; margin-top: 0.625rem; } .allmenu_wrap .depth_1 .depth_2 .wrap_s > li .depth_box > a { display: block; } .allmenu_wrap .depth_1 .depth_2 .wrap_s > li .depth_box > a .subs { display: block; } .allmenu_wrap .depth_1 .depth_2 .wrap_s > li:last-child { margin-bottom: 0; } .allmenu_wrap .depth_1 .depth_2 .wrap_s > li .depth_box:hover > a, .allmenu_wrap .depth_1 .depth_2 .wrap_s > li .depth_box.on > a { color: #ef7a00; } .allmenu_wrap .depth_1 .depth_2 .wrap_s > li br { display: none; } .allmenu_wrap .depth_1 .depth_2 ._unfold { position: relative; } .allmenu_wrap .depth_1 .depth_2 ._unfold .cross { display: none; } .allmenu_wrap .depth_1 .depth_2 ._unfold .cross::before, .allmenu_wrap .depth_1 .depth_2 ._unfold .cross::after { content: ''; display: block; width: 0.625rem; height: 0.125rem; background-color: #222222; position: absolute; top: 0; right: 0.9375rem; } .allmenu_wrap .depth_1 .depth_2 ._unfold .cross::before { transform-origin: center; -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } .allmenu_wrap .depth_1 .depth_3 { display: block; padding-top: 0.9375rem; padding-bottom: 0.9375rem; } .allmenu_wrap .depth_1 .depth_3 li > a { display: block; font-size: 1.125rem; color: #999999; letter-spacing: 0; font-weight: 500; line-height: 1.5; -moz-transition: color .1s; -webkit-transition: color .1s; -ms-transition: color .1s; -o-transition: color .1s; transition: color .1s; padding-left: 0.9375rem; position: relative; } .allmenu_wrap .depth_1 .depth_3 li > a:hover { color: #ef7a00; } .allmenu_wrap .depth_1 .depth_3 li > a::before { content: ''; display: block; position: absolute; top: 50%; left: 0; width: 3px; height: 3px; border-radius: 50%; background-color: #999; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .allmenu_wrap .depth_1 .depth_3 li + li { margin-top: 0.625rem; } @media all and (max-width: 1780px) { .allmenu_wrap .depth_1 { font-size: 1.75rem; } .allmenu_wrap .depth_1 .depth_2 .wrap_s { padding-left: 0; padding-right: 0; } .allmenu_wrap .depth_1 .depth_2 .wrap_s > li { font-size: 1.125rem; } .allmenu_wrap .depth_1 .depth_2 ._unfold .cross { right: 1.125rem; } .allmenu_wrap .depth_1 .depth_3 li > a { font-size: 0.875rem; } } @media all and (min-width: 1281px) and (max-width: 1440px) { .allmenu_wrap .depth_1 { font-size: 1.5rem; } } .edit_close::before, .edit_close::after { content: ''; display: block; position: absolute; top: 50%; left: 50%; width: 2.375rem; margin-left: -1.1875rem; border-top: 3px solid #fff; transition: all .5s; -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } @media all and (max-width: 1280px) { .edit_close::before, .edit_close::after { width: 3.125rem; margin-left: -1.5625rem; border-top-width: 2px; } } .allMenu_mo_wrap { display: none; } .allMenu_mo_wrap { position: fixed; z-index: 5000; top: 0; right: 0; left: 0; height: 100%; font-size: 1.125rem; font-weight: 300; background: #ffffff; overflow: hidden; overflow-y: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; -moz-transform: translate(0, -100%); -webkit-transform: translate(0, -100%); -ms-transform: translate(0, -100%); -o-transform: translate(0, -100%); transform: translate(0, -100%); -moz-transition: -moz-transform .3s; -webkit-transition: -webkit-transform .3s; -ms-transition: -ms-transform .3s; -o-transition: -o-transform .3s; transition: transform .3s; } .allMenu_mo_wrap .amm_box { width: 100%; height: 100%; background: #ffffff; margin-left: auto; margin-right: auto; } .allMenu_mo_wrap .amm_top { color: #ffffff; background: #ef7a00; padding: 0 2.50182rem; font-size: 1.50109rem; } .allMenu_mo_wrap .wrap_s { padding-left: 0; padding-right: 0; } .allMenu_mo_wrap .depth_1 br { display: none; } .allMenu_mo_wrap .depth_1 > li { position: relative; border-bottom: 1px solid #dddddd; } .allMenu_mo_wrap .depth_1 > li.on > a { color: #ef7a00; } .allMenu_mo_wrap .depth_1 > li.on > a::after { content: '\e91e'; } .allMenu_mo_wrap .depth_1 > li > a { display: block; line-height: 1.5; font-weight: 500; padding-left: 2.50182rem; padding-right: 2.50182rem; padding-top: 2.50182rem; padding-bottom: 2.50182rem; font-size: 1.87636rem; position: relative; } .allMenu_mo_wrap .depth_1 > li > a::after { content: '\e91f'; display: block; font-size: 1.50109rem; position: absolute; right: 2.62691rem; top: 50%; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); font-family: 'iconFont' !important; speak: never; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .allMenu_mo_wrap .depth_2 { display: none; font-size: 1.62618rem; border-top: 1px solid #dddddd; padding-left: 2.50182rem; padding-right: 2.50182rem; } .allMenu_mo_wrap .depth_2 .depth_box a { display: block; width: 100%; } .allMenu_mo_wrap .depth_2 .depth_box > a { height: 5.62909rem; line-height: 1.5; position: relative; border-bottom: 1px solid #dddddd; } .allMenu_mo_wrap .depth_2 .depth_box > a > .in_text { position: absolute; top: 50%; left: 0; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .allMenu_mo_wrap .depth_2 .depth_box .icon_cover { display: none; position: absolute; right: 0; top: 50%; -moz-transform: translateY(-50%) rotate(90deg); -webkit-transform: translateY(-50%) rotate(90deg); -ms-transform: translateY(-50%) rotate(90deg); -o-transform: translateY(-50%) rotate(90deg); transform: translateY(-50%) rotate(90deg); } .allMenu_mo_wrap .depth_2 .cross { display: block; position: absolute; top: 50%; right: 0; height: 1px; width: 1px; } .allMenu_mo_wrap .depth_2 .cross::before, .allMenu_mo_wrap .depth_2 .cross::after { content: ''; display: block; width: 1.25091rem; height: 2px; background-color: #222222; position: absolute; top: 0; right: 0.3125rem; } .allMenu_mo_wrap .depth_2 .cross::before { transform-origin: center; -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } .allMenu_mo_wrap .depth_2 .wrap_s > li:last-child .depth_box a { border-bottom: 0; } .allMenu_mo_wrap .depth_2 .wrap_s > li.on > .depth_box > a { color: #ef7a00; } .allMenu_mo_wrap .depth_2 .wrap_s > li.on > .depth_box > a._unfold .cross::before, .allMenu_mo_wrap .depth_2 .wrap_s > li.on > .depth_box > a._unfold .cross::after { background-color: #ef7a00; } .allMenu_mo_wrap .depth_2 .wrap_s > li.on > .depth_box > a._unfold .cross::before { transform: none; } .allMenu_mo_wrap .depth_3 { display: none; padding-left: 2.50182rem; padding-right: 2.50182rem; } .allMenu_mo_wrap .depth_3 > li { height: 5.62909rem; position: relative; } .allMenu_mo_wrap .depth_3 a { position: absolute; top: 50%; left: 0; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .allMenu_mo_wrap .etc_menu { padding: 1.25091rem 0; font-size: 1.25091rem; line-height: 2.87709rem; font-weight: 500; } .allMenu_mo_wrap .etc_menu > a { display: inline-block; vertical-align: top; padding-right: 1.25091rem; margin-right: 1.25091rem; position: relative; height: 2.752rem; } .allMenu_mo_wrap .etc_menu > a.m_bar::after { content: ''; display: block; height: 0.87564rem; border-right: 1px solid #ffb64e; position: absolute; top: 50%; right: 0; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .allMenu_mo_wrap .etc_menu > .gretting { display: inline-block; vertical-align: top; color: #ffebd6; font-size: 0.83333em; } @media all and (max-width: 1280px) { .allMenu_mo_wrap .etc_menu { font-size: 1.50109rem; } } .allMenu_mo_wrap .amm_bottom::after { content: ''; display: block; clear: both; } .allMenu_mo_wrap .amm_bottom > a { display: block; float: left; text-align: center; width: 50%; font-size: 1.87636rem; padding-top: 1.68873rem; padding-bottom: 1.68873rem; padding-left: 0.62545rem; padding-right: 0.62545rem; color: #ffffff; } .allMenu_mo_wrap .amm_bottom > a.__privacy { background-color: #1f2c5c; } .allMenu_mo_wrap .amm_bottom > a.__terms { background-color: #26397d; } .allMenu_mo_wrap .amm_right { position: absolute; top: 2.31418rem; right: 1.25rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .allMenu_mo_wrap .amm_close { top: auto; right: auto; position: relative; width: 4.375rem; height: 4.375rem; } .allMenu_mo_wrap .search_area { background-color: #fff; border-radius: 1.14286em; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 1.50109rem; color: #999999; padding: 0.57143em 0.85714em; letter-spacing: -.35px; line-height: 1; white-space: nowrap; margin-right: 0.71429em; } .allMenu_mo_wrap .search_area::after { content: ''; display: block; vertical-align: top; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14.001' height='14' viewBox='0 0 14 14'%3E%3Cpath fill='%23EF7A00' d='M13.7,12.3l-2.8-2.8C11.6,8.5,12,7.3,12,6c0-3.3-2.7-6-6-6S0,2.7,0,6s2.7,6,6,6c1.3,0,2.5-0.4,3.5-1.1l2.8,2.8 L13.7,12.3z M6,10c-2.2,0-4-1.8-4-4c0-2.2,1.8-4,4-4c2.2,0,4,1.8,4,4C10,8.2,8.2,10,6,10z'/%3E%3C/svg%3E%0A"); width: 1em; height: 1em; margin-left: 0.42857em; margin-top: -1px; background-size: 100% auto; background-position: center; background-repeat: no-repeat; } .allMenu_mo_wrap .amm_logo { width: 100%; padding: 3.37745rem 0 2.00145rem; border-bottom: 1px solid #ffb64e; } .allMenu_mo_wrap .amm_logo > a { display: block; width: 16.88727rem; } .allMenu_mo_wrap .amm_logo img { width: 100%; vertical-align: top; } .allMenu_mo_wrap .allMenu_mo { overflow-y: auto; overflow-x: hidden; } /*sub_visual*/ .sub_visual { position: relative; background: #dddddd no-repeat center center; background-size: cover; height: 31.25rem; } .sub_visual > .wrap { height: 100%; margin-left: auto; margin-right: auto; overflow: hidden; } .sub_visual .sv_text_box { position: absolute; width: 100%; top: 40%; text-align: center; padding-top: 13.5%; color: #ffffff; -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); -moz-transition: top 0.5s, opacity 0.5s; -webkit-transition: top 0.5s, opacity 0.5s; -ms-transition: top 0.5s, opacity 0.5s; -o-transition: top 0.5s, opacity 0.5s; transition: top 0.5s, opacity 0.5s; } .sub_visual .sv_text_box .tit_sp { font-size: 1rem; letter-spacing: 0.50em; text-transform: capitalize; } .sub_visual .sv_text_box .tit { font-size: 3.3125rem; position: relative; margin-bottom: 0.9375rem; line-height: 1.25; font-weight: bold; text-transform: capitalize; margin-top: 0.875rem; } @media all and (max-width: 800px) { .sub_visual .sv_text_box .tit { line-height: 1.2; } } .sub_visual .sv_text_box.on { top: 50%; opacity: 1; } .sub_visual.st_1 { background-image: url("../images/sub/sub_visual_1.jpg?v=0.2"); } .sub_visual.st_2 { background-image: url("../images/sub/sub_visual_2.jpg"); } .sub_visual.st_3 { background-image: url("../images/sub/sub_visual_3.jpg"); } .sub_visual.st_4 { background-image: url("../images/sub/sub_visual_4.jpg"); } .sub_visual.st_5 { background-image: url("../images/sub/sub_visual_5.jpg"); } .sub_visual.st_6 { background-image: url("../images/sub/sub_visual_6.jpg"); } .sub_visual.st_7 { background-image: url("../images/sub/sub_visual_7.jpg"); } .sub_visual.st_8 { background-image: url("../images/sub/sub_visual_8.jpg"); } .sub_visual.st_9 { background-image: url("../images/sub/sub_visual_9.jpg"); } .sub_visual.st_10 { background-image: url("../images/sub/sub_visual_10.jpg"); } .sub_visual.st_11 { background-image: url("../images/sub/sub_visual_11.jpg"); } .sub_visual.st_12 { background-image: url("../images/sub/sub_visual_12.jpg"); } .sub_visual.st_13 { background-image: url("../images/sub/sub_visual_13.jpg"); } .sub_visual.st_14 { background-image: url("../images/sub/sub_visual_14.jpg"); } .sub_visual.st_15 { background-image: url("../images/sub/sub_visual_15.jpg"); } .sub_visual.st_16 { background-image: url("../images/sub/sub_visual_16.jpg"); } .sub_visual.st_17 { background-image: url("../images/sub/sub_visual_17.jpg"); } .sub_visual.st_18 { background-image: url("../images/sub/sub_visual_18.jpg"); } .sub_visual.st_19 { background-image: url("../images/sub/sub_visual_19.jpg"); } .sub_visual.st_20 { background-image: url("../images/sub/sub_visual_20.jpg"); } @media all and (max-width: 800px) { .sub_visual { margin-top: 8.75636rem; height: 30rem; } .sub_visual > .wrap { height: 30rem; padding: 0; } .sub_visual .sv_text_box { padding-top: 2.5rem; top: 50%; padding: 0 2.5rem; } .sub_visual.st_1 { background-image: url("../images/sub/sub_visual_1_m.jpg?v=0.2"); } .sub_visual.st_2 { background-image: url("../images/sub/sub_visual_2_m.jpg"); } .sub_visual.st_3 { background-image: url("../images/sub/sub_visual_3_m.jpg"); } .sub_visual.st_4 { background-image: url("../images/sub/sub_visual_4_m.jpg"); } .sub_visual.st_5 { background-image: url("../images/sub/sub_visual_5_m.jpg"); } .sub_visual.st_6 { background-image: url("../images/sub/sub_visual_6_m.jpg"); } .sub_visual.st_7 { background-image: url("../images/sub/sub_visual_7_m.jpg"); } .sub_visual.st_8 { background-image: url("../images/sub/sub_visual_8_m.jpg"); } .sub_visual.st_9 { background-image: url("../images/sub/sub_visual_9_m.jpg"); } .sub_visual.st_10 { background-image: url("../images/sub/sub_visual_10_m.jpg"); } .sub_visual.st_11 { background-image: url("../images/sub/sub_visual_11_m.jpg"); } .sub_visual.st_12 { background-image: url("../images/sub/sub_visual_12_m.jpg"); } .sub_visual.st_13 { background-image: url("../images/sub/sub_visual_13_m.jpg"); } .sub_visual.st_14 { background-image: url("../images/sub/sub_visual_14_m.jpg"); } .sub_visual.st_15 { background-image: url("../images/sub/sub_visual_15_m.jpg"); } .sub_visual.st_16 { background-image: url("../images/sub/sub_visual_16_m.jpg"); } .sub_visual.st_17 { background-image: url("../images/sub/sub_visual_17_m.jpg"); } .sub_visual.st_18 { background-image: url("../images/sub/sub_visual_18_m.jpg"); } .sub_visual.st_19 { background-image: url("../images/sub/sub_visual_19_m.jpg"); } .sub_visual.st_20 { background-image: url("../images/sub/sub_visual_20_m.jpg"); } } @media all and (max-width: 501px) { .sub_visual .sv_text_box { padding-top: 3.75rem; padding: 0 2.5rem; } } /*sub share location_nav*/ .location_nav { font-size: 1.125rem; font-weight: 300; height: 4.44444em; border-bottom: 1px solid #dddddd; padding-left: 2.25rem; } .location_nav ul li { display: inline-block; position: relative; vertical-align: middle; letter-spacing: -0.030em; } .location_nav ul li:first-child::before { display: none; } .location_nav ul li a { display: flex; align-items: center; justify-content: space-between; font-weight: 400; padding: 0.625em 1.66667em; } .location_nav .loc_ul { height: 100%; } .location_nav .loc_ul > li { height: 100%; border-left: 1px solid #dddddd; display: flex; align-items: center; justify-content: center; } .location_nav .loc_ul > li:first-child { width: 5.125em; text-align: center; } .location_nav .loc_ul > li:last-child { border-right: 1px solid #dddddd; } .location_nav .loc_ul > li.on .loc_btn { color: #ef7a00; } .location_nav .loc_ul > li.on .loc_btn::after { color: #ef7a00; } .location_nav .loc_ul .iconFt_home { font-size: 1.5rem; } .location_nav .loc_btn span { width: 100%; height: 100%; display: flex; align-items: center; justify-content: space-between; font-weight: 400; padding: 0.625em 1.66667em; cursor: pointer; } .location_nav .loc_btn span::after { font-family: 'iconFont' !important; content: "\e920"; display: inline-block; vertical-align: middle; font-size: 0.625rem; } .location_nav .loc_btn1 { width: 15.77778em; } .location_nav .loc_btn2 { width: 16.22222em; } .location_nav .loc__ul { position: absolute; top: 4.9375rem; left: 0; background-color: #fff; width: 100%; border: 1px solid #ddd; border-top: 0; padding: 0.625rem 0; display: none; z-index: 50; } .location_nav .loc__ul li { width: 100%; } .location_nav .loc__ul li a::after { font-family: 'iconFont' !important; content: "\e91e"; display: none; vertical-align: middle; font-size: 0.875rem; position: relative; transform: rotate(-90deg); color: #ef7a00; } .location_nav .loc__ul li:hover a { color: #ef7a00; } .location_nav .loc__ul li:hover a::after { display: inline-block; } .mo_location { display: none; } @media all and (max-width: 1280px) { .location_nav { font-size: 1.625rem; } } @media all and (max-width: 1280px) { .location_nav { padding-left: 0; } .location_nav .loc_ul li { width: 100%; } .location_nav .loc_ul li:last-child { border: 0; } .location_nav .loc_ul > li:not(.act_mo_li) { display: none; } .location_nav .loc_btn2 { width: 100%; text-align: center; } .location_nav .loc_btn2 span { display: block; position: relative; } .location_nav .loc_btn2 span::after { position: absolute; right: 2.5rem; top: 50%; transform: translateY(-50%); } .location_nav .loc__ul { top: 7.375rem; } .location_nav { display: none !important; } .mo_location { display: block; font-size: 1.625rem; padding-left: 0; border-bottom: 1px solid #dddddd; background: #fff; position: relative; z-index: 500; } .mo_location a { height: 5.62909rem; position: relative; text-align: center; display: table; width: 100%; font-weight: 400; } .mo_location a > span { display: table-cell; vertical-align: middle; } .mo_location a.mo_no_link { position: relative; } .mo_location a.mo_no_link::after { content: ""; position: absolute; right: 2.5rem; width: 1.12582rem; height: 1.12582rem; top: 50%; transform: translateY(-50%); display: inline-block; vertical-align: middle; font-size: 0.625rem; background: no-repeat center center; background-size: contain; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18'%3E%3Cpath d='M18 10L10 10 10 18 8 18 8 10 0 10 0 8 8 8 8 0 10 0 10 8 18 8 18 10Z' fill='rgb(34, 34, 34)'/%3E%3C/svg%3E"); } .mo_location li.on > .mo_no_link { color: #ef7a00; } .mo_location li.on > .mo_no_link::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='2'%3E%3Cpath d='M0 0L18 0 18 2 0 2 0 0Z' fill='rgb(245, 129, 8)'/%3E%3C/svg%3E"); } .mo_location ul { border-top: 1px solid #dddddd; display: none; } .mo_location ul li { display: table; width: 100%; border-bottom: 1px solid #dddddd; } .mo_location ul li:last-child { border: 0; } .mo_location ul li > ul { background: #f5f5f5; } .mo_location > a { width: 100%; text-align: center; height: 5.62909rem; display: block; position: relative; text-align: center; overflow: hidden; } .mo_location > a span { position: absolute; width: 100%; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); display: block; } .mo_location > a span::after { position: absolute; right: 2.5rem; top: 50%; transform: translateY(-50%); font-family: 'iconFont' !important; content: "\e90b"; display: inline-block; vertical-align: middle; font-size: 0.625rem; } .mo_location > a.on { color: #ef7a00; } .mo_location > ul { position: absolute; width: 100%; left: 0; min-height: 0; max-height: 31.27273rem; overflow-y: auto; top: 5.62909rem; background: #fff; box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1); z-index: 999; } } @media all and (max-width: 501px) { .mo_location > a span::after { font-size: 1rem; } } /*sub travel nav*/ .travel_nav { margin-bottom: 5rem; } .travel_nav li { color: #999999; text-align: center; display: flex; flex: 1 1; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; position: relative; line-height: 1.3; } .travel_nav li::before { content: ''; display: block; position: absolute; width: 100%; height: 0.0625rem; background-color: #ddd; left: 0; bottom: 0; } .travel_nav li:hover { color: #ef7a00; } .travel_nav li.on { color: #ef7a00; } .travel_nav li.on::before { height: 0.1875rem; background-color: #ef7a00; } .travel_nav li i { font-size: 3.75rem; } .travel_nav li a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 100%; height: 100%; padding-bottom: 1.6875rem; } .travel_nav li p { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; flex: 1 1; width: 100%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: center; padding-left: 0.5rem; padding-right: 0.5rem; } .travel_nav li:not(:last-child) p { position: relative; } .travel_nav li:not(:last-child) p::after { content: ''; display: block; width: 0.0625rem; height: 1rem; background-color: #ddd; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } @media all and (max-width: 1280px) { .travel_nav { margin-bottom: 5rem; } .travel_nav li { height: 9.1875rem; } } /*sub travel nav*/ /*sub session checkbox*/ .session_chk { padding: 0 1.875rem; border: 1px solid #DDD; border-radius: 5px; color: #222; } .session_chk .session_chk_tit { display: flex; justify-content: space-between; padding: 1rem 0; align-items: center; font-weight: 700; line-height: 1.5rem; letter-spacing: -0.5px; } .session_chk .session_chk_tit button { width: 2.625rem; height: 2.625rem; background-image: url("data:image/svg+xml,%3Csvg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='plus'%3E%3Cpath id='Ellipse' d='M24 48C37.2548 48 48 37.2548 48 24C48 10.7452 37.2548 0 24 0C10.7452 0 0 10.7452 0 24C0 37.2548 10.7452 48 24 48Z' fill='%23F5F5F5'/%3E%3Cpath id='ic_plus' d='M23 33V25H15V23H23V15H25V23H33V25H25V33H23Z' fill='%23222222'/%3E%3C/g%3E%3C/svg%3E%0A"); background-size: cover; transition: background-image .2s; } .session_chk.on .session_chk_tit button { background-image: url("data:image/svg+xml,%3Csvg width='42' height='42' viewBox='0 0 42 42' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='close'%3E%3Cpath id='Ellipse' d='M21 42C32.598 42 42 32.598 42 21C42 9.40202 32.598 0 21 0C9.40202 0 0 9.40202 0 21C0 32.598 9.40202 42 21 42Z' fill='%23222222'/%3E%3Cpath id='ic_minus' d='M26 20H16V22H26V20Z' fill='white'/%3E%3C/g%3E%3C/svg%3E%0A"); } .session_chk_cnt { padding: 1rem 0 1.875rem; } .chk_cnt_close_btn { display: none; position: absolute; top: 4rem; right: 1.5rem; } .chk_cnt_close_btn button { width: 2.5rem; height: 2.5rem; background-image: url("data:image/svg+xml,%3Csvg width='29' height='29' viewBox='0 0 29 29' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='X_Btn'%3E%3Cpath id='Rectangle 735' d='M1.41492 0L28.288 26.8889L26.874 28.304L0.000976562 1.41602L1.41492 0Z' fill='white'/%3E%3Cpath id='Rectangle 735 copy' d='M26.8729 0L28.287 1.41504L1.41394 28.303L0 26.8879L26.8729 0Z' fill='white'/%3E%3C/g%3E%3C/svg%3E%0A"); background-position: center; background-repeat: no-repeat; background-size: cover; } .session_chk_cnt h4 { margin-bottom: 1.25rem; font-weight: 700; line-height: 1.5rem; letter-spacing: -0.5px; } .session_chk_cnt ul { display: flex; flex-direction: column; gap: 2.5rem; } .total_group { display: flex; flex-wrap: wrap; gap: 0.625rem 1.125rem; } .total_group label { display: flex; cursor: pointer; } .total_group input { margin: 0; } .total_group span { display: flex; align-items: center; gap: 0.5rem; font-weight: 300; line-height: normal; text-wrap: nowrap; } .total_group span:before { content: ''; display: block; width: 1.5rem; height: 1.5rem; border: 1px solid #DDD; border-radius: 0.25rem; } .total_group input:checked+span:before { border: 1px solid #EF7A00; background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='check'%3E%3Cg id='off'%3E%3Crect id='bx' x='0.5' y='0.5' width='23' height='23' rx='2.5' fill='white' stroke='%23DDDDDD'/%3E%3C/g%3E%3Cg id='on'%3E%3Crect id='bx_2' width='24' height='24' rx='3' fill='%23EF7A00'/%3E%3Cpath id='check_2' d='M7.74512 12.108L10.9142 15.433L17.2522 8.78394' stroke='white' stroke-width='2.164' stroke-miterlimit='10'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A"); background-size: cover; background-position: center; background-repeat: no-repeat; } .session_chk_btn { display: flex; justify-content: center; align-items: center; gap: 1.25rem; margin-top: 2.5rem; } .session_chk_btn button { display: flex; justify-content: center; align-items: center; gap: 0.3125rem; width: 12.5rem; height: 3.375rem; background-color: #FFF; border: 1px solid #EF7A00; border-radius: 1.6875rem; color: #EF7A00; font-weight: 700; line-height: normal; letter-spacing: 0.16px; } .session_chk_btn button:last-of-type { background-color: #EF7A00; color: #FFF; } @media all and (max-width: 800px) { .session_chk .session_chk_tit button { transition: all 0s; } .session_chk_cnt { display: none; flex-direction: column; position: fixed; top: 0; bottom: 0; right: 0; left: 0; padding: 4rem 5rem 8rem 4rem; width: 100vw; height: 100vh; background-color: rgba(0, 0, 0, 0.7); z-index: 10000; } .session_chk.on .session_chk_cnt { display: flex; } .chk_cnt_close_btn { display: block; } .session_chk_cnt ul { padding-bottom: 5rem; width: 100%; height: 100%; background-color: #FFF; border-radius: 0.5rem 0.5rem 0 0; overflow-y: auto; } .session_chk_cnt ul:before { content: 'Select and view category of your choice!'; display: block; padding: 1.375rem 1.5rem; background-color: #EF7A00; color: #FFF; font-size: 2rem; } .session_chk_cnt ul li { padding: 0 1.5rem; } .total_group span { padding: 0.5rem 1rem; background-color: #FFECF2; border-radius: 0.375rem; } .cate_d .total_group span {background-color: #FFF5D9;} .cate_s .total_group span {background-color: #DEF6FA;} .cate_t .total_group span {background-color: #FFF0EB;} .cate_l .total_group span {background-color: #ECECEC;} .total_group input:checked+span { background-color: #E11D5F; color: #FFF; } .cate_d .total_group input:checked+span {background-color: #F4B907;} .cate_s .total_group input:checked+span {background-color: #00B5CD;} .cate_t .total_group input:checked+span {background-color: #F45420;} .cate_l .total_group input:checked+span {background-color: #989898;} .total_group span:before { display: none; } .session_chk_btn { margin-top: 0; gap: 0; border-top: 1px solid #EF7A00; border-radius: 0 0 0.5rem 0.5rem; overflow: hidden; } .session_chk_btn button { width: 50%; height: 8rem; border: 0; border-radius: 0; } } /*sub session checkbox*/ /*sub session vod popup*/ .session_pop { display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100vw; height: calc(100vh + 1px); background-color: rgba(0, 0, 0, 0.7); z-index: 9999; } .session_pop.on { display: block; } .session_pop .video_box { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 800px; width: 100%; } .session_pop .video_box:before { content: ''; display: block; padding-top: 56.25%; } .session_pop .video_box iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .session_pop .pop_close_btn { position: absolute; top: 0; right: -3.125rem; width: 1.875rem; height: 1.875rem; background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='ic_btn_close'%3E%3Cg id='btn_close'%3E%3Cpath id='Rectangle 735' d='M2.41394 1L29.287 27.87L27.873 29.284L1 2.414L2.41394 1Z' fill='white'/%3E%3Cpath id='Rectangle 735 copy' d='M27.8719 1L29.286 2.414L2.41296 29.284L0.999023 27.87L27.8719 1Z' fill='white'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A"); background-position: center; background-size: cover; background-repeat: no-repeat; } @media all and (max-width: 1080px) { .session_pop .video_box { max-width: 750px; } .session_pop .pop_close_btn { right: -2.125rem; } } @media all and (max-width: 800px) { .session_pop .pop_close_btn { width: 2.5rem; height: 2.5rem; top: -3.125rem; right: 1rem; } } /*sub session vod popup*/ /*sub session evaluation popup*/ .session_pop.evaluation { padding: 5rem 0; } .session_pop .evaluation_box { position: absolute; left: 50%; transform: translateX(-50%); max-width: 800px; width: 100%; height: calc(100% - 10rem); } .session_pop .evaluation_box form { width: 100%; height: 100%; } .session_pop .session_evaluation { margin: 0 auto; width: 100%; height: 100%; border-radius: 0.3125rem; overflow: hidden; } .session_pop .session_evaluation h1 { padding: 0 1.66667rem; background: #EF7A00; color: #FFF; font-size: 1.5rem; font-weight: 700; height: 4.625rem; line-height: 4.625rem; letter-spacing: -0.6px; } .session_pop .contents { padding: 1.25rem 1.25rem 1.25rem 2.5rem; padding-right: 1.25rem; background: #FFF; color: #222; height: calc(100% - 9.25rem); } .session_pop .contents .scroll { padding: 1.25rem 1.25rem 3.75rem 0; width: 100%; height: 100%; overflow-y: auto; } .session_pop .contents .scroll::-webkit-scrollbar { width: 3px; } .session_pop .contents .scroll::-webkit-scrollbar-thumb { background: #999; border-radius: 3px; } .session_pop .contents .scroll::-webkit-scrollbar-track { background: #EEE; } .session_pop .contents .ex { display: flex; flex-direction: column; gap: 10px; padding: 2.5rem; background: #F5F5F5; font-size: 18px; font-weight: 400; line-height: 34px; } .session_pop .quiz { display: flex; flex-direction: column; gap: 40px; margin-top: 40px; } .session_pop .quiz h3 { margin-bottom: 20px; font-size: 24px; font-weight: 700; line-height: normal; letter-spacing: -0.6px; } .session_pop .quiz_list { position: relative; } .session_pop .quiz_list_inner { overflow-x: auto; -webkit-overflow-scrolling: touch; } .session_pop .quiz_list_head, .session_pop .quiz_list_body { display: flex; align-items: center; } .session_pop .quiz_list_body { } .session_pop .quiz_list_body + .quiz_list_body { margin-top: 15px; } .session_pop .quiz_list_body .quiz_list_row { background-color: #F5F5F5; } .session_pop .quiz_list_row { display: flex; align-items: center; flex: 1; } .session_pop .quiz_cell { flex: 1; width: 60px; } .session_pop .quiz_cell_head { text-align: center; font-size: 18px; font-weight: 300; line-height: normal; letter-spacing: -0.9px; } .session_pop .quiz_cell_empty { flex: none; width: 225px; height: 45px; } .session_pop .quiz_cell_empty span { display: block; position: absolute; left: 0; z-index: 10; width: 225px; height: 45px; } .session_pop .quiz_cell_empty span:before { content: ''; background-color: #FFF; position: absolute; right: 0; left: 0; top: 0; bottom: 0; z-index: -1; } .session_pop .quiz_row_head { width: 225px; height: 74px; } .session_pop .quiz_row_head span { padding: 0 25px; width: 225px; height: 74px; line-height: 74px; position: absolute; left: 0; font-size: 16px; letter-spacing: -0.4px; z-index: 10; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .session_pop .quiz_row_head span:before { content: ''; background-color: #F5F5F5; position: absolute; right: 0; left: 0; top: 0; bottom: 0; z-index: -1; } .session_pop .quiz_cell label { display: flex; justify-content: center; align-items: center; padding: 12px 0; cursor: pointer; } .session_pop .quiz_cell label input { position: absolute; left: 0; clip: rect(0, 0, 0, 0); width: 1px; height: 1px; margin: -1px; overflow: hidden; } .session_pop .quiz_cell label span { position: relative; display: block; width: 24px; height: 24px; border: 1px solid #DDD; border-radius: 50%; background-color: #FFF; } .session_pop .quiz_cell label input:checked + span:before { content: ''; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 12px; height: 12px; background-color: #EF7A00; border-radius: 50%; } .session_pop ._etc { padding-bottom: 160px; } .session_pop ._etc .etc_area { display: block; } .etc_area { display: none; position: absolute; left: 0; transform: translateY(calc(50% + 37px)); padding: 10px 25px 25px; width: 100%; height: 160px; background-color: #F5F5F5; } .quiz textarea { display: block; padding: 15px; width: 100%; height: 100%; border: none; outline: none; resize: none; font-size: 16px; line-height: 24px; letter-spacing: -0.4px; } .session_pop .quiz .subjective { margin-top: 30px; padding: 25px; width: 100%; height: 160px; background-color: #F5F5F5; } .session_pop .submit_btn { width: 100%; height: 4.625rem; background: #EF7A00; color: #FFF; font-size: 1.5rem; font-weight: 700; line-height: 4.625rem; letter-spacing: -0.6px; } @media all and (max-width: 600px) { .session_pop .contents .ex { font-size: 16px; line-height: 26px; } .session_pop .quiz { margin-top: 30px; gap: 30px; } .session_pop .quiz h3 { margin-bottom: 10px; font-size: 20px; } .session_pop .quiz_cell_empty { width: 160px; height: 40px; } .session_pop .quiz_cell_empty span { width: 160px; height: 40px; } .session_pop .quiz_cell_head { font-size: 16px; letter-spacing: -1.2px; } .session_pop .quiz_list_body + .quiz_list_body { margin-top: 10px; } .session_pop .quiz_row_head { width: 160px; height: 50px; } .session_pop .quiz_row_head span { padding: 0 10px; width: 160px; height: 50px; line-height: 50px; font-size: 14px; letter-spacing: -0.9px; } .session_pop .quiz_list_body.on .quiz_row_head span:before { border-right: 1px solid #DDD; } .session_pop ._etc { padding-bottom: 165px; } .etc_area { transform: translateY(calc(50% + 30px)); padding: 10px; } .quiz textarea { padding: 10px; font-size: 14px; line-height: 20px; letter-spacing: -0.9px; } .session_pop .quiz .subjective { margin-top: 20px; padding: 10px; } } /*sub session evaluation popup*/ /*sub session survey popup*/ .session_pop.survey { padding: 5rem 0; } .session_pop .survey_box { position: absolute; left: 50%; transform: translateX(-50%); max-width: 900px; width: 100%; height: calc(100% - 10rem); } .session_pop .survey_box form { width: 100%; height: 100%; } .session_pop .session_survey { margin: 0 auto; width: 100%; height: 100%; border-radius: 0.3125rem; overflow: hidden; } .session_pop .session_survey h1 { padding: 0 1.66667rem; background: #EF7A00; color: #FFF; font-size: 1.5rem; font-weight: 700; height: 4.625rem; line-height: 4.625rem; letter-spacing: -0.6px; text-align: center; } .session_pop .session_survey h2 { display: flex; justify-content: space-between; align-items: center; gap: 1.875rem; margin: 2.5rem 0; color: #EF7A00; text-align: center; font-style: normal; font-weight: 700; line-height: normal; letter-spacing: -0.6px; text-wrap: nowrap; } .session_pop .session_survey .contents .ex { font-size: 1.125rem; line-height: 1.8; } .session_pop .session_survey h2 p { flex-grow: 1; height: 2px; background-color: #EF7A00; } .session_pop .session_survey h2 span { max-width: 100%; line-height: 1; text-wrap: wrap; word-break: keep-all; } .session_pop .session_survey .survey_list { display: flex; flex-direction: column; gap: 2.5rem; } .session_pop .session_survey .survey_list .items .point { display: flex; justify-content: flex-end; padding: 0.625rem 0; } .session_pop .session_survey .survey_list .items .point ul { display: flex; align-items: center; width: 60%; } .session_pop .session_survey .survey_list .items .point ul li { width: 16.666% !important; text-align: center; color: #555; font-style: normal; font-weight: 700; line-height: normal; letter-spacing: -0.7px; } .session_pop .session_survey .survey_list .items .item_list { display: flex; flex-direction: column; gap: 1rem; } .session_pop .session_survey .survey_list .items .item_list .item { display: flex; align-items: center; background-color: #F5F5F5; border-radius: 5px; } .session_pop .session_survey .survey_list .items .item_list .item._ty2 { flex-direction: column; } .session_pop .session_survey .survey_list .items .item_list .item._ty2:first-of-type { margin-top: 0.625rem; } .session_pop .session_survey .survey_list .items .item_list .item .item_tit { display: flex; align-items: center; padding: 0.75rem 1.25rem; width: 40%; min-height: 4.625rem; color: #222; font-style: normal; font-weight: 400; line-height: normal; letter-spacing: -0.4px; } .session_pop .session_survey .survey_list .items .item_list .item .item_cnt { width: 60%; } .session_pop .session_survey .survey_list .items .item_list .item._ty2 > div { width: 100%; } .session_pop .session_survey .survey_list .items .item_list .item .item_cnt .option { display: none; align-items: center; padding: 1rem 0 0.625rem; } .session_pop .session_survey .survey_list .items .item_list .item .item_cnt .option p { width: 16.666%; text-align: center; line-height: 1.15; } .session_pop .session_survey .survey_list .items .item_list .item .item_cnt .inp_box { display: flex; align-items: center; } .session_pop .session_survey .survey_list .items .item_list .item .item_cnt .inp_box label { display: flex; justify-content: center; align-items: center; position: relative; width: 16.666%; } .session_pop .session_survey .survey_list .items .item_list .item .item_cnt .inp_box label input { position: absolute; left: 0; top: 0; width: 0; height: 0; } .session_pop .session_survey .survey_list .items .item_list .item .item_cnt .inp_box label span { position: relative; display: block; width: 1.5rem; height: 1.5rem; border-radius: 50%; border: 1px solid #DDD; background-color: #FFF; } .session_pop .session_survey .survey_list .items .item_list .item .item_cnt .inp_box label input:checked + span:after { content: ''; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 50%; height: 50%; border-radius: 50%; background-color: #EF7A00; } .session_pop .session_survey .survey_list .items .item_list .item .item_cnt .text_box { padding: 0.625rem 1.25rem 1.25rem; } .session_pop .session_survey .survey_list .items .item_list .item .item_cnt .text_box textarea { padding: 1rem; width: 100%; height: 8rem; background-color: #FFF; border: 0; outline: none; resize: none; color: #222; } @media all and (max-width: 1280px) { .session_pop .session_survey .contents .ex { font-size: 1.5rem; line-height: 1.6; } .session_pop .session_survey .contents .ex span { font-size: 1.25rem; } .session_pop .session_survey .survey_list .items .item_list .item .item_cnt .inp_box label span { width: 2.25rem; height: 2.25rem; } } @media all and (max-width: 800px) { .session_pop .session_survey .survey_list h4 { margin-bottom: 1.875rem; } .session_pop .session_survey .survey_list .items .point { display: none; } .session_pop .session_survey .survey_list .items .item_list { gap: 2.5rem; } .session_pop .session_survey .survey_list .items .item_list .item { flex-direction: column; } .session_pop .session_survey .survey_list .items .item_list .item._ty2:first-of-type { margin-top: 0; } .session_pop .session_survey .survey_list .items .item_list .item > div { width: 100% !important; } .session_pop .session_survey .survey_list .items .item_list .item:not(._ty2) .item_cnt { background-color: #FFF; } .session_pop .session_survey .survey_list .items .item_list .item .item_cnt .option { display: flex; } } /*sub session survey popup*/