@charset "utf-8";

/*───────────────────────────────────────────────────────────
	input
───────────────────────────────────────────────────────────*/
    #wrap :where(input[type="text"], input[type="password"], input[type="number"], select){border:1px solid var(--border-color01);height: 60px;line-height: normal;padding:0 20px;background: var(--point-white);box-sizing: border-box;font-size: var(--title-18);font-weight: 500;color: var(--black-color03); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
    #wrap select{appearance: none; background:var(--point-white) url('../images/sub/select_arw.svg') no-repeat calc(100% - 20px) 50%; padding-right: 45px;}
    #wrap input[type="checkbox"] + label{display: flex; align-items: flex-start; gap: 0 4px; font-size: var(--title-17); font-weight: 400; color: var(--black-color06); line-height: 25px; }
        #wrap input[type="checkbox"] + label:before{display: inline-flex; content:''; width: 25px; height: 25px; margin:0 8px 0 0; flex-shrink: 0; background: url('../images/sub/checkbox.svg') no-repeat left center / 100% auto;}
        #wrap input[type="checkbox"]:checked + label:before{background-image: url('../images/sub/checkbox_on.svg');}
    #wrap input[type="checkbox"] + label em{font-weight: inherit; color: var(--point-color01);}

    @media screen and (max-width:1024px){
        #wrap :where(input[type="text"], input[type="password"], input[type="number"], select){height: 55px;}
    }
    @media screen and (max-width:640px){
        #wrap :where(input[type="text"], input[type="password"], input[type="number"], select){height: 50px; padding:0 15px;}
        #wrap select{background-position:calc(100% - 15px) 50%; padding-right: 40px;}
        #wrap input[type="checkbox"] + label{line-height: 23px; }
        #wrap input[type="checkbox"] + label:before{width: 23px; height: 23px; margin:0 5px 0 0;}
    }
    @media screen and (max-width:479px){
        #wrap :where(input[type="text"], input[type="password"], input[type="number"], select){height: 45px;}
        #wrap input[type="checkbox"] + label{line-height: 20px; }
        #wrap input[type="checkbox"] + label:before{width: 20px; height: 20px; margin:0 3px 0 0;}
    }

/*───────────────────────────────────────────────────────────
	button common
───────────────────────────────────────────────────────────*/
        .btn, .btn_lg, .btn_sm, .btn_md {position: relative; display:inline-flex; align-items: center; justify-content: center; font-weight: 500; border:1px solid var(--black-color06); color: var(--black-color06); line-height: 1.4; border-radius: 60px; box-sizing: border-box; transition:all 0.6s;}
        
        #wrap .btn{width: 180px; height: 70px; font-size: var(--title-20); font-weight: 500; line-height: 1.4; border-radius: 60px; }

		/* button 색상별 */
        #wrap .btn_point{font-weight: 400; background: var(--black-color01); border:0; color: var(--point-white);}
        #wrap .btn_point:before{position: absolute; content:''; width: calc(100% - 30px); height: calc(100% - 20px); background: var(--point-color01); border-radius: 60px; top:50%; left:50%; transform: translate(-50%, -50%); box-sizing: border-box; opacity: 0; transition: all 0.6s;z-index:-1;}
        #wrap .btn_point span{position: relative; display: block; }

           @media only screen and (min-width:1024px){
                #wrap .btn_point:hover{background: var(--transparent);}
                #wrap .btn_point:hover:before{width: 100%; height: 100%; opacity: 1;}
            }



		#wrap .btn_basic{border-color:var(--black-color07); background:var(--black-color07); color:var(--point-white);}
		#wrap .btn_default{border-color:var(--black-color10); background-color:var(--black-color10); color:var(--point-white);}
		#wrap .btn_info{border-color:var(--border-color01); background-color:var(--point-white); color:var(--black-color05);}

        .btn_wrap{display: inline-flex; justify-content: center; text-align: center; flex-wrap: wrap; gap: 10px; padding:70px 0 0;}
        .btn_wrap.ta_center{width: 100%;}
		.view_btn .btn_wrap.ta_right {position:absolute;right:0;top:0;}

        @media screen and (max-width:1024px){
            .btn_wrap{padding-top: 60px;}
            #wrap .btn{width: 160px; height: 65px;}
        }
        @media screen and (max-width:860px){
            .btn_wrap{padding-top: 50px;}
            #wrap .btn{width: 140px; height: 60px;}
        }
        @media screen and (max-width:640px){
            .btn_wrap{padding-top: 40px;}
            #wrap .btn{width: 120px;height: 55px;}
        }
        @media screen and (max-width:479px){
            .btn_wrap{padding-top: 30px;}
            #wrap .btn{width: 110px;height: 50px;}
        }

