/* download */
.board_search{margin-left:auto; margin-bottom:30px; text-align:right; max-width:532px;  display:flex; align-items:center;}
.board_search .btn_search{margin-left:auto; width:60px; height:60px; background:url(../asset/img/sub/btn_search.png) no-repeat center center #00a7df; border-radius:7px; text-indent:-9999px; border:none; cursor:pointer;}
.board_search input[type=text]{width:calc(100% - 70px);  height:60px; line-height:58px; border:1px solid #E8E8E8; box-sizing:border-box;  border-radius:7px;}
@media screen and (max-width: 680px){
.board_search input[type=text]{width:calc(100% - 50px); height:40px; line-height:38px;}
.board_search .btn_search{width:40px; height:40px;}
}

.download_list>ul{display:flex; flex-wrap:wrap;}
.download_list>ul>li{margin-right:9.5%; width:27%; }
.download_list>ul>li:nth-child(3n){margin-right:0;}
.download_list>ul>li .img_area a{position:relative; aspect-ratio: 1/1.42; display:block; border: 1px solid #E8E8E8; box-sizing:border-box;}
.download_list>ul>li .img_area a img{position:relative; width:100%; height:100%; object-fit:cover;}
.download_list>ul>li .txt_area{padding-top:10px; min-height:160px; }
.download_list>ul>li .txt_area a{font-size:24px; color:#666666; font-family: "Roboto", sans-serif; font-weight: 400;}
.board_more{padding:50px 0 10px; text-align:center; overflow:hidden;}
.board_more .btn_more{width:60px; height:60px; background:url(../asset/img/sub/icon_more.png) no-repeat center center #FF6633;  border-radius:6px;  text-indent:-9999px; border:none; cursor:pointer; transition: all 0.3s ease-out; transform:rotate(0deg); display:inline-block;}
.board_more .btn_more:hover{transform:rotate(180deg);}
@media screen and (max-width: 960px){
.download_list>ul{gap:10px; justify-content: space-between;}
.download_list>ul>li{margin-right:0; width:calc(33.33% - 10px); }
}
@media screen and (max-width: 680px){
.download_list>ul>li{width:calc(50% - 10px); margin-bottom:30px;}
.download_list>ul>li .txt_area{min-height:0;}
.download_list>ul>li .txt_area a{font-size:3.2vw;}
.board_more{padding-top:10px;}
.board_more .btn_more{width:34px; height:34px;}
}

/* custom_checkbox */
.custom_checkbox{position:relative; display:inline-block; overflow:hidden;}
.custom_checkbox input[type=checkbox]{position:absolute; left:-20px; top:0;}
.custom_checkbox label{position:relative;  display:block; min-width:18px;}
.custom_checkbox label:before{width:18px; height:18px; display:block; border:1px solid #C9C9C9; content:""; box-sizing:border-box;}
.custom_checkbox input[type=checkbox]:checked+label:before{background:url(../asset/img/checkbox_on.gif) no-repeat center center; border:none;}

/* btn */
.txt_c{text-align:center;}
.basic-btn01{padding:0 50px; height:60px; line-height:6px; font-family: "Roboto", sans-serif; font-weight:700;  border:none; cursor:pointer; font-size:18px; border-radius:7px; }
.basic-btn01 span{position:relative; display:inline-block; padding-right:24px; }
.btn-point-color1{background-color:#FF6633; color:#fff;}
.basic-btn01 .xi-angle-right{position:absolute; right:0; top:50%;  transition: all 0.3s ease-out; transform:translateY(-50%); transition: all 0.3s ease-out;}
.basic-btn01:hover .xi-angle-right{right:-10px;}
@media screen and (max-width: 960px){
.basic-btn01{width:100%; height:50px; line-height:50px; font-size:16px;}
}
@media screen and (max-width: 768px){
.basic-btn01{width:100%; height:36px; line-height:36px; font-size:14px;}
}
/* inquiry */
.board_top_btn{margin-bottom:10px; display:flex; align-items:center; flex-wrap:wrap; }
.board_top_btn>*{margin-right:10px; padding:6px 11px; border:1px solid #7c7c7c;  font-size:16px; font-family: "Roboto", sans-serif; font-weight:300; border-radius:7px;  background:transparent; opacity:0.7; cursor:pointer; transition: all 0.3s ease-out;}
.board_top_btn>*:hover{border-color:#00A7DF; background-color:#00A7DF; color:#fff;}
/* .inquiry_list .jaun_no{width:29.3%} */
.inquiry_list .jaun_no{width:100%}
.inquiry_list .type{width:22.4%;  flex-shrink: 0;}
.inquiry_list .part_no{width:29%;  flex-shrink: 0;}
.inquiry_list .qty{width:19.3%; flex-shrink: 0; }
.inquiry_list ul{display:flex; justify-content:center; width:16.4%;}
.inquiry_list ul:first-child{width:auto;}
.inquiry_list ul:nth-child(2){width:3%;}
.inquiry_list ul.list{width:100%;}
.inquiry_list ul li{display:Flex; justify-content:center;}
.inquiry_list > div {padding: 0 10px;}
.inquiry_list .thead{border-top:2px solid #000; border-bottom:1px solid #000; display:flex; }
.inquiry_list .thead li{height:60px; display:flex; align-items:center; justify-content: center; font-family: "Roboto", sans-serif; font-weight:600; font-size:18px;  }
.inquiry_list .thead li input[type=checkbox]{width:18px; height:18px; margin: 0; margin-right: 20px;}
.inquiry_list .tbody{display:flex; }
.inquiry_list .tbody ul{border-bottom:1px solid #e8e8e8;}
.inquiry_list .tbody li{padding:35px 0; display:flex; justify-content:center; align-items:center; font-size:20px; font-family: "Roboto", sans-serif; font-weight:400;}
.inquiry_list .tbody li input[type=text]{width:110px; height:42px; border-radius:7px; border:1px solid #e8e8e8;  text-align:center; font-size:20px; font-family: "Roboto", sans-serif; font-weight:400;}
.inquiry_list .tbody li.jaun_no span{text-decoration:underline; cursor: pointer;}
.inquiry_list>div:last-child ul{border-bottom:none;}
.inquiry_list .custom_checkbox{margin-right:20px;}
.inquiry_list{position:relative; }
.inquiry_list:after{margin:100px auto; width:22px; height:38px; background:url(../asset/img/sub/arrow.png) no-repeat center center; display:block; content:"";}
.inquiry_list .tit{display:none;}

.inquiry_input_list{padding-bottom:60px;}
.inquiry_input_list>ul{display:flex; flex-wrap:wrap;}
.inquiry_input_list>ul>li{position:relative; margin-bottom:20px; width:49.3%;}
.inquiry_input_list>ul>li:nth-child(2n){margin-left:auto;}
.inquiry_input_list>ul>li input[type=text]{padding-left:150px; width:100%; height:50px; border:1px solid #E8E8E8; border-radius:7px; box-sizing:border-box; }
.inquiry_input_list>ul>li label{position:absolute; left:0; top:50%; padding-left:25px; width:140px; box-sizing:border-box; font-size:18px; font-family: "Roboto", sans-serif; font-weight:600;  transform: translateY(-50%);}
.inquiry_input_list>ul>li label:before{position:absolute; right:0; top:50%; width:2px; height:15px; background-color:#ddd; display:block; content:""; transform: translateY(-50%);}

@media screen and (max-width: 960px){
.board_top_btn>*{font-size:12px;}
.inquiry_list{border-top:1px solid #040404;}
.inquiry_list .jaun_no,
.inquiry_list .type,
.inquiry_list .part_no,
.inquiry_list .qty{width:100%;}
.inquiry_list .thead{display:none;}
.inquiry_list .tbody ul{width:42px; border-bottom:none;}
.inquiry_list ul.list{display:block; width:calc(100% - 44px);}
.inquiry_list .custom_checkbox{width:22px; margin-right:0;}
.inquiry_list .tbody{ border-bottom:1px solid #040404;}
.inquiry_list .tbody li.num{padding:0;  text-align:center;}
.inquiry_list .tbody li.num span{padding:8px 0; width:22px; display:block; text-align:center; font-size:13px; border-left:1px solid #e8e8e8; border-right:1px solid #e8e8e8;}
.inquiry_list .tbody li{padding:0; border-bottom:1px solid #E8E8E8}
.inquiry_list .tbody li.qty{border-bottom:none;}
.inquiry_list .tit{padding:8px;  display:block; width:100px; box-sizing:border-box; font-weight:700; font-size:13px;}
.inquiry_list .txt{padding:8px;  display:block; border-left:1px solid #e8e8e8; width:calc(100% - 100px); box-sizing:border-box; font-size:13px; }
.inquiry_list .tbody li input[type=text]{width:58px; height:26px; font-size:12px;}
.inquiry_list .tbody li.num{align-items:center;}
.inquiry_list .custom_checkbox{margin-top:8px;}
.inquiry_list:after{margin:26px auto;}
.inquiry_input_list{padding-bottom:10px;}
.inquiry_input_list>ul{display:block; }
.inquiry_input_list>ul>li{margin-bottom:6px; width:100%; }
.inquiry_input_list>ul>li input[type=text]{padding-left:80px; height:44px; line-height:42px;}
.inquiry_input_list>ul>li label{padding-left:20px; width:80px;font-size:14px;}
}

/* news */
.news_list>ul{display:flex; flex-wrap:wrap;}
.news_list>ul>li{margin-right:1.55%; width:32.3%; }
.news_list>ul>li:nth-child(3n){margin-right:0;}
.news_list>ul>li .img_area a{position:relative; aspect-ratio: 1/0.68; display:block; border: 1px solid #E8E8E8; box-sizing:border-box;}
.news_list>ul>li .img_area a img{position:relative; width:100%; height:100%; object-fit:cover;}
.news_list>ul>li .txt_area{padding-top:10px; min-height:160px; }
.news_list>ul>li .txt_area a{font-size:24px; color:#666666; font-family: "Roboto", sans-serif; font-weight: 400;}
@media screen and (max-width: 960px){
.news_list>ul{gap:10px; justify-content: space-between;}
.news_list>ul>li{margin-right:0; margin-bottom:30px; width:calc(33.33% - 10px); }
.news_list>ul>li .txt_area{min-height:auto; }
.news_list>ul>li .txt_area a{font-size:20px;}
}
@media screen and (max-width: 768px){
.news_list>ul>li{width:calc(50% - 10px); }
.news_list>ul>li .txt_area{min-height:0;}
.news_list>ul>li .txt_area a{font-size:3.2vw;}
}

/* search */
.search_tab{margin-bottom:14px;display:flex; align-items:center; flex-wrap:wrap;}
.search_tab ul{display:flex; align-items:center;}
.search_tab ul li{margin-right:6px;}
.search_tab ul li a{width:140px; height:60px; line-height:60px;  border-radius:5px; background-color:#CCC; font-size:18px; font-family: "Roboto", sans-serif; font-weight: 700; color:#666; display:block; text-align:center;}
.search_tab ul li.active a{background-color:#0099cc; color:#fff;}
.search_tab p{font-size:21px; color:#666; font-family: "Roboto", sans-serif; line-height:1.4;}
.by_parts_search_area{position:relative; display:flex; align-items:center; }
.btn_search{margin-left:auto; width:195px; height:60px; line-height:60px; display:block; background-color:#FF6633; color:#fff; font-family: "Roboto", sans-serif;  font-size:21px; text-align:center; border:none; cursor:pointer; border-radius:5px; font-weight:700;}
.by_parts_search_area input[type=text]{padding-left:20px; width:calc(100% - 205px); height:60px; line-height:58px; font-family: "Roboto", sans-serif;  font-size:21px; border-radius:5px; border:1px solid #E8E8E8; box-sizing:border-box;  }

.by_vehicle_search_area .select_list{margin-bottom:20px; display:flex; align-items:center; gap:2px; justify-content: space-between; flex-wrap:wrap;}
.by_vehicle_search_area .select_list select{padding-left:20px; flex-grow:1; height:60px; line-height:58px; border-radius:5px; border:1px solid #ddd; font-family: "Roboto", sans-serif; font-size:18px; font-weight:700; color:#666; box-sizing:border-box;}
.by_vehicle_search_area .ml-auto{margin-left:auto; }
@media screen and (max-width: 1000px){
.search_tab{margin-bottom:30px; display:block; }
.search_tab p{margin-top:15px;}
.by_vehicle_search_area .select_list select{width:calc(50% - 2px);}
}
@media screen and (max-width: 768px){
.search_tab ul li a{width:86px; height:36px; line-height:36px; font-size:12px;}
.search_tab p{font-size:12px;}
.btn_search{width:100px; height:36px; line-height:36px; font-size:14px; }
.by_parts_search_area input[type=text]{width:calc(100% - 110px); height:36px; line-height:34px; }
.by_vehicle_search_area .select_list{gap:5px;}
.by_vehicle_search_area .select_list select{padding-left:10px; width:100%; height:35px; line-height:33px; font-size:14px;}
}

.lookup_date{margin-bottom:25px; font-size:24px; color:#0099cc; font-family: "Roboto", sans-serif; }
.lookup_date strong{font-weight:700;}
.lookup_cont{display:Flex; }
.lookup_cont .left_list{padding-top:24px; width:26.3%;}
.lookup_cont .left_list ul li{padding:20px 0; display:flex; align-items:center; border-bottom:1px solid #ddd;}
.lookup_cont .left_list ul li .tit{width:50%; font-family: "Roboto", sans-serif; font-size:18px; color:#666;}
.lookup_cont .left_list ul li .txt{width:50%; font-family: "Roboto", sans-serif; font-size:18px; color:#0099cc;}
.lookup_cont .left_list ul li:nth-child(1) .tit{color:#000;}
.lookup_cont .left_list ul li:nth-child(1) .txt{color:#000;}
.lookup_cont .prudct_list{margin-left:auto; width:70.2%;}
.lookup_cont .btn_sort{width:140px; height:60px; line-height:60px; border-radius:5px; background-color:#ccc; font-size:18px; font-weight:700; color:#fff;  border:none; cursor:pointer;}
.lookup_cont .prudct_list ul{margin-top:14px; display:flex; gap:10px; flex-wrap:wrap;}
.lookup_cont .prudct_list ul li{margin-bottom:10px; width:calc((100% - 20px)/3);}
.lookup_cont .prudct_list ul li .img_area a{position:relative; aspect-ratio: 1/1; display:flex; align-items:center; justify-content:center; background-color:#f7f7f7;}
.lookup_cont .prudct_list ul li .img_area img{max-width:100%; max-height:100%;}
.lookup_cont .prudct_list ul li .txt_area{padding-top:10px; min-height:70px; box-sizing:border-box; text-align:center;}
.lookup_cont .prudct_list ul li .txt_area a{font-size:21px; color:#666; font-family: "Roboto", sans-serif; }
@media screen and (max-width: 1024px){
.lookup_cont{display:block;}
.lookup_cont .left_list{margin-bottom:30px; padding-top:0; width:100%;}
.lookup_cont .prudct_list{width:100%; }
}
@media screen and (max-width:768px){
.lookup_date{margin-bottom:20px; font-size:17px;}
.lookup_cont .left_list ul li{padding:12px 0; }
.lookup_cont .left_list ul li .tit,
.lookup_cont .left_list ul li .txt{font-size:14px;}
.lookup_cont .btn_sort{width:86px; height:34px; line-height:34px; font-size:14px;}
.lookup_cont .prudct_list ul li{width:calc((100% - 10px)/2);}
.lookup_cont .prudct_list ul li .txt_area{text-align:left; min-height:30px;}
.lookup_cont .prudct_list ul li .txt_area a{font-size:12px; }
}

/* sub_detail */
.sub_detail_top{margin-bottom:130px; display:flex; flex-wrap:wrap;}
.sub_detail_top .sub_top_title h1{text-align:left;}
.sub_detail_top .img_area{margin-top:73px; width:33.8%;}
.sub_detail_top .img_area .big_img{position:relative; margin-bottom:5px; aspect-ratio: 1/1; display:flex; align-items:center; justify-content:center; background-color:#F7F7F7;}
.sub_detail_top .img_area img{max-width:100%; max-height:100%; }
.sub_detail_top .img_list ul{display:flex; gap:5px;}
.sub_detail_top .img_list ul li{width:calc((100% - 20px)/5); background-color:#F7F7F7;}
.sub_detail_top .img_list ul li button{padding:0; border:none; cursor:pointer; aspect-ratio: 1/1; display:flex; align-items:center; justify-content:center; }
.sub_detail_top .list_area{margin-left:auto; width:63%;}
.sub_detail_top .list_area>ul{margin-bottom:40px; display:flex; flex-wrap:wrap; }
.sub_detail_top .list_area>ul>li{width:49.7%; display:flex;  border-bottom:1px solid #ccc;}
.sub_detail_top .list_area>ul>li:nth-child(1),
.sub_detail_top .list_area>ul>li:nth-child(2){border-top:1px solid #ccc;}
.sub_detail_top .list_area>ul>li:nth-child(2n){margin-left:auto; }
.sub_detail_top .list_area>ul>li .tit{padding-left:10px; width:48%; font-size:16px; height:60px; display:flex; align-items:center;  font-weight:600; box-sizing:border-box;}
.sub_detail_top .list_area>ul>li .txt{width:52%; font-size:16px; height:60px; display:flex; align-items:center;  color:#666666}
.sub_detail h2{margin-bottom:10px; font-size:24px; font-family: "Roboto", sans-serif;  font-weight:700;}
.sub_detail  .by_part{margin-bottom:134px; }
.sub_detail  .by_part table{width:100%; border-bottom:1px solid #ececec;}
.sub_detail  .by_part thead th{padding-left:20px; height:60px; box-sizing:border-box;  font-size:18px; font-family: "Roboto", sans-serif;  font-weight:700; color:#fff; background-color:#01A8DF; vertical-align:middle; text-align:left; border-left:2px solid #fff;}
.sub_detail  .by_part tbody td{padding-left:20px; height:60px; color:#666666; font-size:16px;  vertical-align:middle; border-left:2px solid #fff;}
.sub_detail  .by_part thead th:first-child{border-left:none;}
.sub_detail  .by_part tbody td:first-child{border-left:none;}
.sub_detail  .by_part tbody tr:nth-child(even) td{background-color:#ECECEC;}
.sub_detail  .by_part{margin-bottom:134px; }
.sub_detail  .by_vehicle table{width:100%; border-bottom:1px solid #ececec;}
.sub_detail  .by_vehicle thead th{padding:0 20px; height:60px; box-sizing:border-box;  font-size:18px; font-family: "Roboto", sans-serif;  font-weight:700; color:#fff; background-color:#333366; vertical-align:middle; text-align:left; border-left:2px solid #fff;}
.sub_detail  .by_vehicle tbody td{padding:0 15px; height:60px; color:#666666; font-size:16px;  vertical-align:middle; border-left:2px solid #fff;}
.sub_detail  .by_vehicle tbody td span{text-decoration:underline;}
.sub_detail  .by_vehicle thead th:first-child{border-left:none;}
.sub_detail  .by_vehicle tbody td:first-child{border-left:none;}
.sub_detail  .by_vehicle tbody tr:nth-child(even) td{background-color:#ECECEC;}

@media screen and (max-width:1024px){
.sub_detail_top{margin-bottom:60px; display:block; }
.sub_detail_top .img_area{margin-top:0; width:100%;}
.sub_detail_top .list_area{margin:20px 0 0; width:100%;}
.mb_scroll{overflow:auto; }
.sub_detail .by_vehicle table{width:1000px;}
}
@media screen and (max-width:960px){
.sub_detail_top .list_area>ul{width:100%;}
.sub_detail_top .list_area>ul>li{width:100%; }
.sub_detail_top .list_area>ul>li:nth-child(2){border-top:none;}
}
@media screen and (max-width:768px){
.sub_detail_top .list_area>ul>li .txt,
.sub_detail_top .list_area>ul>li .tit{font-size:12px; height:40px; }
.sub_detail h2{font-size:17px;}
.sub_detail .by_part{margin-bottom:60px;}

.sub_detail .by_part thead th,
.sub_detail .by_part tbody td{padding-left:0; height:40px; font-size:14px; text-align:center;}
.sub_detail .by_vehicle thead th,
.sub_detail .by_vehicle tbody td{padding-left:10px; height:40px; font-size:14px; }
}

/* certification_list */
.certification_list>ul{display:flex; flex-wrap:wrap;}
.certification_list>ul>li{margin-right: 1.3%; width:24%; }
.certification_list>ul>li:nth-child(4n){margin-right:0;}
.certification_list>ul>li .img_area a{position:relative; aspect-ratio: 1/1.39; display:block; border: 1px solid #E8E8E8; box-sizing:border-box;}
.certification_list>ul>li .img_area a img{position:relative; width:100%; height:100%; object-fit:cover;}
.certification_list>ul>li .txt_area{padding-top:10px; min-height:160px; }
.certification_list>ul>li .txt_area a{font-size:24px; color:#666666; font-family: "Roboto", sans-serif; font-weight: 400; line-height:1.5; display:block;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2; 
-webkit-box-orient: vertical;
}
@media screen and (max-width: 960px){
.certification_list>ul{gap:10px; justify-content: space-between;}
.certification_list>ul>li{margin-right:0; margin-bottom:30px; width:calc(33.33% - 10px); }
.certification_list>ul>li .txt_area{min-height:auto; }
.certification_list>ul>li .txt_area a{font-size:20px;}
}
@media screen and (max-width: 768px){
.certification_list>ul>li{width:calc(50% - 10px); }
.certification_list>ul>li .txt_area{min-height:0;}
.certification_list>ul>li .txt_area a{font-size:3.2vw;}
}

/* view */
.view_title{padding:20px 0; text-align:center; border-bottom:1px solid #E8E8E8; border-top:2px solid #000;}
.view_title h1{font-size:24px;  line-height:1.6;}
.view_cont{margin-bottom:40px; padding:40px 0; min-height:100px; font-size:18px; color:#666666; border-bottom:1px solid #ddd; font-family: "Roboto", sans-serif;  line-height:1.6;}
.view_cont img{ height: 100% !important; }
.view_btn_area{text-align:center;}
.view_btn_area .more{width:194px;height:60px; line-height:60px; text-align:center; background-color:#0099CC; font-size:18px; font-family: "Roboto", sans-serif; font-weight:700; color:#fff; border-radius:5px; display:inline-block; }
.view_btn_area .more span{position:relative; padding-right:25px; display:inline-block;}
.view_btn_area .more span .xi-angle-right{position:absolute;  right:0; top:50%; transform:translateY(-50%); transition: all 0.3s ease-out;}
.view_btn_area .more:hover span .xi-angle-right{right:-10px;}
.attach_file{border-bottom:1px solid #E8E8E8;}
.attach_file em{display:none;}
.attach_file .download{padding:16px 20px; background-color:#Fcfcfc;}
.attach_file .download a{position:Relative; padding-left:30px; display:inline-block;  font-size:16px; color:#888888;font-family: "Roboto"; }
.attach_file .download a:before{position:absolute; left:0; top:0; width:18px; height:18px; background:url(../asset/img/sub/icon_download.svg) no-repeat center center; background-size:100%; display:block; content:"";}
@media screen and (max-width: 768px){
.view_title{padding:12px 0; text-align:left; }
.view_title h1{font-size:14px;}
.view_cont{margin-bottom:20px; padding:20px 0; font-size:12px; }
.view_btn_area .more{width:100px; height:36px; line-height:36px; font-size:14px;l font-weight:400;}
.attach_file .download{padding:10px 0; }
.attach_file .download a{padding-left:23px; font-size:13px; }
.attach_file .download a:before{width:14px; height:14px;}
}

/* sub_main */
.navi{margin-bottom:100px;}
.navi ul{display:flex; align-items:center;}
.navi ul li{position:relative; font-size:1.125rem; color:#999999; display:Flex; align-items:center; font-weight:700; font-family: "Roboto", sans-serif;}
.navi ul li:after{margin:0 5px; display:block; content:">";}
.navi ul li:last-child:after{display:none;}
.navi ul li:last-child{color:#0099cc; text-decoration:underline;}
@media screen and (max-width: 960px){
.navi{margin-bottom:50px;}
.navi ul li{font-size:11px;}
}

.sub_main_list>ul{display:flex;}
.sub_main_list>ul>li{position:relative; width:49.3%; cursor:pointer; left:-50px; opacity:0; transition: all 0.6s ease-out;}
.page_on .sub_main_list>ul>li{left:0; opacity:1;}
.sub_main_list>ul>li:nth-child(1){transition-delay:0.2s;}
.sub_main_list>ul>li:nth-child(2){transition-delay:0.5s;}
.sub_main_list>ul>li .img_area{width:100%; height:750px; aspect-ratio: 1/1.05;}
.sub_main_list>ul>li .img_area img{width:100%; height:100%; object-fit:cover;}
.sub_main_list>ul>li .over{position:absolute; left:0; top:0; padding:100px 60px; width:100%; height:100%; background:rgba(0,0,0,0.9); transition: all 0.3s ease-out; box-sizing:border-box;  opacity:0;}
.sub_main_list>ul>li .over h2{margin-bottom:20px; font-size:2.25rem; color:#fff; font-weight:700; font-family: "Roboto", sans-serif; font-style: italic; line-height:1.4;}
.sub_main_list>ul>li .over .more{margin-bottom:45px;}
.sub_main_list>ul>li .over .more a{padding-right:25px; background:url(../asset/img/sub/arrow2.png) no-repeat right 5px center; color:#00a7df; font-family: "Roboto", sans-serif; transition: all 0.3s ease-out;}
.sub_main_list>ul>li .over .more a:hover{background:url(../asset/img/sub/arrow2.png) no-repeat right 0 center;}
.sub_main_list>ul>li:nth-child(2n){margin-left:auto;}
.sub_main_list>ul>li ul li{position:relative; margin-bottom:20px; padding-left:10px; }
.sub_main_list>ul>li ul li:last-child{margin-bottom:0;}
.sub_main_list>ul>li ul li:before{position:absolute; left:0; top:10px; width:6px; height:2px; background-color:#fff; display:block; content:""; transition: all 0.3s ease-out;}
.sub_main_list>ul>li ul li a{font-size:1.3125rem; color:#fff; font-family: "Roboto", sans-serif; transition: all 0.3s ease-out;}
.sub_main_list>ul>li ul li:hover:before{background-color:#00A7DF;}
.sub_main_list>ul>li ul li:hover a{color:#00A7DF;;}
.sub_main_list>ul>li:hover .over{opacity:1;}
.sub_main_list>ul>li .txt{position:absolute; left:60px; bottom:100px; font-weight:700; font-family: "Roboto", sans-serif; font-style: italic;  color:#fff; font-size:2.25rem; line-height:1.4;}
@media screen and (max-width: 960px){
.sub_main_list>ul{display:block;}
.sub_main_list>ul>li{width:100%; margin-bottom:20px; }
}
@media screen and (max-width: 640px){
.sub_main_list>ul>li .over{padding:10%; opacity:1;}
.sub_main_list>ul>li .txt{bottom:10%; left:5%;}
.sub_main_list>ul>li .img_area{height:540px;}
.sub_main_list>ul>li ul li{margin-bottom:10px; font-size:14px;}
.sub_main_list>ul>li .over h2{font-size:30px;}
.sub_main_list>ul>li .over .more{margin-bottom:20px;}
}

.sub_main{display:flex;}
.sub_main .img_area{width:calc(100% - 460px); height:750px; position:relative; left:-50px; opacity:0;transition: all 0.6s ease-out 0.2s;}
.sub_main .img_area img{width:100%; height:100%; object-fit:cover;}
.sub_main .txt_area{position:relative; width:460px; background-color:#000; left:-50px; opacity:0;transition: all 0.6s ease-out 0.5s;}
.sub_main .txt_area h2{padding:50px 60px 50px; font-size:2.625rem; color:#fff; font-weight:700; font-family: "Roboto", sans-serif; font-style: italic; line-height:1.3;}
.sub_main .txt_area ul li a{padding:12px 60px; display:block; background:url(../asset/img/mb_arrow_on.svg) no-repeat right 60px center; color:#fff; font-size:1.3125rem;  transition: all 0.3s ease-out;}
.sub_main .txt_area ul li a:hover{background:url(../asset/img/mb_arrow_on.svg) no-repeat right 50px center #00A7DF;  }
.page_on .sub_main .img_area{left:0; opacity:1;}
.page_on .sub_main .txt_area{left:0; opacity:1;}
@media screen and (max-width: 960px){
.sub_main{display:block; }
.sub_main .img_area{width:100%; aspect-ratio: 1/0.76; height:auto;}
.sub_main .txt_area{width:100%; padding-bottom:6%;}
.sub_main .txt_area h2{padding:8% 6% 6%; font-size:36px;}
.sub_main .txt_area ul li a{padding:12px 6%; font-size:16px;}
}

/* history */
@keyframes history_dots{ 
0%{ opacity:0; margin-top:0;}
25%{ opacity:1;}
50%{margin-top:-10px}
100%{margin-top:0;}
}
.history{position:relative; }
.history:before{position:absolute; left:0; top:5px; width:1px; height:100%; background-color:#ddd; display:block;content:"";}
.history h2{position:relative; margin-bottom:40px; padding-left:45px; font-size:48px; font-weight:700; font-family: "Roboto", sans-serif; color:#0099cc; line-height:1;}
.history h2:before{position:absolute; z-index:3; left:-6px; top:18px; width:12px; height:12px; background-color:#0099cc; display:block; content:""; border-radius:50%; }
.history h2:after{position:absolute; z-index:1; left:-6px; top:5px; width:12px; height:40px; background-color:#fff; display:block; content:""; }
.history h2 span{position:relative; display:block; left:40px; opacity:0; transition: all 0.6s ease-out 0.4s;}
.history_list{padding:0 0 120px 45px;  }
.history_list>ul{display:flex; flex-wrap:wrap; padding:40px; background-color:#f9f9f9; border-radius:10px; }
.history_list>ul>li{position:relative; left:40px; opacity:0; width:30%; margin:60px 5% 0 0; transition: all 0.6s ease-out;}
.history_list>ul>li:nth-child(3n){margin-right:0;}
.history_list>ul>li:nth-child(1),
.history_list>ul>li:nth-child(2),
.history_list>ul>li:nth-child(3){margin-top:0;}
.history_list>ul>li .year{margin-bottom:30px; font-size:26px; font-weight:500; font-family: "Roboto", sans-serif;}
.history_list>ul>li li{margin-bottom:30px; font-size:21px; color:#666; line-height:1.42; word-break:keep-all;}
.history_list>ul>li li:last-child{margin-bottom:0;}
.history .on h2:before{animation: history_dots 0.8s ease-in-out forwards;}
.history .on h2 span{left:0; opacity:1;}
.history .on .history_list>ul>li{opacity:1; left:0;}
.history_list>ul>li:nth-child(1){transition-delay:0.8s;}
.history_list>ul>li:nth-child(2){transition-delay:1s;}
.history_list>ul>li:nth-child(3){transition-delay:1.2s;}
.history_list>ul>li:nth-child(4){transition-delay:1.4s;}
.history_list>ul>li:nth-child(5){transition-delay:1.6s;}
.history_list>ul>li:nth-child(6){transition-delay:1.8s;}
@media screen and (max-width: 1200px){
.history_list>ul>li{margin-right:0; width:49%; }
.history_list>ul>li:nth-child(2n){margin-left:auto;}
.history_list>ul>li:nth-child(3){margin-top:60px;}
}
@media screen and (max-width: 960px){
.history_list>ul>li{width:100%; margin-top:30px; }
.history_list>ul>li:nth-child(2){margin-top:30px;}
.history_list>ul>li li{margin-bottom:15px;}
}
@media screen and (max-width: 768px){
.history:before{left:-6px;}
.history h2{margin-bottom:15px; padding-left:14px; font-size:24px;}
.history h2:after{height:30px; top:0; }
.history h2:before{top:8px; left:-8px;  width:6px; height:6px;}
.history_list{padding:0 0 40px;}
.history_list>ul{padding:30px;}
.history_list>ul>li .year{font-size:18px; margin-bottom:15px;}
.history_list>ul>li li{font-size:14px;}
}

/* product_detail */
.product_detail_title{margin-bottom:60px; display:flex; align-items:center;}
.product_detail_title p{width:calc(100% - 300px); font-size:48px; line-height:1.25; font-weight:700; font-family: "Roboto", sans-serif; font-style:italic;}
.product_detail_title .btn_area{margin-left:auto; text-align:right;}
.product_detail_title .btn_area a{width:194px; height:60px; line-height:60px; background-color:#FF6633; display:inline-block; text-align:center; border-radius:5px; font-size:18px; color:#fff; font-weight:700; font-family: "Roboto", sans-serif;}
.product_detail_title .btn_area a span{position:relative; padding-right:20px; display:inline-block; }
.product_detail_title .btn_area a .xi-angle-right{position:absolute; right:0; top:50%; transform:translateY(-50%); transition: all 0.3s ease-out;}
.product_detail_title .btn_area a:hover .xi-angle-right{right:-10px;}
.product_detail_visual{margin-bottom:136px;}
.product_detail_cont{display:Flex; position:relative;  align-items:flex-start;}
.product_detail_cont .img_area{position:sticky; left:0; top:75px; width:48%; text-align:center;}
.product_detail_cont .txt_area{margin-left:auto; width:50%; }
.product_detail_cont .txt_area h1{margin-bottom:30px; line-height:1; font-size:48px;  font-weight:700; font-family: "Roboto", sans-serif; color:#0099cc;}
.product_detail_cont .txt_area p{margin-bottom:54px; font-size:21px; line-height:1.42; color:#666; font-family: "Roboto", sans-serif;}
.product_detail_cont .txt_area h2{margin-bottom:30px; font-size:36px; line-height:1; font-family: "Roboto", sans-serif;}
@media screen and (max-width: 1440px){
.product_detail_title p{font-size:3.333vw;}
}
@media screen and (max-width: 960px){
.product_detail_cont{display:block; }
.product_detail_cont .img_area{position:relative; left:0; top:0; width:100%; }
.product_detail_cont .txt_area{margin-top: 40px; width:100%;}
.product_detail_title{display:block; }
.product_detail_title p{width:100%; }
.product_detail_title .btn_area{margin-top:30px; width:100%; text-align:center;}
}
@media screen and (max-width: 768px){
.product_detail_title p{font-size:26px; word-break:keep-all; }
.product_detail_title .btn_area a{width:100px;height:36px; line-height:36px; font-size:14px;}
.product_detail_visual{margin-bottom:60px;}
.product_detail_cont .txt_area h1{font-size:26px; margin-bottom:10px;}
.product_detail_cont .txt_area p{margin-bottom:35px; font-size:15px;}
.product_detail_cont .txt_area h2{font-size:22px;margin-bottom:10px;}
}

/* overview */
.overview .top_area{display:flex; align-items:center; padding-bottom:60px; }
.overview .top_area .tit_area{width:50%; font-size:48px; font-weight:700; font-family: "Roboto", sans-serif; font-style:italic; line-height:1.2; opacity:0; transition: all 0.6s ease-out 0.2s; position:relative; left:-50px;}
.overview .top_area .txt_area{margin-left:auto; width:50%;; font-family: "Roboto", sans-serif;  font-size:21px; color:#666;  line-height:1.4; opacity:0; transition: all 0.6s ease-out 0.4s; position:relative; left:-50px;}
.page_on .overview .top_area .txt_area,
.page_on .overview .top_area .tit_area{opacity:1; left:0;}
.overview ul li{margin-bottom:65px; display:flex; align-items:center; flex-wrap:wrap; }
.overview ul li .txt{width:34%; position:relative; left:-50px; opacity:0; transition: all 0.8s ease-out;}
.page_on .overview ul li .txt{left:0; opacity:1;}
.page_on .overview ul li:nth-child(1) .txt{transition-delay:0.8s;}
.page_on .overview ul li:nth-child(2) .txt{transition-delay:1s;}
.overview ul li .txt h2{margin-bottom:20px; font-size:48px; font-family: "Roboto", sans-serif;  font-weight:700; color:#0099cc}
.overview ul li .txt p{font-family: "Roboto", sans-serif;  font-size:21px; color:#666;  line-height:1.4;}
.overview ul li .img{position:relative; margin-left:auto; width:50%; overflow:hidden;}
.overview ul li .img:before{position:absolute; left:0; top:0; z-index:2; width:100%; height:100%; background-color:#fff; display:block; content:""; transition: all 0.6s ease-out;}
.overview ul li:nth-child(1) .img:before{transition-delay:1.2s;}
.overview ul li:nth-child(2) .img:before{transition-delay:1.4s;}
.page_on .overview ul li .img:before{left:100%;}
.overview ul li:nth-child(2){flex-direction:row-reverse; justify-content:flex-end;}
.overview ul li:nth-child(2) .txt{margin-left:9%;}
.overview ul li:nth-child(2) .img{margin-left:0;}
@media screen and (max-width: 1440px){
.overview .top_area .tit_area{width:48%; }
.overview .top_area .tit_area br{display:none;}
}

@media screen and (max-width: 960px){
.overview .top_area{display:block; }
.overview .top_area .tit_area{margin-bottom:10px; width:100%; font-size:26px; }
.overview .top_area .txt_area{width:100%; font-size:15px;}
.overview ul li .txt{margin-bottom:30px; width:100%;}
.overview ul li .txt h2{font-size:26px; }
.overview ul li .txt p{font-size:15px; }
.overview ul li .img{width:100%;}
.overview ul li .img img{width:100%;}
.overview ul li:nth-child(2) .txt{margin-left:0;}
}