@charset "utf-8"; #wrap .btn_center_box button :where(strong, em) { font-size: inherit; font-weight: inherit; color: inherit; padding: 0; background: none; } #wrap .btn_right_box { display: flex; justify-content: flex-end; gap: var(--row-gap10); margin: 15px 0 0; } #wrap .btn_right_box:not(:has(*)) { display: none; } #wrap .btn_right_box :where(button, a) { position: relative; inset: auto; display: flex; align-items: center; justify-content: center; text-align: center; font-size: var(--text-15); font-weight: 500; color: var(--point-white); line-height: 1.33; width: auto; height: auto; padding: 10px 18px 9px; background: var(--point-color01); border: var(--point-color01); border-radius: var(--radius-06); letter-spacing: 0; } #wrap .btn_right_box :where(button, a) :where(strong, em) { font-size: inherit; font-weight: inherit; color: inherit; padding: 0; background: none; } #wrap .btn_right_box.top { margin-block: 0 15px; } #wrap .location_wrap { display: none; } /* #wrap .sub_top{display: none;} */ #wrap .page_btn_box { margin: 30px 0 0; text-align: center; display: flex; justify-content: center; flex-wrap: wrap; gap: 15px; } #wrap .page_btn_box button { position: relative; width: 20px; aspect-ratio: auto 1; height: auto; border: 0; font-size: 0; background: url('ca9afd316da45862c5113cee.svg') no-repeat center / auto 10px; } #wrap .page_btn_box .next_btn { scale: -1 -1; } #wrap .page_btn_box .page_number { font-size: var(--text-18); color: var(--gray-bg05); line-height: 1.5; height: auto; padding: 0; } #wrap .page_btn_box .page_number strong { font-weight: 700; color: var(--black-color13); } #wrap .rating_star { position: relative; background: url('2547838c35cba7863974f218.svg') no-repeat 0 0 / auto 100%; width: 70px; height: auto; aspect-ratio: auto 6.23; font-size: 0; display: inline-flex; } #wrap .rating_star span { display: block; height: 100%; background: url('3870d22d4b6934ba575a6181.svg') no-repeat 0 0 / auto 100%; } #wrap [type="checkbox"]+label { position: relative; inset: auto; min-width: auto; min-height: auto; padding: 0; background: none; display: inline-flex; align-items: flex-start; gap: 10px; font-size: var(--text-15); font-weight: 400; color: var(--black-color03); line-height: 18px; letter-spacing: -0.03em; cursor: pointer; } #wrap [type="checkbox"]:has(+ label) { position: relative; inset: auto; z-index: unset; visibility: unset; width: 18px; height: 18px; border: 1px solid var(--border-color02); border-radius: var(--radius-04); background: var(--point-white); appearance: none; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; margin-right: 5px; } #wrap [type="checkbox"]:has(+ label):disabled { background: var(--gray-bg01); } #wrap [type="checkbox"]:has(+ label)::before { display: inline-flex; content: ''; width: 12px; aspect-ratio: auto 1.33; background: url('e5085dcb25c7ba6901c5c179.svg') no-repeat center / 100% auto; } #wrap [type="checkbox"]:has(+ label):checked { border-color: var(--black-color13); background: var(--black-color13); } #wrap [type="checkbox"]:has(+ label):checked::before { opacity: 1; filter: var(--filter-white); } /* 갤러리 게시판 */ #wrap .board_zone_tit { position: relative; margin: 0 0 20px; padding: 0; text-align: center; } #wrap .board_zone_tit.left { text-align: left; margin-bottom: 15px; } #wrap .board_zone_tit h2 { font-size: var(--text-40); font-weight: 600; color: var(--black-color00); line-height: 1.3; } #wrap .board_zone_tit h3 { font-size: var(--text-22); font-weight: 600; color: var(--black-color00); line-height: 1.4; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 15px 30px; border: 0; padding: 0; } #wrap .board_zone_tit h3 a { display: flex; align-items: center; gap: 4px; font-size: var(--text-14); font-weight: 400; color: var(--black-color13); } #wrap .board_zone_tit h3 a::after { display: inline-flex; content: ''; width: 8px; aspect-ratio: auto 1; border: 1px solid var(--black-color13); clip-path: var(--clip-poly02); rotate: -45deg; } #wrap .board_list_gallery { position: relative; width: 100%; } #wrap .board_list_gallery>ul { position: relative; float: none; width: 100%; margin: 0; display: grid; grid: auto / repeat(2, 1fr); gap: 30px 15px; } #wrap .board_list_gallery>ul>li { position: relative; display: block; margin: 0; text-align: left; } #wrap .board_list_gallery .gallery_cont { padding: 0; display: flex; flex-direction: column; gap: 10px; height: 100%; } #wrap .board_list_gallery .board_img { position: relative; display: block; width: 100%; height: auto; min-height: auto; text-align: inherit; border: 0; padding: 0; overflow: hidden; aspect-ratio: auto 1.34; border-radius: var(--radius-20); } #wrap .board_list_gallery .board_img a { display: block; width: 100%; height: 100%; } #wrap .board_list_gallery .board_img img { width: 100%; height: 100%; object-fit: cover; } #wrap .board_list_gallery .gallery_info_cont { padding: 0; text-align: inherit; display: flex; flex-direction: column; justify-content: space-between; gap: 10px; flex-grow: 1; } #wrap .board_list_gallery .board_tit { margin: 0; text-align: inherit; font-size: var(--text-20); font-weight:600; color: var(--black-color13); line-height: 1.4; display: grid; gap: 2px; } #wrap .board_list_gallery .board_tit a { white-space: normal; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; } #wrap .board_list_gallery .board_tit .contents { font-size: var(--text-18); font-weight: 400; color: var(--black-color09); } #wrap .board_list_gallery .board_tit .contents:empty { display: none; } #wrap .board_list_gallery .board_tit strong { font-size:var(--text-28); font-weight: inherit; color: inherit; text-decoration: none; } #wrap .board_list_gallery .board_tit img { display: none; } #wrap .board_list_gallery .board_tit p { display: inline; } #wrap .board_list_gallery .board_name_day { margin: 0; font-size: var(--text-16); font-weight: 400; color: var(--black-color09); line-height: 1.6; } #wrap .board_list_gallery .board_name { display: none; } #wrap .board_list_gallery .board_day { font-size: inherit; font-weight: inherit; color: inherit; border: 0; height: auto; padding: 0; } #wrap .board_list_gallery .board_day span { inset: auto; } #wrap .board_list_gallery .board_likeit_hits { display: none; } /* 이벤트 */ #wrap .board_hot_list { padding: 0; margin: 0 0 25px; text-align: center; border: 0; } #wrap .board_hot_list>ul { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px 30px; } #wrap .board_hot_list>ul::after { display: none; } #wrap .board_hot_list>ul>li { display: inline-block; width: auto; height: auto; margin: 0; font-size: var(--text-22); font-weight: 600; color: var(--gray-bg05); line-height: 1.2; text-align: inherit; } #wrap .board_hot_list>ul>li.on { color: var(--black-color13); } #wrap .board_hot_list>ul>li>a { display: block; width: auto; height: auto; padding: 0; border: 0; } #wrap .board_hot_list>ul>li>a span { position: relative; inset: auto; font-size: inherit; font-weight: inherit; color: inherit; border: 0; } #wrap .event_list { width: 100%; } #wrap .event_list>ul { position: relative; display: grid; grid: auto / repeat(1, 1fr); gap: 30px 15px; } #wrap .event_list>ul>li { position: relative; display: block; width: 100%; margin: 0; text-align: inherit; } #wrap .event_list .event_cont { display: grid; gap: 15px; } #wrap .event_list .board_img { position: relative; display: block; width: 100%; height: auto; aspect-ratio: auto 1.692; text-align: inherit; border: 0; overflow: hidden; border-radius: var(--radius-24); } #wrap .event_list .board_img a { display: block; width: 100%; height: 100%; } #wrap .event_list .board_img img { width: 100%; height: 100%; object-fit: cover; } #wrap .event_list .event_info_cont { display: grid; gap: 10px; padding: 0;justify-items:start;} #wrap .event_list .event_info_cont .cate{display: inline-flex;align-items: center;justify-content: center;font-size: var(--text-20);color: var(--black-color13);font-weight: 500;padding: 0 10px;border: 1px solid var(--black-color13);border-radius: 50px;} #wrap .event_list .board_tit { display: block; margin: 0; text-align: inherit; font-size: var(--text-28); font-weight: 600; color: var(--black-color13); line-height: 1.1; } #wrap .event_list .board_tit a { white-space: normal; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; } #wrap .event_list .board_tit strong { display: block; overflow: visible; width: auto; font-size: inherit; font-weight: inherit; color: inherit; text-decoration: none; } #wrap .event_list .board_tit :where(br, span, img) { display: none; } #wrap .event_list .board_event_day { margin: 0; font-size: var(--text-20); font-weight: 500; color: var(--gray-bg04); } #wrap .event_list .board_event_day strong { display: none; } #wrap .event_list .board_likeit_hits { display: none; } /* 검색 */ #wrap .board_search_box { position: relative; margin: 20px 0 0; padding: 20px; border: 0; background: var(--gray-bg02); border-radius: var(--radius-20); text-align: inherit; display: flex; justify-content: center; } #wrap .board_search_box.top { margin-block: 0 20px; } #wrap .board_search_box form { position: relative; display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; width: fit-content; } #wrap .board_search_box #category_chosen { display: none; } #wrap .board_search_box .chosen-select { width: 100%; border-radius: 50px; min-width: auto; padding-inline: 15px 35px; border-color: var(--gray-bg05); flex-shrink: 0; } #wrap .board_search_box .chosen-container .chosen-single { height: 42px; border-radius: 50px; font-size: var(--text-17); border-color: var(--gray-bg05); color: var(--gray-bg05); } #wrap .board_search_box .chosen-container .chosen-single span { padding-inline: 24px 50px; } #wrap .board_search_box .chosen-container-single .chosen-single span:before { width: 16px; height: auto; aspect-ratio: auto 1.71; background-size: 100% auto; right: 22px; } #wrap .board_search_box [type="text"] { border-color: var(--gray-bg05); border-radius: 50px; width: 100%; padding-inline: 15px 50px; } #wrap .board_search_box .btn_board_search { position: absolute; width: 16px; height: 100%; top: 0; right: 15px; margin: 0; padding: 0; line-height: normal; font-size: 0; border: 0; background: url('ab54febaa83098db6623aa20.svg') no-repeat center / 100% auto; z-index: 1; } #wrap .board_search_box .inp-box { position: relative; width: 100%; } #wrap .no-data { text-align: center; font-size: var(--text-16); color: var(--black-color06); padding-block: 30px; } /* 게시판 상세 */ #wrap .board_zone_view { position: relative; padding-block: 20px; border-top: 1px solid var(--black-color13); border-bottom: 1px solid var(--border-color01); } #wrap .board_view_tit { overflow: visible; padding: 0 0 10px; margin: 0; border: 0; background: none; } #wrap .board_view_tit h3 { font-size: var(--text-26); font-weight: 500; color: var(--black-color13); line-height: 1.4; letter-spacing: 0; background: none; padding: 0; } #wrap .board_view_tit h3 br { display: none; } #wrap .board_view_tit h3 p { display: inline; } #wrap .board_view_tit strong { float: right; font-size: 14px; } #wrap .board_zone_view .board_view_info { overflow: visible; padding: 0 0 20px; font-size: var(--text-16); font-weight: 400; color: var(--black-color06); line-height: 1.6; border: 0; border-bottom: 1px solid var(--border-color01); display: flex; flex-wrap: wrap; align-items: center; } #wrap .board_zone_view .board_view_info :where(strong, em) { font-size: inherit; font-weight: inherit; color: inherit; } #wrap .board_view_info .view_info_idip { display: none; } #wrap .board_view_info .view_info_idip em { color: #acacac; font-size: 11px; } #wrap .board_view_info .view_info_day { display: inline-block; height: auto; margin: 0; border: 0; vertical-align: inherit; font-size: inherit; font-weight: inherit; color: inherit; } #wrap .board_view_info .view_info_day.event { font-size: var(--text-20); font-weight: 500; color: var(--gray-bg04); } #wrap .board_view_info .view_info_day em { position: relative; display: inline-block; inset: auto; padding: 0; } #wrap .board_view_info .view_info_hits { display: none; } #wrap:has(.board_view_qa) .board_view_info :where(.view_info_idip, .view_info_hits) { display: block; } #wrap:has(.board_view_qa) .board_view_info>span::after { display: inline-flex; content: ''; width: 1px; height: 8px; background: var(--border-color01); margin-inline: 10px; } #wrap:has(.board_view_qa) .board_view_info>span:last-child::after { display: none; } #wrap .board_view_attach { overflow: visible; padding: 15px; border: 0; display: flex; align-items: center; gap: 20px; font-size: var(--text-15); font-weight: 400; color: var(--black-color06); line-height: 1.33; background: var(--gray-bg02); border-radius: var(--radius-10); } #wrap .board_view_attach.dn{display: none;} #wrap .board_view_attach strong { position: relative; display: inline-block; padding: 0; background: none; font-size: inherit; font-weight: 500; color: var(--black-color03); width: 70px; flex-shrink: 0; padding-right: 15px; } #wrap .board_view_attach strong::after { position: absolute; content: ''; width: 1px; height: 12px; background: var(--border-color01); top: 50%; right: 0; translate: 0 -50%; } #wrap .board_view_attach .attach_list { display: grid; gap: 10px; font-size: inherit; font-weight: inherit; color: inherit; } #wrap .board_view_attach .attach_list a { padding: 0; text-decoration: none; } #wrap .board_zone_view .board_view_link { overflow: hidden; padding: 10px 15px 10px 15px; border-bottom: 1px solid #dbdbdb; } #wrap .board_view_content { min-height: auto; } #wrap .board_view_content .view_question_box { padding: 20px 0; display: flex; align-items: baseline; gap: 10px; } #wrap .board_view_content .view_question_box .seem_cont { padding: 0; } #wrap .board_view_content .view_question_tit { display: flex; align-items: center; justify-content: center; position: relative; inset: auto; min-width: 28px; min-height: 28px; width: auto; height: auto; font-size: var(--text-16); font-weight: 600; color: var(--point-color01); border-radius: 100%; background: var(--gray-bg02); text-align: center; flex-shrink: 0; padding: 2px; font-family: inherit; } #wrap .board_view_content .seem_cont { padding: 20px 0; font-size: var(--text-17); font-weight: 400; color: var(--black-color03); line-height: 1.8; } #wrap .board_view_content .seem_cont img { vertical-align: top; } #wrap .view_goods_select { margin: 0; } #wrap .view_goods_select_item { margin: 0; padding: 20px 0; font-size: 0; border-bottom: 1px solid var(--border-color01); display: flex; align-items: center; gap: 20px; } #wrap .view_select_item_img { display: inline-block; width: 80px; height: auto; aspect-ratio: auto 1; overflow: hidden; flex-shrink: 0; } #wrap .view_select_item_img a { display: block; width: 100%; height: 100%; } #wrap .view_select_item_img img { width: 100%; height: 100%; object-fit: cover; border: 0; } #wrap .view_select_item_info { position: relative; width: 100%; padding: 0; font-size: var(--text-17); font-weight: 500; color: var(--black-color03); line-height: 1.6; display: flex; flex-direction: column; gap: 7px; } #wrap .view_select_item_info em { display: block; font-weight: inherit; } #wrap .view_select_item_info .text_type_cont { display: block; padding: 3px 0 3px 0; color: #a9a9a9; font-size: 12px; line-height: 1; } #wrap .view_select_item_info>strong { display: block; padding: 0; font-size: inherit; font-weight: inherit; color: inherit; } #wrap .board_view_content .view_answer_box { padding: 20px 0; border-top: 1px solid var(--border-color01); display: grid; gap: 15px; } #wrap .board_view_content .view_answer_box .seem_cont { padding-block: 0; } #wrap .board_view_content .view_answer_info { margin: 0; padding: 0; display: flex; align-items: baseline; font-size: var(--text-17); font-weight: 400; color: var(--black-color13); line-height: 1.4; border: 0; gap: 10px; } #wrap .board_view_content .view_answer_tit { display: flex; align-items: center; justify-content: center; position: relative; inset: auto; min-width: 28px; min-height: 28px; width: auto; height: auto; font-size: var(--text-16); font-weight: 500; color: var(--point-white); border-radius: 100%; background: var(--point-color01); text-align: center; flex-shrink: 0; padding: 2px; padding-top: 3px; font-family: inherit; } #wrap .board_view_content .view_answer_exp { font-size: var(--text-16); font-weight: 400; color: var(--black-color06); line-height: 1.6; display: flex; align-items: center; flex-wrap: wrap; gap: 10px 0; } #wrap .board_view_content .view_answer_exp span::after { display: inline-flex; content: ''; width: 1px; height: 8px; background: var(--border-color01); margin-inline: 12px; } #wrap .board_view_content .view_answer_exp span:last-child::after { display: none; } #wrap .board_zone_sec .btn_center_box { margin-top: 25px; } #wrap .board_zone_sec .btn_center_box :is(button, a) { width: auto; min-width: 120px; background: var(--point-white); border-color: var(--gray-bg04); color: var(--black-color13); font-weight: 400; line-height: 1.4; } #wrap .board_zone_sec .btn_center_box :is(button, a) strong { font-weight: inherit; } #wrap .board_zone_sec .btn_center_box :is(button, a).btn_write_ok { background: var(--black-color13); border-color: var(--black-color13); color: var(--point-white); } /* 댓글 */ #wrap .board_view_comment:not(:has(.view_comment *)) { display: none; } #wrap .board_view_comment { padding: 0; margin: 40px 0 0; } #wrap .view_comment { padding: 0; border: 0; background: none; font-size: var(--text-14); } #wrap .view_comment_top { overflow: visible; padding: 0 0 15px; border-top: 0; border-bottom: 1px solid var(--black-color01); font-size: var(--text-15); font-weight: 400; color: var(--black-color13); } #wrap .view_comment_top .comment_num { padding: 0; } #wrap .view_comment_top .comment_num strong { font-weight: inherit; } #wrap .view_comment_top .comment_best_num { position: relative; } #wrap .view_comment_top .btn_view_comment_box { float: right; } #wrap .view_comment_top .rating_star_box { margin: 0 0 0 20px; } #wrap .view_comment_top .rating_star_box .rating_star { margin: -3px 0 0 5px; vertical-align: middle; } #wrap .view_comment_list { padding: 0; background: none; } #wrap .view_comment_list ul { border-top: 1px solid var(--border-color01); } #wrap .view_comment_list ul li { padding: 15px 0; border: 0; border-bottom: 1px solid var(--border-color01); } #wrap .view_comment_list ul li:last-child { padding-bottom: 0; border-bottom: 0; } #wrap .view_comment_list ul:not(:has(li)) { display: none; } #wrap .view_comment_list .comment_name { padding: 0; color: var(--black-color03); word-wrap: inherit; } #wrap .view_comment_list p { padding: 8px 0; display: grid; gap: 8px; } #wrap .view_comment_list p>em { display: block; padding: 0; } #wrap .view_comment_list .board_comment_box { margin: 15px 0 0 0; padding: 0; border: 0; border-top: 1px dotted var(--border-color01); } #wrap .view_comment_list p>em img { margin: 0 4px 0 2px; vertical-align: middle; } #wrap .view_comment_list .comment_reply { padding: 15px 0 15px 10px; } #wrap .view_comment_list .comment_reply .comment_name { padding: 0 20px 0 20px; background: url('https://m.torriden.com/data/skin/mobile/mo_designart/img/icon/board/icon_comment_reply.png') no-repeat 8px 4px; } #wrap .board_comment_box { padding: 10px 0; background: none; text-align: center; } #wrap .board_day_time { display: inline-block; padding: 0; color: #a1a1a1; font-size: var(--text-13); } #wrap .board_comment_write { position: relative; text-align: left; padding: 15px 0 0 0; } #wrap .board_comment_write input[type="text"] { width: 105px; margin-bottom: 10px; } #wrap .board_comment_write input[type="password"] { width: 152px; margin-bottom: 10px; } #wrap .board_comment_write .comment_textarea { position: relative; width: 100%; display: flex; } #wrap .board_comment_write textarea { display: inline-block; width: 100%; height: 82px; padding: 15px; padding-right: 95px; border: 1px solid var(--border-color01); resize: none; font-size: inherit; font-weight: inherit; color: inherit; } #wrap .board_comment_write .btn_comment_box { position: absolute; top: 0; right: 0; padding: 0; border: 0; background: var(--point-color01); width: 82px; height: 82px; } #wrap .board_comment_write .btn_comment_box button { display: flex; align-items: center; justify-content: center; text-align: center; width: 82px; height: 100%; background: none; padding: 0; border: 0; font-size: inherit; color: var(--point-white); } #wrap .view_comment_list .btn_gray_list { display: inline-block; } #wrap .view_comment_list .btn_gray_small { position: relative; background: var(--point-white); border: 1px solid var(--gray-bg04); font-size: var(--text-12); padding: 4px 10px 3px; display: inline-flex; align-items: center; justify-content: center; text-align: center; } #wrap .view_comment_list .btn_gray_small span { line-height: inherit; display: inline-block; padding: 0; } #wrap .capcha{margin-top:var(--row-gap30);} /* #wrap .capcha_img{display: flex;align-items: center;justify-content: center;width: 224px;height: 120px;border: 1px solid var(--border-color01);text-align:center;border-radius: var(--radius-06);padding: 15px;flex-shrink: 0;} */ #wrap .capcha .capcha_txt{display: flex;flex-direction: column;align-items: center;gap:var(--row-gap20);} #wrap .capcha_txt .btn_gray_list{display:block;margin: 4px 0 0 0;} #wrap .capcha_txt .btn_gray_list button{display: flex;align-items: center;justify-content: center;gap: 10px;text-align: center;font-size: var(--text-16);font-weight: 500;color: var(--black-color13);line-height: 1.2;padding: 0 18px;height: 40px;background: var(--point-white);border-radius: var(--radius-06);border: 1px solid var(--gray-bg04);} #wrap .capcha_txt .btn_gray_list button::before{display: inline-flex;content:'';width: 13px;aspect-ratio: auto 1;background: url('345ba34eb0d70ce704e4ff71.svg') no-repeat center / 100% auto;} #wrap .capcha_txt .btn_gray_list button span{line-height: inherit;padding: 0;} #wrap .capcha_txt .btn_gray_list button img{display: none;} /* 일반 게시판 */ #wrap .board_list_table { position: relative; margin: 0; border: 0; display: block; text-align: left; border-top: 1px solid var(--black-color13); } #wrap .board_list_table :where(tbody, tr, th, td) { display: block; width: 100%; border: 0; padding: 0; background: none; } #wrap .board_list_table :where(th, td) { font-size: var(--text-16); font-weight: 500; color: var(--black-color13); line-height: 1.4; } #wrap .board_list_table thead { display: none; } #wrap .board_list_table tr { display: flex; flex-wrap: wrap; gap: 8px 20px; padding-block: 15px; border-bottom: 1px solid var(--border-color01); } #wrap .board_list_table td { font-weight: 400; color: var(--black-color06); width: auto; } #wrap .board_list_table td.no { display: none; } #wrap .board_list_table td.bk { width: 100%; } #wrap .board_list_table td.no-data { width: 100%; } #wrap .board_list_table td strong { display: inline-block; text-decoration: none;font-size:var(--text-28);font-weight:600; max-width: calc(100% - 50px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; } #wrap .board_list_table td em { color: var(--black-color03); } #wrap .board_list_table .board_tit { padding-inline: 0; color: var(--black-color03); width: 100%; } #wrap .board_list_table .board_tit img { display: none; vertical-align: middle; } #wrap .board_list_table .board_tit a:has([alt="비밀글"])::before { display: inline-flex; content: ''; width: 13px; aspect-ratio: auto 0.84; background: url('0b3135032d5bdd68a7046237.svg') no-repeat center / 100% auto; vertical-align: text-top; margin-right: 4px; } #wrap .board_list_table .board_tit a:has([alt="파일첨부 있음"])::after { display: inline-flex; content: ''; width: 10px; aspect-ratio: auto 0.93; background: url('06e819920006ea654607d936.svg') no-repeat center / 100% auto; vertical-align: middle; margin-left: 4px; } #wrap .board_list_table .icon { display: inline-flex; align-items: center; justify-content: center; font-size: var(--text-14); font-weight: 600; color: var(--point-color01); border: 1px solid var(--point-color01); padding: 5px 10px; line-height: 1.2; border-radius: 50px; } #wrap .board_zone_list { min-height: auto; } #wrap .board_zone_list .pagination ul { margin-top: 30px; } #wrap .board_zone_list .pagination li { min-width: auto; } #wrap .board_zone_list .pagination li :where(span, a) { font-size: var(--text-18); } #wrap .board_zone_list .pagination li.btn_page a { font-size: 0; } #wrap .board_list_qa .board_list_table .board_tit { color: var(--black-color06); } #wrap .top_table_type table { position: relative; margin: 0; border: 0; table-layout: fixed; text-align: center; border-top: 1px solid var(--black-color13); } #wrap .top_table_type :where(th, td) { font-size: var(--text-14); font-weight: 500; color: var(--black-color13); line-height: 1.4; border: 0; border-bottom: 1px solid var(--border-color01); padding: 15px 10px; background: none; } #wrap .top_table_type td { font-weight: 400; color: var(--black-color06); } #wrap .top_table_type td :where(strong, em) { font-weight: inherit; } #lyPassword.layer_wrap { overflow: visible; } #lyPassword.layer_wrap p { display: none; } /* 기간 검색 */ #wrap .date_check_box { margin: 0 0 25px; padding: 20px; border: 1px solid var(--border-color01); border-radius: var(--radius-10); } #wrap .date_check_box:after { display: none; } #wrap .date_check_box form { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; } #wrap .date_check_box h3 { float: none; padding: 0; font-size: var(--text-18); font-weight: 500; color: var(--black-color13); } #wrap .date_check_list { float: none; display: flex; gap: 4px; width: 100%; } #wrap .date_check_list button { float: none; display: flex; align-items: center; justify-content: center; text-align: center; width: 100%; height: 36px; border: 1px solid var(--border-color01); border-radius: var(--radius-06); background: var(--point-white); font-size: var(--text-16); font-weight: 400; color: var(--black-color03); line-height: 1.4; padding: 0 5px; } #wrap .date_check_list button.on { border-color: var(--black-color13); font-weight: 500; } #wrap .date_check_list button[data-value="15"] { display: none; } #wrap .date_check_calendar { position: relative; float: none; margin: 0; display: flex; align-items: center; justify-content: center; gap:10px; font-size: var(--text-16); font-weight: 400; color: var(--black-color06); font-family: var(--font-type02); flex-wrap:wrap;} #wrap .date_check_calendar .anniversary { width: 100%; background: url('90bb40463b82a394f42f4145.svg') no-repeat calc(100% - 15px) 50% / 14px auto; padding-right: 40px; font-family: var(--font-type01); } #wrap .btn_date_check { display: flex; align-items: center; justify-content: center; text-align: center; font-size: var(--text-16); font-weight: 500; color: var(--black-color13); line-height: 1.4; width: 100%; height: 36px; border-radius: var(--radius-06); border: 1px solid var(--black-color13); background: var(--point-white); padding: 0 10px; } #wrap .btn_date_check em { padding: 0; background: none; font-weight: inherit; } #wrap .date_check_calendar .bootstrap-datetimepicker-widget { width: 250px; } #wrap .datepicker-submit{width:100%;background:var(--point-color01);border-color:var(--point-color01);margin:0;border-radius:var(--radius-06)} #wrap .bootstrap-datetimepicker-widget * { box-sizing: unset; } #wrap .date_check_calendar .bootstrap-datetimepicker-widget :where(th, td) { text-align: center; } #wrap .date_check_calendar .bootstrap-datetimepicker-widget td.active { color: var(--point-white); } @media (max-width:360px) { #wrap .date_check_calendar { flex-wrap: wrap; } } /* 작성하기 */ #wrap.board_pop{height:100%;overflow-y:auto;} #wrap .ly_head { position: relative; margin: 0 0 20px; padding: 0; text-align: center; height: auto; background: none; border: 0; line-height: 1.3; } #wrap .ly_pop .ly_head { border-bottom: 1px solid var(--gray-bg05); padding: var(--row-gap60) 0 20px; } #wrap .ly_head .h_tit { font-size: var(--text-40); font-weight: 600; color: var(--black-color00); line-height: 1.3; } #wrap .write_wrap { position: relative; border-top: 1px solid var(--black-color00); } #wrap .write_wrap dl { display: flex; align-items: center; width: 100%; padding: 0; border: 0; border-bottom: 1px solid var(--border-color01); gap: 10px 0; padding-block: 15px; } #wrap .write_wrap dl :where(dt, dd) { display: block; height: auto; font-size: var(--text-16); font-weight: 400; color: var(--black-color13); padding: 0 10px; } #wrap .write_wrap dl dt { width: 75px; flex-shrink: 0; text-indent: 0; } #wrap .write_wrap dl dt label { font-size: inherit; color: inherit; font-weight: inherit; } #wrap .write_wrap dl dd { width: 100%; } #wrap .write_wrap dl dd :where([type="text"], [type="password"]) { width: 100%; } #wrap .write_wrap dl.b_content { flex-wrap: wrap; } #wrap .write_wrap dl.b_content dt { width: 100%; flex-shrink: unset; padding-bottom: 0; display: flex; align-items: center; justify-content: space-between; gap: 10px 15px; } #wrap .write_wrap dl.b_content dt .b_content_chk { position: relative; inset: auto; } #wrap .write_wrap dl.b_content dt .b_content_chk img { vertical-align: text-top; } #wrap .write_wrap dl.b_content dd .textarea_box { width: 100%; } #wrap .write_wrap dl.b_content dd .textarea_box textarea { width: 100%; height: 100%; border: none; font-size: inherit; resize: none; } #wrap .write_wrap dl.b_guest { flex-wrap: wrap; border-bottom: 0; padding: 25px 0 0; gap: 15px; } #wrap .write_wrap dl.b_guest :where(dt, dd) { padding: 0; } #wrap .write_wrap dl.b_guest dt { width: 100%; flex-shrink: unset; } #wrap .write_wrap dl.b_guest .inp_chk { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px; } #wrap .write_wrap dl.b_guest .inp_chk a { font-size: var(--text-14); font-weight: 400; color: var(--black-color06); line-height: 1.4; text-decoration: none; display: inline-flex; align-items: center; gap: 3px; } #wrap .write_wrap dl.b_guest .inp_chk a::after { display: inline-flex; content: ''; width: 7px; aspect-ratio: auto 1; border: 1px solid var(--gray-bg05); clip-path: var(--clip-poly02); rotate: -45deg; } #wrap .write_wrap .textarea_box textarea { width: 100%; height: 100%; padding: 3px 0; border: 0; font-size: var(--text-15); font-weight: 400; color: var(--black-color09); line-height: 1.6; } #wrap .write_wrap .b_file { padding: 10px 0 0; } #wrap .write_wrap .itemselect { display: grid; gap: 8px; min-height: auto; } #wrap .write_wrap .prd_select_btn { display: inline-flex; align-items: center; justify-content: center; text-align: center; width: auto; min-width: 80px; height: 36px; border: 0; padding: 0 14px; margin: 0; font-size: var(--text-16); font-weight: 400; color: var(--point-white); background: var(--black-color06); border-radius: var(--radius-06); } #wrap .write_wrap .input_wrap { padding: 0; } #wrap .write_wrap .capcha { padding: 15px 0; display: flex; gap: 10px 15px; min-width: auto; margin: 0; border-bottom: 1px solid var(--border-color01); } #wrap .write_wrap .capcha_img { display: flex; align-items: center; justify-content: center; border: 1px solid var(--border-color01); text-align: center; border-radius: var(--radius-06); padding: 15px; flex-shrink: 0; width: 150px; } #wrap .write_wrap .capcha_img span { display: block; width: auto; height: auto; } #wrap .write_wrap .capcha_body { display: block; width: 100%; padding: 0; display: flex; flex-direction: column; justify-content: center; gap: 10px; } #wrap .write_wrap .capcha_text { padding: 0; font-size: var(--text-15); font-weight: 400; color: var(--black-color06); line-height: 1.4; } #wrap .write_wrap .capcha_input { padding: 0; } #wrap .write_wrap .captchareload_btn { display: flex; align-items: center; justify-content: center; gap: 10px; text-align: center; font-size: var(--text-16); font-weight: 500; color: var(--black-color13); line-height: 1.2; padding: 0 15px; height: 36px; background: var(--point-white); border-radius: var(--radius-06); border: 1px solid var(--gray-bg04); width: auto; } #wrap .write_wrap .captchareload_btn img { display: none; } #wrap .write_wrap .captchareload_btn::before { display: inline-flex; content: ''; width: 12px; aspect-ratio: auto 1; background: url('345ba34eb0d70ce704e4ff71.svg') no-repeat center / 100% auto; } #wrap .write_wrap label:has([type="checkbox"]) em { font-weight: 500; color: var(--point-color01); } #wrap .write_wrap .selected_goods_wrap { padding: 15px 0; border-bottom: 1px solid var(--border-color01); background: none; } #wrap .write_wrap .selected_goods_wrap:not(:has(*)) { display: none; } #wrap .write_wrap .selected_goods { display: flex; align-items: center; width: 100%; gap: 15px; } #wrap .write_wrap .goods_item_cell { display: block; padding: 0; font-size: var(--text-15); font-weight: 500; color: var(--black-color13); text-align: left; width: auto; } #wrap .write_wrap .goods_item_cell.cell_img { width: 70px; aspect-ratio: auto 1; padding: 0; overflow: hidden; flex-shrink: 0; } #wrap .write_wrap .goods_img { display: block; border: 0; width: 100%; height: 100%; } #wrap .write_wrap .goods_img img { width: 100%; height: 100%; object-fit: cover; } #wrap .write_wrap .selected_goods .cont { width: 100%; display: flex; flex-direction: column; gap: 5px; } #wrap .write_wrap .goods_item_cell.cell_info { display: grid; gap: 3px; } #wrap .write_wrap .goods_item_cell.cell_delete button { display: block; height: auto; background: none; border: none; font-size: 0; } #wrap .write_wrap .choice_box { position: relative; border: 0; z-index: 5; } #wrap .write_wrap .bn_opt { width: 100%; height: 36px; padding: 0 35px 0 10px; border: 1px solid var(--border-color01); background: var(--point-white) url(6df6563c0ed79951dd1a5c59.svg) no-repeat right 10px center; border-radius: var(--radius-06); } #wrap .write_wrap .optbx { position: absolute; top: calc(100% + 5px); left: 0; background: var(--point-white); width: 100%; border: 1px solid var(--border-color01); padding: 15px; border-radius: var(--radius-10); } #wrap .write_wrap .scroll { position: relative; } #wrap .write_wrap .choice_rating { border: 0; display: grid; gap: 10px; } #wrap .write_wrap .choice_rating li { padding: 0; } #wrap .rating { position: relative; background: url('2547838c35cba7863974f218.svg') no-repeat 0 0 / auto 100%; width: 70px; height: auto; aspect-ratio: auto 6.23; font-size: 0; display: flex; } #wrap .rating span { display: block; height: 100% !important; background: url('3870d22d4b6934ba575a6181.svg') no-repeat 0 0 / auto 100%; } #wrap #boardAttach { position: relative; margin: 0; display: flex; flex-wrap: wrap; gap: 10px; } #wrap #boardAttach li.item { position: relative; display: inline-block; width: auto; height: auto; margin: 0; overflow: hidden; } #wrap #boardAttach li.item button.file_face { width: auto; height: 36px; border: 1px solid var(--gray-bg04); background: var(--point-white); font-size: 0; padding: 0 10px; font-weight: 400; color: var(--black-color13); background: var(--point-white); border-radius: var(--radius-06); display: flex; align-items: center; justify-content: center; text-align: center; } #wrap #boardAttach li.item button.file_face::before { display: inline-flex; content: '+ 추가'; font-size: var(--text-16); } #wrap #boardAttach li.item button.file_face.preview { border: 0; width: 36px; } #wrap #boardAttach li.item button.file_face.preview::before { display: none; } #wrap #boardAttach li.item input.file_hidden { display: none; } #wrap :where(.write_wrap, .ly_pop, .boardlist) .btn_box { display: flex; width: 100%; gap: 10px; padding: 25px 0 0; } #wrap :where(.write_wrap, .ly_pop, .boardlist) .btn_box li { padding: 0; margin: 0; width: 100%; display: block; } #wrap :where(.write_wrap, .ly_pop, .boardlist) .btn_box :where(button, a) { display: flex; align-items: center; justify-content: center; text-align: center; width: 100%; height: auto; background: var(--point-white); border-color: var(--gray-bg04); color: var(--black-color13); font-size: var(--text-17); font-weight: 400; line-height: 1.4; padding: 10px 15px; border-radius: 60px; } #wrap :where(.write_wrap, .ly_pop, .boardlist) .btn_box :where(button, a) :where(strong, em, span) { font-size: inherit; font-weight: inherit; color: inherit; padding: 0; background: none; } #wrap :where(.write_wrap, .ly_pop, .boardlist) .btn_box :where(button, a).write_save_btn { background: var(--black-color13); border-color: var(--black-color13); color: var(--point-white); } #wrap .more_btn_box { display: flex; width: 100%; gap: 10px; padding: 25px 0 0; } #wrap .more_btn_box :where(button, a) { display: flex; align-items: center; justify-content: center; text-align: center; width: 100%; height: auto; background: var(--point-white); border-color: var(--gray-bg04); color: var(--black-color13); font-size: var(--text-17); font-weight: 400; line-height: 1.4; padding: 10px 15px; border-radius: 60px; } #wrap .more_btn_box :where(button, a) :where(strong, em, span) { font-size: inherit; font-weight: inherit; color: inherit; padding: 0; background: none; } body:has(.ly_pop[style="display: block;"]) { overflow: clip; } #wrap .ly_pop { position: fixed; inset: auto; overflow: hidden; overflow-y: auto; width: 100%; height: 100%; /* padding-bottom: 40px; */ transform: none; top: 0; left: 0;background:rgba(0,0,0,0.5);align-items: center;justify-content: center;} #wrap .ly_pop .disFlex{display: flex;width:100%;height:100%;align-items: center;justify-content: center;background:none;} #wrap .ly_pop .disFlex > .w_custom{background:var(--point-white);padding:0 20px 30px;} #wrap .ly_pop .disFlex .close_btn{right:20px;} #wrap .ly_show{display: flex;} #wrap .ly_wrap{height:127vw;background:var(--point-white);width:calc(100% - 40px);padding-bottom:var(--row-gap30);border-radius:var(--radius-20);} #wrap #popupOption .ly_wrap{height:127vw !important;width:calc(100% - 40px) !important;} #wrap .ly_overlay{display: none;} #wrap .ly_pop .btn_box { padding-top: 15px; } #wrap .ly_ct { height: 100% !important; overflow: visible;display: flex;flex-direction: column;justify-content: space-between;} #wrap .layer_option .popup_dn{position: relative;} #wrap .board_layer_goods .ly_buy_info { padding: 0; } #wrap .board_layer_goods .ly_loop { padding: 15px 0 0; background: none; display: grid; gap: 15px; } #wrap .board_layer_goods .ly_loop li { padding: 10px; border: 1px solid var(--border-color01); } #wrap .board_layer_goods .ly_loop .no_data { text-align: center; border: 0; font-size: var(--text-14); font-weight: 400; color: var(--black-color06); line-height: 1.6; } #wrap .board_layer_goods:has(.no_data) .js_more_btn { display: none !important; } #wrap .board_layer_goods .ly_loop .info { padding: 0; margin: 0; background: none; border: 0; display: flex; align-items: center; gap: 15px; } #wrap .board_layer_goods .ly_loop .itemhead { display: block; width: 70px; aspect-ratio: auto 1; flex-shrink: 0; overflow: hidden; } #wrap .board_layer_goods .ly_loop .thmb { width: 100%; height: 100%; } #wrap .board_layer_goods .ly_loop .thmb img { width: 100%; height: 100%; border: 0; object-fit: cover; } #wrap .board_layer_goods .ly_loop .itembody { display: block; padding: 0; flex-grow: 1; font-size: var(--text-14); font-weight: 400; color: var(--black-color13); line-height: 1.6; display: flex; flex-direction: column; gap: 4px; } #wrap .board_layer_goods .ly_loop :where(.name, .prc) { font-size: inherit; font-weight: inherit; color: inherit; line-height: inherit; padding: 0; } #wrap .board_layer_goods .ly_loop .prc { padding: 0; } #wrap .board_layer_goods .ly_loop .goods_price { padding: 0; } #wrap .board_layer_goods .ly_loop .btn_bx { flex-shrink: 0; } #wrap .board_layer_goods .ly_loop .btn_bx :where(button, a) { display: inline-flex; align-items: center; justify-content: center; text-align: center; width: auto; height: 36px; border: 1px solid var(--gray-bg04); padding: 0 12px; margin: 0; font-size: var(--text-16); font-weight: 400; color: var(--black-color13); background: var(--point-white); border-radius: var(--radius-06); } #wrap .ly_pop .close_btn { position: absolute; top: 30px; right:0; } #wrap .lys_close_btn { position: relative; width: 28px; height: auto; aspect-ratio: auto 1; border-radius: 100%; border: 1px solid var(--gray-bg05); inset: auto; padding: 0; background: var(--point-white); } #wrap .lys_close_btn { &::before, &::after { width: 13px; height: 1px; content: ''; background: var(--gray-bg05); position: absolute; top: 50%; left: 50%; translate: -50% -50%; rotate: 45deg; } } #wrap .lys_close_btn::after { rotate: -45deg; } #wrap .ly_pop .more_box { padding: 15px 0 0; display: flex; justify-content: center; gap: var(--row-gap10); } #wrap .ly_pop .more_box :where(button, a) { display: flex; align-items: center; justify-content: center; text-align: center; width: 100%; height: auto; background: var(--point-white); border-color: var(--gray-bg04); color: var(--black-color13); font-size: var(--text-17); font-weight: 400; line-height: 1.4; padding: 10px 15px; border-radius: 60px; } #wrap .tab_area { border: 0; } #wrap .popup_tab { display: flex; box-shadow: inset 0 -2px 0 var(--gray-bg02); margin-bottom: 20px; } #wrap .popup_tab:after { display: none; } #wrap .popup_tab>li { display: block; float: none; width: 100%; } #wrap .popup_tab>li>a { display: flex; align-items: center; justify-content: center; text-align: center; width: 100%; height: 100%; font-size: var(--text-16); font-weight: 500; line-height: 1.4; color: var(--gray-bg05); letter-spacing: -0.03em; cursor: pointer; padding: 10px 10px; background: none; border: 0; } #wrap .popup_tab>li>a.on { font-weight: 600; box-shadow: inset 0 -2px 0 var(--gray-bg05); color: var(--black-color13); } @media (max-width:360px) { #wrap .write_wrap .capcha { flex-wrap: wrap; } #wrap .write_wrap .capcha_img { width: 100%; flex-shrink: unset; } } #wrap .board_layer_goods{width: 100%;height: 100%;display: flex;align-items: center;justify-content: center} #wrap .board_layer_goods .goods_sel_box{position: relative;background:var(--point-white);padding:0 20px 30px;border-radius:var(--radius-20);max-height: 120vw;overflow-y: auto;} #wrap .board_layer_goods .close_btn{right:20px;} /* 고객센터 상단 */ #wrap .board_search_box .date_faq_list { position: relative; display: flex; align-items: center; flex-wrap: wrap; width: auto; gap: 12px; } #wrap .board_search_box .date_faq_list h2 { font-size: var(--text-20); font-weight: 500; color: var(--black-color03); line-height: 1.4; padding: 0; } #wrap .board_search_box .date_faq_txt { width: 100%; padding: 15px 0 0; margin: 10px 0 0; border-top: 1px solid var(--border-color01); display: flex; flex-direction: column; justify-content: center; } #wrap .board_search_box .date_faq_txt p { display: flex; align-items: center; flex-wrap: wrap; gap: 15px; font-size: var(--text-16); font-weight: 400; color: var(--black-color03); line-height: 1.75; } #wrap .board_search_box .date_faq_txt p strong { padding: 0; font-weight: inherit; } #wrap .board_search_box .btn_gray_list { display: inline-block; } #wrap .board_search_box .btn_gray_list .btn_gray_mid { font-size: var(--text-15); font-weight: 500; color: var(--black-color13); line-height: 1.33; background: var(--point-white); border: 1px solid var(--gray-bg04); border-radius: var(--radius-06); padding: 8px 15px; width: auto; height: auto; display: inline-flex; align-items: center; justify-content: center; text-align: center; } #wrap .board_search_box .btn_gray_list .btn_gray_mid span { line-height: inherit; padding: 0; background: none; } #wrap .board_list_faq .board_hot_list { margin-bottom: 20px; } #wrap .board_list_faq .board_hot_list>ul { justify-content: flex-start; column-gap: 0; } #wrap .board_list_faq .board_hot_list>ul>li { font-size: var(--text-16); font-weight: 400; color: var(--black-color03); display: flex; align-items: center; flex-wrap: wrap; gap: 5px 0; } #wrap .board_list_faq .board_hot_list>ul>li::after { display: inline-flex; content: ''; width: 1px; height: 8px; background: var(--border-color01); margin-inline: 15px; } #wrap .board_list_faq .board_hot_list>ul>li:last-child::after { display: none; } #wrap .board_list_faq .board_hot_list>ul>li.on { color: var(--point-color01); -webkit-text-stroke: 0.3px var(--point-color01); text-decoration: underline 1px; text-underline-offset: 5px; } /* FAQ */ #wrap .board_faq { border: 0; border-top: 1px solid var(--black-color00); } #wrap .board_faq li.data_row { border: 0; border-bottom: 1px solid var(--border-color01); font-size: var(--text-16); font-weight: 500; line-height: 1.4; color: var(--black-color03); } #wrap .board_faq li.data_row .faq_subject { position: relative; padding: 15px; padding-right: 40px; word-break: inherit; font-weight: inherit; display: flex; gap: 10px; align-items: baseline; } #wrap .board_faq li.data_row .faq_subject::before { position: relative; content: 'Q'; inset: auto; margin: 0; display: inline-flex; align-items: center; justify-content: center; min-width: 28px; min-height: 28px; border-radius: 100%; text-align: center; background: var(--gray-bg02); font-weight: 600; color: var(--point-color01); padding: 3px; flex-shrink: 0; } #wrap .board_faq li.data_row .faq_subject::after { position: absolute; content: ''; width: 9px; aspect-ratio: auto 1; border: 2px solid var(--gray-bg05); top: 44%; right: 12px; clip-path: var(--clip-poly02); rotate: 45deg; translate: 0 -50%; } #wrap .board_faq li.data_row .faq_subject.on::after { border-color: var(--black-color13); scale: -1 -1; top: 49%; } #wrap .board_faq li.data_row .no_data { padding: 50px 0 50px 0; text-align: center; } #wrap .board_faq li.data_row .faq_row_box { position: relative; max-width: none; min-height: auto; margin: 0; padding: 15px; display: flex; align-items: baseline; gap: 10px; color: var(--black-color13); line-height: 1.6; background: var(--gray-bg02); border-radius: var(--radius-10); margin-bottom: 20px; } #wrap .board_faq li.data_row .faq_row_box dl { padding: 0; word-break: inherit; } #wrap .board_faq li.data_row .faq_row_box dl dt { display: none; } #wrap .board_faq li.data_row .faq_row_box dl dt span.icon_q { position: absolute; top: 0; left: 0; } #wrap .board_faq li.data_row .faq_row_box dl dd { position: relative; padding: 0; display: flex; align-items: baseline; gap: 10px; } #wrap .board_faq li.data_row .faq_row_box dl dd>div * { font-size: inherit !important; font-weight: inherit !important; font-family: inherit !important; } #wrap .board_faq li.data_row .faq_row_box dl dd>div>p { display: inline; } #wrap .board_faq li.data_row .faq_row_box dl dd span.icon_a { position: relative; inset: auto; margin: 0; display: inline-flex; align-items: center; justify-content: center; min-width: 28px; min-height: 28px; border-radius: 100%; text-align: center; padding: 3px; background: var(--point-color01); color: var(--point-white); font-weight: 500; flex-shrink: 0; } /* 브랜드 */ html:has(#fullpage){overflow-x:auto !important;} #wrap:has(#fullpage) .hd_bnr{position: relative; z-index: 5; transition: all 0.4s;} #wrap:has(#fullpage) #header{margin-bottom: -109px;} #wrap:has(#fullpage) #header.atv{background: var(--point-white); translate: 0 -44px;} #wrap:has(#fullpage) .sub_top{display: none;} #wrap:has(#fullpage) #contents_wrap{padding-top: 0;} #wrap:has(#fullpage) .sub_content{padding:0; width: 100%;} #wrap:has(#fullpage):has(#header.atv:not(.end)) .ft_quick{opacity: 1; pointer-events: auto;} #wrap:has(#fullpage) #footer_wrap .ft_quick{display: none;} #fullpage .intro{background: url('036a2f56d8620d1ef4c06c4e.jpg') no-repeat center / cover;} #fullpage .intro .logo{display: flex;justify-content: center;align-items: center;opacity: 0;transition: all 1.2s 0.2s;width: min(800px, 70%);height: auto;margin-inline: auto;} #fullpage .intro.atv .logo{opacity: 1;} #fullpage .half-bg{position: relative;} #fullpage .comSwiper{position: relative; height: 100%;} #fullpage .comSwiper .swiper-slide{position: relative;} #fullpage .comSwiper .swiper-slide:not(.swiper-slide-active){opacity: 0 !important; pointer-events: none;} #fullpage .half-bg .thumb{position: absolute; inset:0; overflow: hidden;} #fullpage .half-bg .thumb img{width: 100%; height: 100%; object-fit: cover;} #fullpage .half-bg .w_custom{z-index: 2;display: flex;align-items: center;justify-content: center;flex-direction: column;height: 100%;overflow: hidden;} #fullpage .half-bg .item{position: relative;width: 100%;height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;padding-inline: 30px;} #fullpage .guide-title{position: absolute;top: 20px; left: 0; z-index: 2;} #fullpage .guide-title.right{left: auto; right:0; text-align: right;} #fullpage .guide-title.filter{filter: var(--filter-white);} #fullpage .guide-title p{font-size: 12px;font-weight: 700;color: var(--black-color03);} #fullpage .half-bg .guide-title{top: 80px;left:15px;} #fullpage .half-bg .guide-title.right{left: auto; right: 15px;} #fullpage .half-bg .com-title{position: relative; text-align: center; opacity: 0;} #fullpage .half-bg .com-title.filter{filter: var(--filter-white);} #fullpage .half-bg .swiper-slide-active:not(:first-child) .com-title{opacity: 1; transition: all 1.2s 0.2s;} #fullpage .half-bg.on .swiper-slide:first-child .com-title{opacity: 1; transition: all 1.2s 0.2s;} #fullpage .half-bg .com-title h4{font-size: 23px;font-weight: 700;color: var(--black-color03);line-height: 1.52;} #fullpage .half-bg .step-list{border: 2px solid var(--point-white);border-radius: 200px;padding: 6px;opacity: 0;} #fullpage .half-bg .swiper-slide-active:not(:first-child) .step-list{opacity: 1; transition: all 1.2s 0.2s;} #fullpage .half-bg.on .swiper-slide:first-child .step-list{opacity: 1; transition: all 1.2s 0.2s;} #fullpage .half-bg .step-list > li{position: relative;width: 165px;aspect-ratio: auto 1;border-radius: 100%;background: rgb(255 255 255 / 50%);box-shadow: 1px 1px 2px rgb(0 0 0 / 10%);text-align: center;font-size: 20px;font-weight: 700;color: var(--black-color03);line-height: 1.266;opacity: 0;} #fullpage .half-bg .step-list > li::after{position: absolute;content:'';width: 33px;aspect-ratio: auto 1.052;background: url('13d7642398caf5f45d9c2801.png') no-repeat center / 100% auto;top: -8px;left: 50%;translate: -50%;z-index: 1;} #fullpage .half-bg .step-list > li + li{margin-top: -30px;} #fullpage .half-bg .step-list > li:nth-child(2){background: rgb(255 255 255 / 60%);} #fullpage .half-bg .step-list > li:last-child{background: rgb(255 255 255 / 90%);} #fullpage .half-bg .step-list > li:first-child::after{display: none;} #fullpage .half-bg .swiper-slide-active:not(:first-child) .step-list > li{opacity: 1; transition: all 1.2s 0.2s;} #fullpage .half-bg .swiper-slide-active:not(:first-child) .step-list > li:nth-child(2){opacity: 1; transition-delay:0.7s;} #fullpage .half-bg .swiper-slide-active:not(:first-child) .step-list > li:nth-child(3){opacity: 1; transition-delay:1.2s;} #fullpage .half-bg.on .swiper-slide:first-child .step-list > li{opacity: 1; transition: all 1.2s 0.2s;} #fullpage .half-bg.on .swiper-slide:first-child .step-list > li:nth-child(2){opacity: 1; transition-delay:0.7s;} #fullpage .half-bg.on .swiper-slide:first-child .step-list > li:nth-child(3){opacity: 1; transition-delay:1.2s;} #fullpage .half-bg .step-list > li > span{display: flex;align-items: center;justify-content: center;flex-direction: column;width: 100%;height: 100%;padding: 15px;} #fullpage .half-bg .step-list.blue > li{background: rgb(13 107 197 / 40%);} #fullpage .half-bg .step-list.blue > li:nth-child(2){background: rgb(13 107 197 / 60%);} #fullpage .half-bg .step-list.blue > li:last-child{background: rgb(13 107 197 / 90%);} #fullpage .half-bg .step-list.blue > li > span{filter: var(--filter-white);} #fullpage .half-bg .step-list.blue > li::after{filter: var(--filter-white);} #fullpage .fadeBox.bg_sec .thumb{position: absolute;top:0;left:0;width:100%;height:100%;} #fullpage .fadeBox.bg_sec .thumb img{width:100%;height:100%;object-fit:cover;} #fullpage .fadeSwiper{position: relative;width: 100%;height: 100%;overflow: hidden;} #fullpage .fadeSwiper .swiper-wrapper{height: 100%;} #fullpage .fadeSwiper .swiper-slide{height: 100%;padding-top: 70px;} #fullpage .fadeSwiper .swiper-slide:not(.swiper-slide-active){opacity: 0 !important; pointer-events: none;} #fullpage .fadeSwiper .thumb{position: absolute; inset: 0; overflow: hidden;} #fullpage .fadeSwiper .thumb img{width: 100%; height: 100%; object-fit: cover;} #fullpage .fadeSwiper .w_custom{display: flex;flex-direction: column;align-items: center;justify-content: center;height: 100%;} #fullpage .fadeSwiper .bas-title.ani{opacity:0;} #fullpage .bas-title{position: relative; display: flex; flex-direction: column; gap: 20px; text-align: center;} #fullpage .bas-title.left{text-align: left;} #fullpage .bas-title h3{font-size: 32px;font-weight: 700;color: var(--black-color03);line-height: 1.5;} #fullpage .bas-title h4{font-size: 23px;font-weight: 700;color: var(--black-color03);line-height: 1.52;} .fadeBox .clip-sec{width:100%;height:100%;padding-top: 70px;} .fadeBox .clip-sec .w_custom{height:100%;} /* #fullpage .fadeBox .thumb{clip-path: circle(100% at 50% 50%);opacity: 0;} */ #fullpage .fadeBox .gif{opacity:1;clip-path:none;} #fullpage .section.fadeBox.on .thumb{ clip-path: circle(100% at 50% 50%); transition: all 0.0s 0.0s; opacity: 1;} /* #fullpage .section.on .fadeSwiper .clip-sec .bas-title{transition: all 1.2s 1.2s;opacity: 1;} */ #fullpage .section.fadeBox .bas-title{transition: all 0.6s;position: absolute;top:50%;left:50%;translate:-50% -50%;width:100%;} #fullpage .section.fadeBox .bas-title.ani{opacity:0;} #fullpage .section.fadeBox.active .bas-title.ani{opacity:1;transition-delay:1.6s;} #fullpage .section.fadeBox.active .bas-title:not(.ani){opacity:0;transition-delay:1.6s;pointer-events:none;} #fullpage .fadeSwiper .default .bas-title{opacity: 0; transition: all 1.2s 0.4s;} #fullpage .fadeSwiper .swiper-slide-active.default .bas-title{opacity: 1;} #fullpage .fadeSwiper .bg-ani .thumb{width: max-content;left: auto;right: 0; transition: all 1.2s 0.4s;} #fullpage .fadeSwiper .swiper-slide-active.bg-ani .thumb{right: -30%;} #fullpage .care-sec{background: url('141ade3ef1b6c9b08a275dbf.jpg') no-repeat center / cover;} #fullpage .care-sec .w_custom{height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;padding-top: 70px;} #fullpage .care-sec .guide-title{top: 80px;left:15px;} #fullpage .care-sec .guide-title.right{left: auto; right: 15px;} #fullpage .care-sec .bas-title{opacity: 0;} #fullpage .care-sec .item-list{position: relative;width: 138px;display: grid;gap: 0;flex-shrink: 0;translate: -10px;} #fullpage .care-sec .item-list > li{position: relative;aspect-ratio: auto 1;background: var(--point-white);border-radius: 100%;display: flex;align-items: center;justify-content: center;text-align: center;z-index: 1;margin-block: -3px;} #fullpage .care-sec .item-list > li::after{position: absolute;content:'';width: 135px;aspect-ratio: auto 1.3;background: var(--point-white);top: calc(100% - 3px);left: 50%;translate: -50% -50%;z-index: -1;clip-path: url('#care-clip');} #fullpage .care-sec .item-list > li:last-child::after{display:none;} #fullpage .care-sec .item-list .desc{width: calc(100% - 18px);height: calc(100% - 18px);background: #0D6BC5;border-radius: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 8px;color: var(--point-white);} #fullpage .care-sec .item-list > li:nth-child(2) .desc{background: #43AC68;} #fullpage .care-sec .item-list > li:nth-child(3) .desc{background: #EC5A6E;} #fullpage .care-sec .item-list .desc dt{font-size: 20px;font-weight: 600;line-height: 1.3;} #fullpage .care-sec .item-list .desc dd{font-size: 14px;font-weight: 300;line-height: 1.4;} #fullpage .care-sec.on .bas-title{opacity: 1; transition: all 1.2s 0.2s;} #fullpage .care-sec .item-list{opacity: 0;} #fullpage .care-sec .swiper-slide-active .item-list{opacity: 1; transition: all 1.2s 0.2s;} #fullpage .product-line .guide-wrap{position: absolute;top: 50px;left: 50%;translate: -50%;pointer-events: none;z-index: 1;} #fullpage .product-line .info-list{display: flex;flex-direction: column;height: 100%;} #fullpage .product-line.on .info-list{padding-block: 120px 60px;transition: all 1.2s 0.2s;} #fullpage .product-line .info-list > li{position: relative;display: flex;align-items: flex-start;gap: 20px;height: 100%; margin-bottom:5px;} #fullpage .product-line .info-list .thumb{width: 100px;aspect-ratio: auto 1;flex-shrink: 0;clip-path: circle(100dvh at 50% 50%);display: flex;align-items: center;justify-content: center;} #fullpage .product-line .info-list .thumb{&::before, &::after{display: inline-block;content:attr(title);font-size: 12px;font-weight: 600;color: var(--point-white);z-index: 1; opacity: 0;}} #fullpage .product-line .info-list .thumb::after{position: absolute; right:20px; bottom:13px; font-size:23px; opacity: 1;} #fullpage .product-line .info-list .thumb img{position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;} #fullpage .product-line .info-list .desc{width: 100%;gap:5px;display: flex;flex-direction: column; padding-right: 15px;} #fullpage .product-line .info-list .desc dt{font-size: 12px;font-weight: 700;color: var(--black-color03);} #fullpage .product-line .info-list .desc dd{font-size: clamp(12px, 1.7vh, 14px);color: var(--black-color03);line-height: 1.4;} #fullpage .product-line.on .info-list .thumb{clip-path: circle(50% at 50% 50%);transition: all 0.8s 0.2s; margin-left: 15px;} #fullpage .product-line.on .info-list .thumb::before{opacity: 1;transition: all 0.8s 0.4s;} #fullpage .product-line.on .info-list .thumb::after{opacity: 0;transition: all 0.8s 0.4s;} #fullpage .ftr-sec{height: auto !important;} #fullpage .ftr-sec .fp-tableCell{height: auto !important;} #fullpage #footer{margin-top: 0;} #fullpage .grid-bnr{display: grid;grid: repeat(3, 1fr) / auto;height: 100dvh;} #fullpage .grid-bnr > li{position: relative;width: 100%;height: 100%;overflow: hidden;} #fullpage .grid-bnr > li img{width: 100%; height: 100%; object-fit: cover;} #fullpage .grid-bnr > li::before{position: absolute;content:'';width: 100%;height: 1px;background: var(--point-white);left: 0;bottom: 0;} #fullpage .grid-bnr > li:last-child::before{display: none;} #fullpage .research-type01{position: relative;background: url('08ec866ae16af337507c9018.jpg') no-repeat center / cover;width: 100%;height: 100%;} #fullpage .research-type01::before{position: absolute; content: ''; inset: 0; background: rgb(0 0 0 / 50%); opacity: 0;} #fullpage .swiper-slide-active .research-type01::before{opacity: 1; transition: all 1.2s 0.8s;} #fullpage .research-type01 .guide-wrap{transition: all 0.6s 0.8s;} #fullpage .swiper-slide-active .research-type01 .guide-wrap{opacity: 0;} #fullpage .research-type01 .title{position: relative;text-align: center;filter: var(--filter-white);display: flex;flex-direction: column;gap: 10px;opacity: 0;} #fullpage .swiper-slide-active .research-type01 .title{opacity: 1;transition: all 1.2s 1s;} #fullpage .research-type01 .title h2{font-size: 20px;font-weight: 700;} #fullpage .research-type01 .title h3{font-size: 32px;font-weight: 700;line-height: 1.5;} #fullpage .research-type01 .title h4{font-size: 23px;font-weight: 700;line-height: 1.52;} #fullpage .research-type02{height:100%;} #fullpage .research-type02 .thumb{position: absolute;inset: auto;top:0;right:0;width: 100%;height: 100%;overflow: hidden;} #fullpage .research-type02 .thumb img{width: 100%; height: 100%; object-fit: cover;} #fullpage .research-type02 .thumb::before{position: absolute;content: '';inset: 0;background: rgb(0 0 0 / 50%);} #fullpage .swiper-slide-active .research-type02 .thumb::before{opacity: 1;transition: all 1.2s 0.8s;} #fullpage .research-type02 .w_custom:has(.title){align-items: flex-start;height: 100%;justify-content: flex-end;padding-bottom: 170px;} #fullpage .research-type02 .title{display: flex;flex-direction: column;gap: 20px;opacity: 0;z-index: 1;filter: var(--filter-white);} #fullpage .swiper-slide-active .research-type02 .title{opacity: 1;transition: all 1.2s 1.4s;} #fullpage .research-type02 .title h2{font-size: 23px;font-weight: 700;color: var(--black-color03);line-height: 1.52;} #fullpage .research-type02 .title h3{font-size: 14px;font-weight: 700;color: var(--black-color03);line-height: 2;} #fullpage .research-type02 .title h4{font-size: 14px;font-weight: 400;color: var(--black-color03);line-height: 2;} #fullpage .research-type03{height: 100%;} #fullpage .research-type03 .bg{width: 100%; height: 100%; overflow: hidden;} #fullpage .research-type03 .bg img{width: 100%; height: 100%; object-fit: cover;} #fullpage .research-type04{height: 100%;} #fullpage .research-type04 .bg{position: absolute;inset: 0;overflow: hidden;} #fullpage .research-type04 .bg::before{position: absolute;content:'';inset: 0;background: rgb(0 0 0 / 70%);opacity: 0;} #fullpage .swiper-slide-active .research-type04 .bg::before{opacity: 1;transition: all 1.2s 0.8s;} #fullpage .research-type04 .bg img{width: 100%; height: 100%; object-fit: cover;} #fullpage .research-type04 .w_custom{opacity: 0;} #fullpage .swiper-slide-active .research-type04 .w_custom{opacity: 1; transition: all 1.2s 1.5s;} #fullpage .research-type04 .circle-list{width: auto;display: grid;gap: 20px;} #fullpage .research-type04 .circle-list .desc{position: relative;overflow: hidden;display: flex;align-items: center;gap: 25px;opacity: 0.3;} #fullpage .swiper-slide-active .research-type04 .circle-list .desc{opacity: 1;transition: all 0.8s 2.2s;} #fullpage .swiper-slide-active .research-type04 .circle-list .desc:nth-child(2){transition-delay:2.6s;} #fullpage .swiper-slide-active .research-type04 .circle-list .desc:nth-child(3){transition-delay:3s;} #fullpage .research-type04 .circle-list .desc dt{position: relative;overflow: hidden;width: 120px;aspect-ratio: auto 1;flex-shrink: 0;border-radius: 100%;overflow: hidden;} #fullpage .research-type04 .circle-list .desc dd{position: relative;font-size: 20px;font-weight: 700;line-height: 1.3;filter: var(--filter-white);}