/*───────────────────────────────────────────────────────────
	board
───────────────────────────────────────────────────────────*/
    /* 리스트 */
        #wrap .search_wrap{margin: 46px 0 50px;}
        #wrap .search_wrap fieldset{display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px;}
        #wrap .search_wrap .board_search_sel{display: flex; gap: 10px; width: 160px;}
        #wrap .search_wrap .board_search_sel select{width: 100%;}
        #wrap .search_wrap .inp_box{display: flex; width: 400px;}
        #wrap .search_wrap .input_text{width: 100%;}
        #wrap .search_wrap .search_btn{display: flex; min-width: 60px; background: var(--black-color01) url('../images/sub/search_btn.svg') no-repeat center; font-size: 0; border:0;}
        
        #wrap .bbs_num{display: none;}
        #wrap .board_table{width: 100%; font-size: var(--title-20); text-align: center; border-top: 1px solid var(--black-color01);}
        #wrap .board_table tr{border-bottom: 1px solid var(--border-color01); }
        #wrap .board_table thead th{font-size: inherit;font-weight: 600;color: var(--black-color03);padding: 21px 10px 18px;vertical-align: middle;}
        #wrap .board_table tbody td{font-size: 90%;font-weight: 400;color: var(--black-color07);padding: 20px 15px;vertical-align: middle;}
		#wrap .board_table tr.board_notice .notice{display: inline-flex;box-sizing:border-box;align-items: center;justify-content: center;height:30px;background:var(--point-color01);font-size:90%;color:var(--point-white);font-weight:500;border-radius:15px;padding:0 10px;}
        #wrap .board_table .board_tit .board_ico{display: contents;}
        #wrap .board_table .board_tit h3{font-family: var(--font-type01);font-size: 105.5%;font-weight: 500;color: var(--black-color03);text-align: left;letter-spacing: -0.05em;white-space:normal;overflow:hidden;text-overflow:ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
        #wrap .board_table .board_tit strong{font-weight:inherit;}

        #wrap .paging {padding:80px 0 0; line-height:normal; margin:0;box-sizing:border-box; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; text-align: center; font-size: var(--title-20); gap: 10px;}
        #wrap .paging span {display:inline-block;}
        #wrap .paging a {display:inline-flex;align-items: center;justify-content: center;font-size: 90%; font-weight: 400; color:var(--black-color08);padding:0 5px;border:0;box-sizing:border-box;width: 40px;height: 40px;line-height:1.2;min-width:auto;}
        #wrap .paging :is(.on a, a.on){background: var(--black-color01);color: var(--point-white);font-weight: 500;}
        #wrap .paging .arrow a {font-size:0; background: url("../images/sub/paging_first.svg") no-repeat center;}
        #wrap .paging :is(.arrow.prev a, .arrow.next a) {background-image:url("../images/sub/paging_prev.svg") }
        #wrap .paging :is(.arrow.next a, .arrow.last a){transform: scale(-1,-1);}
        #wrap .view_btn {text-align:center;line-height:normal;position:relative;min-height:70px;}

        #wrap .paging + .btn_wrap{position: relative;padding:0;margin:-55px 0 0;display: flex;justify-content: flex-end;pointer-events: none;top: auto;right: auto;}
        #wrap .paging + .btn_wrap a{pointer-events: all;}

        @media screen and (max-width:1024px){
            #wrap .search_wrap{margin:40px 0 45px;}
            #wrap .search_wrap .search_btn{min-width: 55px;}

            #wrap .board_table.default col:nth-child(1){width:80px;}
            #wrap .board_table.default col:nth-child(3){width:120px;}
            #wrap .board_table.default col:nth-child(4){width:120px;}

			#wrap .view_btn{min-height:65px;}
            #wrap .paging{padding-top: 70px;}
            #wrap .paging + .btn_wrap{margin-top: -53px;}
        }
        @media screen and (max-width:860px){
            #wrap .search_wrap{margin:35px 0 40px;}
            #wrap .search_wrap .board_search_sel{width: 140px;}
            #wrap .search_wrap .inp_box{width: 360px;}

            #wrap .board_table.default col:nth-child(1){width:70px;}
            #wrap .board_table.default col:nth-child(4){width:110px;}
            #wrap .board_table.default :is(col, th, td):nth-child(3){display: none;}

			#wrap .view_btn{min-height:60px;}
            #wrap .paging{padding-top: 60px;}
            #wrap .paging a{width: 36px; height: 36px;}
            #wrap .paging + .btn_wrap{margin-top: -48px;}
        }
        @media screen and (max-width:640px){
            #wrap .search_wrap{margin:30px 0 35px;}
            #wrap .search_wrap .board_search_sel{width: 120px;}
            #wrap .search_wrap .inp_box{width: 320px;}
            #wrap .search_wrap .search_btn{min-width: 50px;}

            #wrap .board_table.default col:nth-child(1){width:65px;}
            #wrap .board_table.default col:nth-child(4){width:100px;}

			#wrap .view_btn{min-height:55px;}
            #wrap .paging{padding-top: 50px;}
            #wrap .paging a{width: 32px; height: 32px;}
            #wrap .paging + .btn_wrap{margin-top: -44px;}
        }
        @media screen and (max-width:479px){
            #wrap .search_wrap{margin:25px 0 30px;}
            #wrap .search_wrap .board_search_sel{width: 100px;}
            #wrap .search_wrap .inp_box{width: calc(100% - 110px);}
            #wrap .search_wrap .search_btn{min-width: 45px; background-size: 20px auto;}

            #wrap .board_table.default col:nth-child(1){width:60px;}
            #wrap .board_table.default :is(col, th, td):nth-child(4){display: none;}
            #wrap .board_table thead th{padding:17px 10px;}
            #wrap .board_table tbody td{padding:17px 10px;}

			#wrap .view_btn{min-height:50px;}
            #wrap .paging{padding-top: 40px;}
            #wrap .paging a{width: 30px; height: 30px;}
            #wrap .paging + .btn_wrap{margin-top: 20px;}
        }
        @media screen and (max-width:360px){
            #wrap .search_wrap .board_search_sel{width: 100%;}
            #wrap .search_wrap .inp_box{width: 100%}
        }

    /* write */
        #wrap .bbs_write{display: block; width: 100%; box-sizing: border-box;}
            #wrap .bbs_write.bbs_title{border-top: 1px solid var(--black-color01); padding-top: 20px;}
            #wrap .bbs_write.bbs_bottom{border-bottom: 1px solid var(--border-color01); padding-bottom: 20px;}
        #wrap .bbs_write :where(thead, tbody, tr, th, td){display: block;}
        #wrap .bbs_write tbody{display: flex; flex-wrap: wrap; gap:0 20px;}
        #wrap .bbs_write tbody tr{display: flex; flex-wrap:wrap; gap:10px 0; width: calc(100% / 2 - 10px); padding:10px 0;font-size: var(--title-20);}
            #wrap .bbs_write tbody tr:has(.edit-box, #captcha){width: 100%;}
        #wrap .bbs_write tbody :where(th, td){font-size: 90%; font-weight: 500; color: var(--black-color03); border:0; box-sizing: border-box;}
        #wrap .bbs_write tbody th{width: 170px; background: none; padding:0 20px; }
            #wrap .bbs_write tbody tr:has(input) th{line-height: 60px;}
        #wrap .bbs_write tbody td{width: calc(100% - 170px); padding:0 20px 0 0; }
        #wrap .bbs_write :where(input[type="text"], input[type="password"], input[type="number"], select){width: 100%; min-width: auto;}
        #wrap .bbs_write tbody tr:has(#is_secret-y) .edit-box{margin-top: 10px;}
        #wrap .bbs_write tbody td:has(.captcha_wrap){display: flex; flex-wrap: wrap; gap: 10px;}
        #wrap .bbs_write .captcha_wrap{border:1px solid var(--border-color01); padding:9px; box-sizing: border-box; display: flex; gap: 9px;}
        #wrap .bbs_write #captcha_box{margin:0;}
        #wrap .bbs_write #refreshCode{display: inline-flex; background: url('../images/common/icon_btn_reset.gif') no-repeat center; font-size: 0; cursor: pointer; min-width: 40px; width: 40px; height: 40px; border:1px solid var(--border-color01); box-sizing: border-box;}
        #wrap .bbs_write input#captcha{max-width: 300px; margin:0;}
        #wrap .policy_wrap{border:1px solid var(--border-color01); padding:30px; box-sizing: border-box; margin-top: 40px;}
        #wrap .policy_wrap .area_box{margin-top: 20px;}
        #wrap .area_box{width: 100%; padding:10px; background: var(--gray-bg01); box-sizing: border-box;}
        #wrap .area_box textarea{width: 100%; padding:5px 7px; border:0; background: none; box-sizing: border-box; font-size: var(--title-14); font-weight: 400; color: var(--black-color08); line-height: 1.6; font-family: var(--font-type01);}
            #wrap .area_box textarea::-webkit-scrollbar { width: 4px;}
            #wrap .area_box textarea::-webkit-scrollbar-thumb {background: var(--black-color11); border-radius: 10px;}
            #wrap .area_box textarea::-webkit-scrollbar-track {border-radius: 10px;background:var(--border-color01);}

        @media screen and (min-width:641px){
            #wrap .bbs_write input#captcha{height: auto;}
        }


        @media screen and (max-width:1024px){
            #wrap .bbs_write tbody{gap: 0 15px;}
            #wrap .bbs_write tbody tr{width: calc(100% / 2 - 7.5px);}
            #wrap .bbs_write tbody tr:has(input) th{line-height: 55px;}
            #wrap .bbs_write tbody th{width: 150px;}
            #wrap .bbs_write tbody td{width: calc(100% - 150px);}
            #wrap .bbs_write .captcha_wrap{padding:6px; gap: 6px;}
        }
        @media screen and (max-width:860px){
            #wrap .bbs_write tbody{gap: 0;}
            #wrap .bbs_write tbody th{width: 130px;}
            #wrap .bbs_write tbody td{width: calc(100% - 130px);}
            #wrap .policy_wrap{padding:25px; margin-top: 35px;}
            #wrap .policy_wrap .area_box{margin-top: 15px;}
        }
        @media screen and (max-width:767px){
            #wrap .bbs_write input#captcha{width: calc(100% - 250px);}
        }
        @media screen and (max-width:640px){
            #wrap .bbs_write.bbs_title{padding-top: 15px;}
            #wrap .bbs_write.bbs_bottom{padding-bottom: 15px;}
            #wrap .bbs_write tbody tr{width: 100%;}
            #wrap .bbs_write tbody th{width: 120px; padding:0 15px;}
                #wrap .bbs_write tbody tr:has(input) th{line-height: 50px;}
            #wrap .bbs_write tbody td{width: calc(100% - 120px); padding-right: 15px;}
            #wrap .bbs_write input#captcha{width:100%; max-width: 100%;}
            #wrap .policy_wrap{padding:20px; margin-top: 30px;}
            #wrap .policy_wrap .area_box{margin-top: 10px;}
        }
        @media screen and (max-width:479px){
            #wrap .bbs_write tbody tr{padding:7.5px 0;}
                #wrap .bbs_write tbody tr:has(input) th{line-height: 45px;}
            #wrap .bbs_write tbody th{width: 115px;}
            #wrap .bbs_write tbody td{width: calc(100% - 115px);}
        }
        @media screen and (max-width:360px){
            #wrap .bbs_write tbody th{width: 100%; padding:0;}
                #wrap .bbs_write tbody tr:has(input) th{line-height: 1.4;}
            #wrap .bbs_write tbody td{width: 100%; padding:0;}
        }

    /* gallery list */
        #wrap .gallery_list{position: relative;display: flex;flex-wrap: wrap;gap: 51px 60px;}
        #wrap .gallery_list > li{position: relative; width: calc(100% / 3 - 40px); box-sizing: border-box;}
        #wrap .gallery_list .link{position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: 5;}
        #wrap .gallery_list .desc{font-size: var(--title-20); font-family: var(--font-type01); text-align: center;}
        #wrap .gallery_list .desc dt{position: relative;font-size: 0;padding-bottom: calc(134% - 2px);box-sizing: border-box;box-shadow: 0 0 0 1px var(--border-color01); transition: all 0.4s;}
        #wrap .gallery_list .desc dt + dd{margin-top: 22px;}
        #wrap .gallery_list .desc dt img{position: absolute;top:0;left:0;width: 100%;height: 100%;object-fit: cover;}
        #wrap .gallery_list .desc dd{font-size: inherit;font-weight: 500;color: var(--black-color00);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

            #wrap .gallery_list.logo{gap: 40px 20px;}
            #wrap .gallery_list.logo > li{width: calc(100% / 4 - 15px);}
            #wrap .gallery_list.logo .desc dt{padding-bottom: calc(42.8% - 2px);}

            #wrap .gallery_list > li:hover .desc dt{box-shadow: 0 0 0 1px var(--point-color01);}

        @media screen and (max-width:1200px){
            #wrap .gallery_list{gap: 50px;}
            #wrap .gallery_list > li{width: calc(100% / 3 - 33.34px);}
        }
        @media screen and (max-width:1023px){
            #wrap .gallery_list{gap:40px;}
            #wrap .gallery_list > li{width: calc(100% / 3 - 26.67px);}

                #wrap .gallery_list.logo{gap: 30px 15px;}
                #wrap .gallery_list.logo > li{width: calc(100% / 4 - 11.25px);}
        }
        @media screen and (max-width:860px){
            #wrap .gallery_list{gap:30px;}
            #wrap .gallery_list > li{width: calc(100% / 3 - 20px);}
            #wrap .gallery_list .desc dt + dd{margin-top: 17px;}
        }
        @media screen and (max-width:640px){
            #wrap .gallery_list{gap:30px 20px;}
            #wrap .gallery_list > li{width: calc(100% / 2 - 10px);}

                #wrap .gallery_list.logo > li{width: calc(100% / 3 - 10px);}
        }
        @media screen and (max-width:479px){
            #wrap .gallery_list{gap:30px 15px;}
            #wrap .gallery_list > li{width: calc(100% / 2 - 7.5px);}
            #wrap .gallery_list .desc dt + dd{margin-top: 12px;}

                #wrap .gallery_list.logo > li{width: calc(100% / 2 - 7.5px);}
        }
        @media screen and (max-width:360px){
            #wrap .gallery_list > li{width: 100%;}
        }

    /* view */
        #wrap .bbs_view .view_tit{padding: 32px 30px 25px;border-top: 2px solid var(--black-color01);border-bottom: 1px solid var(--border-color01);background: none;font-size: var(--title-20);}
        #wrap .bbs_view .view_tit h3{font-size: 130%;font-weight: 600;color: var(--black-color03);line-height: 1.4;letter-spacing: -0.03em;width: 100%;font-family: var(--font-type01);}
        #wrap .bbs_view .view_tit p{display: flex;align-items: center;flex-wrap: wrap;margin-top: 11px;width: 100%;font-size: var(--title-20);text-align: inherit;padding:0;}
        #wrap .bbs_view .view_tit p span{font-size: 85%;font-weight: 400;color: var(--black-color08);letter-spacing: -0.03em;display: flex;align-items: center;gap: 4px;}
        #wrap .bbs_view .view_tit p em{font-size: inherit; font-weight: inherit; display: none;}
        #wrap .bbs_view .view_tit p span:not(:last-child):after{display: inline-flex; content:''; width: 1px; height: 12px; background: var(--border-color02); margin:0 16px;}
        #wrap .bbs_view .view_tit p span:last-child em{display: block;}
        #wrap .bbs_view .view_cont{padding:30px; font-size: var(--title-17); font-weight: 400; color: var(--black-color06); line-height: 1.88; letter-spacing: -0.03em; font-family: var(--font-type01); min-height: 248px; border-bottom: 1px solid var(--border-color01); box-sizing: border-box; word-break: break-all;}
        #wrap .extra_editor_wrap{display: flex;margin:-1px 0 0;border-top: 1px solid var(--border-color01);border-bottom: 1px solid var(--border-color01);font-size: var(--title-20);align-items: center;background: var(--gray-bg02);}
        #wrap .extra_editor_wrap h4{width: 120px;padding: 15px 10px;font-size: 90%;font-weight: 500;color: var(--black-color03);letter-spacing: -0.03em;background: none;box-sizing: border-box;line-height: 1.4;text-align: center;}
        #wrap .extra_editor_wrap .extra_cont{position: relative;width: calc(100% - 120px);display: flex;flex-direction: column;gap: 10px;padding: 20px 29px;box-sizing: border-box;background: var(--point-white);}
            #wrap .extra_editor_wrap .extra_cont:before{position: absolute; content:''; width: 1px; height: 12px; background: var(--border-color03); top:50%; left:0; transform: translateY(-50%);}
        #wrap .extra_editor_wrap .extra_cont span{display: block;font-size: 85%;font-weight: 300;color: var(--black-color05);letter-spacing: -0.03em;line-height: 1.4;font-family: var(--font-type01);}
        #wrap .extra_editor_wrap .extra_cont a{color: inherit !important;}

        @media screen and (max-width:1023px){
            #wrap .bbs_view .view_tit{padding: 28px 25px 25px;}
            #wrap .bbs_view .view_tit p{}
            #wrap .bbs_view .view_cont{padding:25px; min-height: 220px;}
            #wrap .extra_editor_wrap h4{width: 110px;}
            #wrap .extra_editor_wrap .extra_cont{width: calc(100% - 110px);padding:20px 25px;}
        }
        @media screen and (max-width:640px){
            #wrap .bbs_view .view_tit{padding: 20px;}
            #wrap .bbs_view .view_tit p{margin-top: 8px;}
            #wrap .bbs_view .view_tit p span:not(:last-child):after{height: 10px; margin:0 12px;}
            #wrap .bbs_view .view_cont{padding:20px; min-height: 200px;}
            #wrap .extra_editor_wrap h4{width: 100px;}
            #wrap .extra_editor_wrap .extra_cont{width: calc(100% - 100px);padding: 20px;}
        }
        @media screen and (max-width:479px){
            #wrap .bbs_view .view_tit p{margin-top: 10px;}
            #wrap .bbs_view .view_tit p span:not(:last-child):after{height: 8px; margin:0 10px;}
            #wrap .bbs_view .view_cont{padding:15px; min-height: 180px; line-height: 1.6;}
            #wrap .extra_editor_wrap h4{width: 90px;}
            #wrap .extra_editor_wrap .extra_cont{width: calc(100% - 90px);padding:20px 15px;}
        }


