.main_section_title { margin-bottom: 60px; margin-left: 0.2em; font-size: 38px; line-height: 1.2; font-weight: 600; text-align: center; color: rgb(34, 34, 34); }
.main_section_title h2 { font-size: 20px; margin-bottom: 11px; color: rgb(170, 170, 170); }
.main_section_title h3 { font-size: 60px; color: rgb(17, 17, 17); }
.main_section_title .sub_tit { font-size: 24px; margin-top: 34px; line-height: 1.5; }
.main_section_title .desc { font-size: 16px; font-weight: 500; color: rgb(102, 102, 102); line-height: 1.5; margin-top: 7px; }
.main_inner_bg { position: fixed; top: 0px; left: 0px; width: 100%; text-align: center; z-index: -1; }
.main_inner_bg::before { font-family: jt-font; font-weight: normal; content: ""; font-size: 772px; color: rgb(227, 227, 227); }
.main_visual_wrap { width: 100%; height: 953px; position: relative; background: rgb(238, 238, 238); }
.main_visual_wrap::before { width: 76.7%; height: 100%; background: rgb(17, 17, 17); content: ""; display: block; z-index: -1; position: absolute; }
.main_visual_wrap .wrap { }
.main_visual_slider { width: 100%; height: 100%; }
.main_visual_slider::before { position: absolute; right: 180px; bottom: 0px; width: 1188px; padding-top: 734px; overflow: hidden; content: ""; display: block; background: rgb(17, 17, 17); }
.main_visual_item { width: 100%; height: 100%; position: relative; overflow: hidden; }
.main_visual_item > figure { position: absolute; right: 180px; bottom: 0px; width: 1188px; overflow: hidden; }
.main_visual_item > figure img { display: block; width: 100%; }
.main_visual_content { width: 100%; position: absolute; bottom: 203px; transition: opacity 0.3s ease 0s; }
.main_visual_content_inner { }
.main_visual_content_inner > div > * { transition: all 1s ease 0s; }
.main_visual_content_inner b > span, .main_visual_content_inner p > span, .main_visual_wrap .btn_wrap > a { opacity: 0; }
.main_visual_item.swiper-slide-active .main_visual_content_inner > div > * { opacity: 1; transform: none; }
.main_visual_content b { display: block; font-size: 60px; font-weight: 600; letter-spacing: 0px; line-height: 1.3; color: rgb(255, 255, 255); overflow: hidden; }
.main_visual_content p { padding-top: 0px; font-size: 24px; line-height: 1.5; font-weight: 500; letter-spacing: -0.01em; color: rgb(255, 255, 255); overflow: hidden; }
.main_visual_content b > span { display: block; }
.main_visual_content p > span { display: block; }
.main_visual_wrap .main_visual_state { display: block; position: absolute; left: 0px; bottom: 460px; transition: all 300ms ease 0s; z-index: 100; }
.main_visual_wrap .swiper-pagination-fraction { color: rgb(170, 170, 170); }
.main_visual_wrap .cycle_caption { color: rgb(255, 255, 255); }
.main_visual_wrap .cycle_control { right: 13%; left: auto; bottom: 50px; margin-top: 0px; top: auto; width: 200px; }
.main_visual_wrap .cycle_btn { opacity: 1; }
.main_visual_wrap .cycle_next { right: 0px; }
.main_visual_wrap .btn_wrap { margin-top: 40px; overflow: hidden; }
.main_visual_wrap .btn_wrap span { color: rgb(255, 255, 255); letter-spacing: 0.05em; vertical-align: middle; }
.main_visual_wrap .btn_wrap a { transition: none 0s ease 0s; }
html.ios .main_visual_wrap .btn_wrap { padding-top: 2px; }
.main_visual_wrap .swiper_navigation > button::after { line-height: 50px; }
.main_service { padding: 197px 0px 234px; }
.main_service_slider { overflow: hidden; padding-bottom: 110px; }
.main_service_list { margin-left: -21px; margin-right: -21px; }
.main_service_list > div { margin-bottom: 198px; }
.main_service_list > div:nth-child(3n+1) { top: 134px; }
.main_service_list > div:nth-child(3n-1) { top: 296px; }
.main_service_list .main_service_item { float: left; width: calc(33.33% - 42px); margin-left: 21px; margin-right: 21px; position: relative; padding-top: 46%; }
.main_service_list figure { padding-top: 123%; position: relative; background: rgb(221, 221, 221); }
.main_service_list img { display: block; width: 100%; position: absolute; top: 0px; left: 0px; }
.main_service_list .main_service_content { margin-top: 26px; }
.main_service_list .main_service_tit { font-size: 26px; color: rgb(17, 17, 17); text-transform: uppercase; }
.main_service_list .main_service_txt { margin-top: 5px; font-size: 16px; color: rgb(102, 102, 102); }
.main_service_list .main_service_link { display: block; position: absolute; top: 0px; }
.main_service_list .main_service_thumb { position: relative; }
.main_service_list .main_service_thumb::before { border: 0px solid rgb(208, 48, 56); position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; content: ""; display: block; opacity: 0; z-index: 10; transition: opacity 0.3s ease 0s, border 0.3s ease 0s; }
html.desktop .main_service_list .main_service_link:hover .main_service_thumb::before { border-width: 40px; opacity: 1; }
.main_service_content .btn_wrap { clear: both; text-align: center; margin-top: 118px; }
.main_space_slider_wrap { position: relative; }
.main_space_slider { position: relative; }
.main_space_slider::before { width: 100%; height: 100%; background: rgb(136, 136, 136); content: ""; display: block; position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; }
.main_space { margin-right: 180px; position: relative; z-index: 10; }
.main_space_typo_wrap { position: relative; margin-bottom: 68px; }
.main_space .main_space_typo { font-size: 180px; font-weight: 600; color: rgb(17, 17, 17); line-height: 1; white-space: nowrap; }
.main_space_content { width: 100%; padding: 0px 313px; position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; }
.main_space_content_inner { margin-top: 76px; }
.main_space_content_inner b { display: block; font-size: 60px; font-weight: 600; letter-spacing: 0px; line-height: 1.1; color: rgb(255, 255, 255); }
.main_space_content_inner .btn_wrap { margin-top: 32px; }
.main_space_item { position: relative; }
.main_space_item figure { padding-top: 49.35%; position: relative; background: rgb(221, 221, 221); overflow: hidden; }
.main_space_item img { display: block; width: 100%; position: absolute; top: 0px; left: 0px; }
.main_brand_story { padding: 430px 0px 191px; margin-top: -233px; background: rgb(255, 255, 255); position: relative; }
.main_brand_story::before { width: 100%; height: 50%; background: rgb(255, 255, 255); content: ""; display: block; position: absolute; bottom: -50%; }
.main_brand_story_list_wrap { margin: 149px -20px 98px; }
.main_brand_story_list { font-size: 0px; text-align: center; }
.main_brand_story_list > li { width: 33.33%; display: inline-block; vertical-align: top; position: relative; }
.main_brand_story_list > li::before { width: 1px; height: 100%; background: rgb(221, 221, 221); content: ""; position: absolute; left: 0px; top: 0px; display: block; }
.main_brand_story_list > li:first-child::before { display: none; }
.main_brand_story_icon { min-height: 102px; text-align: center; display: table; width: 100%; }
.main_brand_story_icon figure { display: table-cell; vertical-align: middle; }
.main_brand_story_txt { max-width: 260px; display: inline-block; }
.main_brand_story_txt b { margin-top: 43px; font-size: 24px; color: rgb(17, 17, 17); display: block; }
.main_brand_story_txt p { margin-top: 16px; font-size: 16px; line-height: 1.7; color: rgb(102, 102, 102); letter-spacing: -0.01em; }
.main_brand_story .btn_wrap { text-align: center; }
.main_miele_slider_wrap { position: relative; }
.main_miele_slider { position: relative; }
.main_miele_slider::before { width: 100%; height: 100%; background: rgb(136, 136, 136); content: ""; display: block; position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; }
.main_miele { margin-right: 180px; position: relative; z-index: 10; }
.main_miele_content { width: 100%; padding: 0px 313px; position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; }
.main_miele_content .wrap > span { font-size: 20px; margin-bottom: 14px; color: rgb(255, 255, 255); opacity: 0.52; display: block; }
.main_miele_content_inner { margin-top: 76px; }
.main_miele_content_inner b { display: block; font-size: 60px; font-weight: 600; letter-spacing: 0px; line-height: 1.1; color: rgb(255, 255, 255); }
.main_miele_content_inner p { font-size: 16px; color: rgb(255, 255, 255); letter-spacing: -0.01em; margin-top: 10px; }
.main_miele_content_inner .btn_wrap { margin-top: 42px; }
.main_miele_item { position: relative; }
.main_miele_item figure { padding-top: 49.35%; position: relative; background: rgb(221, 221, 221); overflow: hidden; }
.main_miele_item img { display: block; width: 100%; position: absolute; top: 0px; left: 0px; }
.progress { transform: rotate(-90deg); position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
.progress_meter, .progress_value { fill: none; }
.progress_meter { stroke: rgb(255, 255, 255); opacity: 0.3; }
.progress_value { stroke: rgb(255, 255, 255); stroke-linecap: round; }
.main_resister { padding: 400px 0px 198px; position: relative; margin-top: -200px; z-index: 1; }
.main_resister::before { width: 666px; height: 100%; background: rgb(208, 48, 56); position: absolute; right: 0px; bottom: 0px; content: ""; display: block; z-index: -1; }
.main_resister_contents_wrap { display: table; padding: 0px 130px; width: 100%; }
.main_resister_contents_wrap > div { width: 50%; display: table-cell; vertical-align: middle; }
.main_resister_contents_wrap .main_section_title { text-align: left; }
.main_resister_contents_wrap .main_section_title h2 { margin-bottom: 15px; }
.main_resister_contents_wrap .main_section_title h3 { line-height: 1.09; }
.main_resister_contents_wrap .main_section_title p { margin-top: 10px; line-height: 1.8; }
.main_resister_contents_wrap .main_section_title .btn_wrap { margin-top: 32px; }
.main_resister_contents_wrap img { display: block; }
.main_resister_img_wrap { padding-left: 21px; }
.main_resister_img_wrap figure { padding-top: 115%; position: relative; background: rgb(221, 221, 221); }
.main_resister_img_wrap img { display: block; width: 100%; position: absolute; top: 0px; left: 0px; }
.circ { transform: scale(0.5) rotate(-90deg); transition: transform 0.3s ease 0s, -webkit-transform 0.3s ease 0s; }
.circ circle { stroke-dasharray: 440px; }
.circ1 { stroke-dashoffset: 440px; }
.swiper-slide { }
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0px; }
.swiper-pagination { position: relative; }
.swiper-pagination-bullet { width: auto; height: auto; background: 0px center; }
.swiper-pagination-bullet-active .circ { transform: scale(1) rotate(-90deg); }
.swiper-pagination-bullet-active .circ1 { stroke-dashoffset: 220px; transition: stroke-dashoffset 2s linear 0s; }