/*───────────────────────────────────────────────────────────
	factory
───────────────────────────────────────────────────────────*/
    #wrap:has(.full_sec) #contents_wrap{width: 100%; max-width: 100%;}

    .sub_title{position: relative; font-size: var(--title-20); box-sizing: border-box;}
        .sub_title.hd{margin-bottom: 42px;}
        .sub_title.cen{text-align: center;}
    .sub_title h2{font-size: 300%; font-weight: 700; color: var(--black-color00); letter-spacing: -0.03em;line-height: 1.2;}
        .sub_title h2 + h4{margin-top:25px;}
    .sub_title h4{font-size: 160%;font-weight: 500;color: var(--black-color01);letter-spacing: -0.03em;line-height: 1.3;font-family: var(--font-type01);}
    .sub_title h4.square{display: flex;align-items: baseline;}
    .sub_title h4.square:before{display: inline-flex;content:'';width: 10px;height: 10px;background: var(--point-color01);margin-right: 20px;transform: translateY(-9px); flex-shrink:0;}

    .info_table{position: relative; border-top: 2px solid var(--black-color01);}
    .info_table table{width: 100%; font-size: var(--title-20);}
    .info_table tr{border-bottom: 1px solid var(--border-color01);}
    .info_table tbody :where(th, td){font-size: 90%; font-family: var(--font-type01); text-align: center; padding:15px 10px;}
        .info_table tbody :where(th, td):not(:last-child){border-right:1px solid var(--border-color01);}
    .info_table tbody th{font-weight: 500; color: var(--black-color03); background: var(--gray-bg02);}
    .info_table tbody td{font-weight: 400; color: var(--black-color06);}
    .info_table tbody td strong{font-weight: 500; color: var(--black-color03);}

    .sub_factory .cont + .cont{margin-top: 102px;}
    .factory_wide_bnr{position: relative; background: url('../images/sub/sub_factory_wide.jpg') no-repeat center / cover; height: 672px; box-sizing: border-box;}
    .factory_wide_bnr .w_custom{display: flex; flex-wrap: wrap; gap: 30px; align-items: center; justify-content: space-between; height: 100%;}
    .factory_wide_bnr .txt_wrap{font-size: var(--title-20); font-family: var(--font-type01); color: var(--point-white);}
    .factory_wide_bnr .txt_wrap h3{font-size: 200%;font-weight: 600;line-height: 1.5;letter-spacing: -0.04em;}
    .factory_wide_bnr .txt_wrap h3 + h6{margin-top: 42px;}
    .factory_wide_bnr .txt_wrap h6{font-size: inherit;font-weight: 300;line-height: 1.6;letter-spacing: -0.04em;}
    .factory_wide_bnr .wide_bnr .icon{display: block; font-size: 0; transform: translateX(2vw);}

    .sub_factory .sub_title.hd + .icon_exp{margin-top: -0.6vw;}
    .sub_factory .thumb_list{position: relative; display: flex;flex-wrap: wrap;gap: 158px 40px;}
        .sub_factory .thumb_list + .thumb_list{margin-top: 104px;}
        .sub_factory .thumb_list:has(.desc dd) + .thumb_list{margin-top: 147px;}
        .sub_factory .thumb_list.bg{padding: 9px;background: var(--gray-bg03);border-radius: 20px;border:1px solid var(--border-color01);box-sizing: border-box;row-gap: 20px;}
        .sub_factory .thumb_list.bg li{position: static;}
        .sub_factory .thumb_list:last-child:has(.desc){margin-bottom: 200px;}
    .sub_factory .thumb_list li{position: relative; width: calc(100% / 2 - 20px); box-sizing: border-box;}
    .sub_factory .thumb_list li.bk{width: 100%;}
    .sub_factory .thumb_list .thumb{position: relative; display: block; font-size: 0; border-radius: 20px; overflow: hidden; height: 100%;}
    .sub_factory .thumb_list .thumb video{width: 100%; height: 100%; object-fit: cover;}
    .sub_factory .thumb_list .desc{font-size: var(--title-20);font-family: var(--font-type01);position: absolute;top: calc(100% + 15px);left: 0;}
    .sub_factory .thumb_list .desc dt{font-size: 130%;font-weight: 500;color: var(--black-color00);line-height: 1.35;letter-spacing: -0.04em;}
    .sub_factory .thumb_list .desc dt + dd{margin-top: 12px;}
    .sub_factory .thumb_list .desc dd{font-size: 90%;font-weight: 400;color: var(--black-color06);line-height: 1.5;letter-spacing: -0.04em;}

    .icon_exp{overflow: hidden;}
    .icon_exp > li{position: relative; float:left; width: calc(100% / 6 - 60px); margin-right:72px; vertical-align: top;}
        .icon_exp > li:nth-child(6n){margin-right: 0;}
        .icon_exp > li:nth-child(n+7){float:right;margin-top: 80px;margin-right: 0;margin-left: 72px;}
        .icon_exp > li:nth-child(12n){margin-left: 0;}
        .icon_exp > li + li .desc dt:before{position: absolute;content:'';width: 20px;height: 20px;border: 2px solid var(--transparent);border-top-color: var(--black-color09);border-right-color: var(--black-color09);top:50%;right:calc(100% + 30px);transform: translateY(-50%) rotate(45deg);border-radius: 2px;}
        .icon_exp > li:nth-child(7) .desc dt:before{top:auto;bottom: calc(100% + 33px);right:50%;transform: translateX(50%) rotate(135deg);}
        .icon_exp > li:nth-child(n+8) .desc dt:before{right:auto; left:calc(100% + 30px); transform: translateY(-50%) rotate(45deg) scale(-1, -1);}

    .icon_exp .desc{font-size: var(--title-20); text-align: center;}
    .icon_exp .desc dt{position: relative; display: flex; align-items: center; justify-content: center; width: 100%; padding-bottom: 100%; border-radius: 100%; background: var(--gray-bg02); box-sizing: border-box;}
    .icon_exp .desc dt img{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);padding: 20px;box-sizing: border-box;}
    .icon_exp .desc dt + dd{margin-top: 18px;}
    .icon_exp .desc dd{font-size: 90%;font-weight: 400;color: var(--black-color06);line-height: 1.5;}

    .systems_wrap{display: flex; flex-wrap: wrap; gap: 40px;}
    .systems_wrap .circle{width: 240px; border:1px solid var(--border-color01); border-radius: 20px; padding:20px; display: flex; flex-direction: column; align-items: center; justify-content: center; box-sizing: border-box; font-size: var(--title-20);}
        .systems_wrap .circle + .chart:before{position: absolute;content:'';width: 60px;height: 52px;top:50%;right:calc(100% - 10px);background: var(--point-color02); margin-top: -26px; clip-path: polygon(0% 34%, 60% 34%, 60% 0%, 100% 50%, 60% 100%, 60% 66%, 0% 66%);}
    .systems_wrap .circle span{position: relative; display: flex; align-items: center; justify-content: center; width: 160px; height: 160px; background: rgba(221, 221, 221, 0.5); border-radius: 100%; font-size: 90%; font-weight: 400; color: var(--black-color01);}
        .systems_wrap .circle span + span{margin-top: -20px;}
        .systems_wrap .circle span.point{background: var(--point-color02); z-index: 5; color: var(--point-white); font-weight: 600;}
    .systems_wrap .chart{position: relative; width: calc(100% - 280px); border:1px solid var(--border-color01); background: var(--gray-bg02); box-sizing: border-box; border-radius: 20px; padding:30px 40px;}
    .systems_wrap .box_list{position: relative; display: flex; gap: 20px; font-size: var(--title-20);}
        .systems_wrap .box_list + .box_list{margin-top: 20px;}
        .systems_wrap .box_list + .box_list.arw_dn{margin-top: 10px;}
        .systems_wrap .box_list.title + .item{margin-top:40px;padding-left: 74px;}
    .systems_wrap .box_list li{position: relative;display: flex;align-items: center;justify-content: center;border: 1px solid var(--black-color06);background: var(--point-white);box-sizing: border-box;border-radius: 10px;font-size: 80%;font-weight: 500;color: var(--black-color01);padding: 0 5px;width: calc(100% / 4 - 15px);height: 80px;text-align: center;}
        .systems_wrap .box_list li.point{background: var(--black-color06); color: var(--point-white); font-size: 90%; font-weight: 600; }
        .systems_wrap .box_list li.blank{border-color: var(--transparent); background: none;}
        .systems_wrap .box_list li + li:before{position: absolute;content:'';width: 14px;height: 12px;background: var(--black-color08);top:50%;right:calc(100% + 4px);margin-top:-6px;clip-path: polygon(0% 35%, 60% 35%, 60% 0%, 100% 50%, 60% 100%, 60% 65%, 0% 65%);}
        .systems_wrap .box_list li.blank + li.blank:before{display:none;}

        .systems_wrap .box_list.title{z-index: 5;}
        .systems_wrap .box_list.title li{width: 100%;height: 100px;font-size: 90%;font-weight: 600;border-color: var(--point-color02);border-width: 2px;}

        .systems_wrap .box_list.blue li{border-color: var(--point-color03);border-width: 2px;}
            .systems_wrap .box_list.blue li.point{background: var(--point-color03);}
            .systems_wrap .box_list.blue li + li:before{background: var(--point-color03);}

        .systems_wrap .box_list.red li{border-color: var(--point-color04);}
            .systems_wrap .box_list.red li.point{background: var(--point-color04);}
            .systems_wrap .box_list.red li + li:before{background: var(--point-color04);}

    .systems_wrap .item{position: relative; width: 100%; box-sizing: border-box;}
    .systems_wrap .item .box_list:not(.arw_dn):before{position: absolute;content:'';width: 20px;border-top: 1px dashed var(--black-color06);top:50%;right:calc(100% + 10px);margin-top: -0.5px;}
    .systems_wrap .item .box_list:not(.arw_dn):after{position: absolute;content:'';height: 81px;border-left: 1px dashed var(--black-color06);bottom:50%;right: calc(100% + 29px);}

    .systems_wrap .item .box_list:not(.arw_dn) li.point:before{position: absolute;content:'';width: 4px;height: 4px;border:1px solid var(--transparent);border-top-color: var(--black-color06);border-right-color: var(--black-color06);top: calc(50% - 1px);right:calc(100% + 10px);transform: translateY(-50%) rotate(45deg);}

    .systems_wrap .item .box_list.blue:before, .systems_wrap .item .box_list.blue:after{border-color: var(--point-color03);}
    .systems_wrap .item .box_list.blue li.point:before{border-top-color: var(--point-color03);border-right-color: var(--point-color03);}

    .systems_wrap .item .box_list + .box_list:before{width: 40px;}
    .systems_wrap .item .box_list + .box_list:after{height: 181px;right: calc(100% + 50px);}

    .systems_wrap.add .box_list.title + .item{padding-left: 172px;}
    .systems_wrap.add .box_list.red{transform: translateX(calc(-25.1% - 5px));}
    .systems_wrap.add .item .box_list + .box_list:before, .systems_wrap.add .item .box_list + .box_list:after{display: none;}
    .systems_wrap.add .item .box_list.blue li.point:after{position: absolute;content: '';width: 14px;height: 12px;background: var(--point-color03);top: calc(100% + 12px);left: 50%;margin-top: -6px;margin-left: -6px;clip-path: polygon(0% 35%, 60% 35%, 60% 0%, 100% 50%, 60% 100%, 60% 65%, 0% 65%);transform: rotate(90deg);}
    .systems_wrap.add .item .box_list.arw_dn li.point:after{position: absolute;content: '';width: 14px;height: 12px;background: var(--black-color08);bottom: calc(100% + 5px);left: 50%;margin-top: -6px;margin-left: -6px;clip-path: polygon(0% 35%, 60% 35%, 60% 0%, 100% 50%, 60% 100%, 60% 65%, 0% 65%);transform: rotate(90deg);}
    .systems_wrap.add .item .box_list.red li.point:before{top:auto;bottom: calc(100% + 9px);right: calc(50% - 0px);transform: translateX(50%) rotate(135deg);}
    .systems_wrap.add .item .box_list.red li.point:after{position: absolute;content:'';height: 130px;border-left: 1px dashed var(--black-color06);left:50%;bottom: calc(100% + 10px);}
    .systems_wrap.add .item .box_list + .box_list.arw_dn{margin-top: 20px;}


    @media screen and (max-width:1200px){
        .systems_wrap .chart{padding:30px;}
    }
    @media screen and (max-width:1100px){
        .systems_wrap .box_list li{font-size: 75%;}
    }
    @media screen and (max-width:1024px){
        .sub_title.hd{margin-bottom: 37px;}

        .factory_wide_bnr{height: auto; padding:22vw 0;}
        .factory_wide_bnr .w_custom{height: auto;}
        .factory_wide_bnr .txt_wrap h3 + h6{margin-top: 37px;}

        .icon_exp > li{width: calc(100% / 6 - 5.84vw); margin-right: 7vw;}
            .icon_exp > li:nth-child(n+7){margin-left: 7vw; margin-top: 7.2vw;}
            .icon_exp > li:nth-child(12n){margin-left: 0;}

            .icon_exp > li + li .desc dt:before{width: 2vw; height: 2vw; right: calc(100% + 3vw);}
            .icon_exp > li:nth-child(7) .desc dt:before{bottom:calc(100% + 3.1vw);}
            .icon_exp > li:nth-child(n+8) .desc dt:before{left:calc(100% + 3vw);}
        .icon_exp .desc dt + dd{margin-top: 13px;}
        .icon_exp .desc dd{font-size: 80%;}

        .sub_factory .thumb_list{column-gap: 30px;}
        .sub_factory .thumb_list li{width: calc(100% / 2 - 15px);}

        .systems_wrap .circle{width: 100%; flex-direction: row;}
            .systems_wrap .circle + .chart:before{top:auto;bottom: calc(100% - 7px);right: 50%;margin: 0 -30px 0 0;}
        .systems_wrap .circle span + span{margin:0 0 0 -20px;}
        .systems_wrap .chart{width: 100%;}
        .systems_wrap .item .box_list:not(.arw_dn) li.point:before{top:50%;}
    }
    @media screen and (max-width:860px){
        .sub_title.hd{margin-bottom: 32px;}

        .sub_factory .thumb_list{column-gap: 20px;}
        .sub_factory .thumb_list li{width: calc(100% / 2 - 10px);}
        .sub_factory .thumb_list.bg{row-gap: 15px;}

        .factory_wide_bnr:before{position: absolute; content:''; top:0; left:0; width: 100%; height: 100%; background: rgba(0,0,0,0.4);}
        .factory_wide_bnr .txt_wrap h3 + h6{margin-top: 32px;}
        .factory_wide_bnr .icon{width: 25vw; min-width:100px}

        .systems_wrap .circle span{width: 140px; height: 140px;}
        .systems_wrap .chart{padding:25px;}
        .systems_wrap .box_list.title li{height: 80px;}
    }
    @media screen and (max-width:767px){
        .systems_wrap .circle span{width: 130px; height: 130px;}
        .systems_wrap .circle span + span{margin-left: -15px;}
        .systems_wrap .box_list li{font-size: 70%;}
        .systems_wrap.add .box_list.title + .item{padding-left: 140px;}

        .icon_exp > li{width: calc(100% / 4 - 5.25vw); margin-right: 7vw;}
        .icon_exp > li:nth-child(n+4){float:left; margin-right: 0; margin-left: 0;}
        .icon_exp > li:nth-child(n+5){float:right; margin-left: 7vw; margin-top: 7.2vw;}
        .icon_exp > li:nth-child(n+8){float:right; margin-right: 0; margin-left: 0;}
        .icon_exp > li:nth-child(n+9){float:left; margin-left:0; margin-right: 7vw; clear: both;}
        .icon_exp > li:nth-child(n+10){ clear: none;}
        .icon_exp > li:nth-child(n+12){margin-right: 0;}

        .icon_exp > li:nth-child(n+5) .desc dt:before{top:auto; bottom:calc(100% + 3.1vw); left:auto; right:50%; transform: translateX(50%) rotate(135deg);}
        .icon_exp > li:nth-child(n+6) .desc dt:before{top:50%; bottom:auto; right:auto; left:calc(100% + 3vw); transform: translateY(-50%) rotate(45deg) scale(-1, -1);}
        .icon_exp > li:nth-child(n+9) .desc dt:before{top:auto; bottom:calc(100% + 3.1vw); left:auto; right:50%; transform: translateX(50%) rotate(135deg);}
        .icon_exp > li:nth-child(n+10) .desc dt:before{top:50%; bottom:auto; left:auto; right:calc(100% + 3vw); transform: translateY(-50%) rotate(45deg);}
    }
    @media screen and (max-width:640px){
        .sub_title.hd{margin-bottom: 27px;}
        .sub_title h2{font-size: 280%;}
            .sub_title h2 + h4{margin-top: 20px;}
        .sub_title h4.square:before{width: 8px; height: 8px; margin-right: 15px;}

        .sub_factory .thumb_list{column-gap: 15px;}
        .sub_factory .thumb_list li{width: calc(100% / 2 - 7.5px);}
        .sub_factory .thumb_list.bg{border-radius: 10px;}
        .sub_factory .thumb_list .thumb{border-radius: 10px;}
        .sub_factory .thumb_list:last-child:has(.desc){margin-bottom: 180px;}

        .sub_factory .cont + .cont{margin-top: 50px;}
        .factory_wide_bnr .txt_wrap h3 + h6{margin-top: 27px;}
        .systems_wrap{display: block;}
        .systems_wrap .circle{margin-bottom: 30px; border-radius: 10px;}
        .systems_wrap .circle span{width: 120px; height: 120px;}
        .systems_wrap .chart{transform: rotate(90deg);height: calc(100vw - 30px);padding:20px;border-radius: 10px;}
        .systems_wrap .circle + .chart:before{top: auto;bottom: 50%;right: calc(100% - 10px);transform: none;margin: 0 0 -25px 0;}
        .systems_wrap .box_list.title + .item{margin-top: 30px; height: calc(100% - 110px);}
        .systems_wrap .box_list + .box_list{margin-top: 10px;}
        .systems_wrap .box_list li{padding: 5px 10px;border-radius: 5px;}
        .systems_wrap .box_list li span{transform:rotate(-90deg);}
        .systems_wrap .item{display: flex; flex-direction: column;}
        .systems_wrap .item .box_list{height: 100%;}
        .systems_wrap .item .box_list li{height: 100%;}
        .systems_wrap .item .box_list:not(.arw_dn):after{height: 17vw;}
        .systems_wrap .item .box_list + .box_list:after{height: 40vw;}
    }
    @media screen and (max-width:580px){
        .systems_wrap .chart{width: calc(100% + 20vw); margin:17vw 0 0 -10vw;}
    }
    @media screen and (max-width:479px){
        .sub_title.hd{margin-bottom: 22px;}
        .sub_title h2{font-size: 250%;}
            .sub_title h2 + h4{margin-top: 15px;}
        .sub_title h4.square:before{width: 6px; height: 6px; margin-right: 10px; transform: translateY(-7px);}

        .sub_factory .thumb_list li{width: 100%;}
        .sub_factory .thumb_list .desc dt + dd{margin-top: 8px;}
        .sub_factory .thumb_list:has(.desc dd) + .thumb_list{margin-top: 120px;}
        .sub_factory .thumb_list:last-child:has(.desc){margin-bottom: 160px;}

        .sub_factory .cont + .cont{margin-top: 50px;}
        .factory_wide_bnr .txt_wrap h3{font-size: 180%;}
            .factory_wide_bnr .txt_wrap h3 + h6{margin-top: 20px;}
        .factory_wide_bnr .txt_wrap h6{font-size: 90%;}
        .factory_wide_bnr .txt_wrap h6 br{display: none;}

        .info_table tbody :where(th, td){font-size: 80%;}

        .systems_wrap .circle span{width: 110px; height: 110px;}
        .systems_wrap .circle span + span{margin-left: -10px;}
        .systems_wrap .chart{width: calc(100% + 60vw);margin: 39vw 0 50vw -30vw;}
        .systems_wrap .box_list li span{transform: rotate(0);}

        .icon_exp .desc dt + dd{margin-top: 10px;}
    }
    @media screen and (max-width:431px){
        .systems_wrap .chart{width: calc(100% + 80vw);margin: 50vw 0 55vw -40vw;}

        .icon_exp .desc dt img{padding:18px;}
    }
    @media screen and (max-width:360px){
        .systems_wrap .circle span{width: 90px; height: 90px;}
        .systems_wrap .chart{width: calc(100% + 100vw);margin: 60vw 0 60vw -50vw;}
        .systems_wrap .box_list li{font-size: 65%;}
    }