@charset "utf-8"; /* 서브 공통 css */
.cont_padding { padding: 80px 0; } 
/* sub_visual */
.sub_visual_box { width: 100%; height: 280px; overflow: hidden; position: relative; } 
.sub_page_visual { background-repeat: no-repeat; background-position: center; background-size: cover; animation: bg-active 5s; height: 100%; } 
.sub_page_visual1 { background-image: url(../../img/sub_page_visual_1.jpg); } 
.sub_page_visual2 { background-image: url(../../img/sub_page_visual_2.jpg); } 
.sub_page_visual3 { background-image: url(../../img/sub_page_visual_3.jpg); } 
.sub_page_visual4 { background-image: url(../../img/sub_page_visual_4.jpg); } 
.sub_page_visual5 { background-image: url(../../img/sub_page_visual_5.jpg); } 

/* include-top */
.sub_visual_txt { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 10; width: 1200px; } 
.sub_visual_txt p { text-align: center; color: #fff; font-size: 20px; font-weight: 400; } 
.sub_visual_txt h3 { color: #fff; font-size: 42px; font-weight: 500; } 

/* include/top-depth 메뉴 */
.depth_container { z-index:10; width: 100%; height: 60px; background-color: var(--sub-color); position:relative; } 
.depth_container::before { content:" "; z-index:11; display:block; background-color:#fff; width:18.5%; height:100%; position:absolute; border-bottom: 1px solid #dddddd; } 
.depth_container .depth_wrap { z-index:12; padding: 0 18.5%; position:absolute; display:flex; height:100%; } 

.depth_wrap .home_btn { width: 60px; border: 1px solid #dddddd; background: #fff; } 
.depth_wrap .home_btn a { display:block; width: 100%; height: 100%; } 

.depth_wrap .depth { position: relative; width: 260px; height:100%; line-height:60px; cursor:pointer; border-bottom: 1px solid #dddddd; border-right: 1px solid #dddddd; background: #fff url(../../img/icon-down-arrow.png) no-repeat center right 40px; } 
.depth_wrap .depth .depth_name { position: absolute; left:40px; top:0; font-size: 15px; } 
.depth ul { position: absolute; left:-1px; top:59px; height:auto; background-color: #fff; width:calc(100% + 2px); text-indent:40px; border: 1px solid #dddddd; } 
.depth ul > li { height:50px; line-height:50px; } 
.depth ul > li > a { display:block; font-size:15px; } 
/* 열렸다 닫히는 문제 해결 */
.sub_depth2{display: none;}

.depth_wrap .home_btn a>img { display: block; margin: 0 auto; padding-top: calc((60px - 24px)/ 2); } 
/* 본문 공통제목 */
.page_tit2 { width: 1200px; margin: 0 auto; position: relative; border-bottom: 1px solid #9d9c9c; padding-bottom: 10px; margin-bottom: 80px; } 
.page_tit2 h3 { font-size: 36px; font-weight: 400; } 
.page_tit2 h3::before { content: ""; display: inline-block; width: 30px; height: 4px; background: var(--sub-color); margin-right: 10px; } 
.page_tit2 .small_menu_box { display: flex; position: absolute; right: 0; bottom: 10px; font-size: 16px; color: #9d9c9c; align-items: baseline; } 
.page_tit2 .small_menu_box li { padding-left: 10px; } 
.page_tit2 .small_menu_box li i { font-size: 14px; color: #9d9c9c; } 

/********** 회사소개 *********/
/* greeting */
#greeting .greeting_content { position: relative; } 
#greeting .greeting_content .con1 { margin-bottom: 80px; } 
#greeting .greeting_content .con::before { content:""; width:100%; display: block; height: 500px; background: #f5f5f5; position: absolute; top: 45%; z-index: -2; } 
#greeting .greeting_content .greeting_img { position: absolute; right: 0; z-index: -1; } 

#greeting .greeting_content .con_box { width: 56%; position: relative; top: 50px; } 
#greeting .greeting_content .con_box .con_tit_box { border: 1px solid #ccc; padding: 45px 74px; margin-bottom: 40px; } 

#greeting .greeting_content .con_box .con_tit { font-size: 34px; font-weight: 500; position: relative; text-align: center; } 
#greeting .greeting_content .con_box .con_tit span .fa-quote-left { position: absolute; top: -15px; left: 0; color: #e7e3e3; z-index: -1; font-size: 50px; } 
#greeting .greeting_content .con_box .con_tit span .fa-quote-right { position: absolute; right:0; bottom: -15px; color:#f5f5f5; z-index: -1; font-size: 50px; } 
#greeting .greeting_content .con_box .con_tit strong { color: var(--sub-color); } 
#greeting .greeting_content .con_box .con_txt { padding: 20px 0; font-size: 18px; color: #646464; } 
#greeting .greeting_content .con_box .sign { padding-top: 40px; } 
#greeting .greeting_content .con_box .sign span { font-size: 20px; padding-right: 10px; } 

/* ideology */
#ideology .ideology_content .ideology_flexbox { display: flex; flex-direction: row; flex-wrap: wrap; align-content: center; align-items: center; justify-content: space-evenly; } 
#ideology .ideology_content .ideology_flexbox .ideology_box { } 
#ideology .ideology_content .ideology_flexbox .greeting_img { height: 200px; margin-bottom: 20px; } 
#ideology .ideology_content .ideology_flexbox .greeting_img img { display: block; margin: 0 auto; } 
#ideology .ideology_content .ideology_con { text-align: center; height: 200px; background: #f3f3f3; padding-top: 20px; margin-bottom: 20px; } 
#ideology .ideology_content .ideology_con h4 { color: var(--sub-color); font-size: 28px; } 
#ideology .ideology_content .ideology_con .ideology_txt { padding-top: 20px; } 
#ideology .ideology_content .ideology_con .ideology_txt p { font-size: 20px; } 

/* history */
#history .history_flexbox { display: flex; justify-content: space-around; } 
.history_tit { text-align: left; position: relative; left: -4px; } 
.history_tit h4 { font-size: 34px; font-weight: 400px; } 
.history_tit span { display: inline-block; width: 10px; height: 10px; background-color: var(--main-color); } 
.history_wrap { border-bottom: 1px #ddd solid; position: relative; padding: 4rem 0; } 
.history_wrap::before { content: ""; display: inline-block; width: 1px; height: 100%; border-right: 2px dotted #ddd; position: absolute; left: 0; top: 0; } 
.history_wrap::after { width: 100%; text-align: center; content: "HISTORY"; display: block; position: absolute; left: 50%; bottom: 0; font-size: 220px; color: #e5e5e5; opacity: 0.2; transform: translateX(-50%); font-weight: 900; letter-spacing: -1px; margin-bottom: -40px; } 
.history_wrap.history_none::after { width: 0; content: ""; } 
.history_wrap>ul { margin-bottom: 1rem; } 
.history_wrap>ul>li { position: relative; margin-bottom: 3rem; } 
/* right before */
.history_wrap>ul>.right::before { display: block; content: ""; width: 4px; height: 4px; border: 4px solid var(--main-color); position: absolute; top: 18px; z-index: 1; background-color: #fff; box-sizing: content-box; } 
.history_wrap>ul>.right::after { display:block; content: ""; width: 45px; height: 2px; background-color: var(--main-color); position: absolute; left: 0; top: 23px; } 
.history_wrap>ul>.right { margin-left: auto; padding-left: 5rem; } 
.history_wrap>ul>.right::before { left: -7px; } 
.history_wrap>ul>li h4 { font-size: 24px; color: var(--main-color); padding-bottom: 1rem; } 
.history_wrap>ul>li>ul { } 
.history_wrap>ul>li>ul>li { font-size: 17px; } 
.history_wrap>ul>.right span { padding-right: 10px; } 

/* 다관절 로봇 */
#industry { position: relative; } 
#industry .circle { width: 650px; height: 650px; border-radius: 50%; background: #ffe7e7; box-shadow: 9px 0px 8px 0px #b1b1b1; } 
#industry .catalog_content .catalog_con { background: #f0f0f0; } 
#industry .catalog_content .catalog_con .catalog_btn a { background: var(--sub-color); } 
#industry .catalog_content .catalog_con .catalog_txt b { color: var(--sub-color); } 
.catalog_content .catalog_con .catalog_txt p { word-break: keep-all; } 
/* catalog */
.catalog_content .catalog_flexbox { display: flex; align-items: center; } 
.catalog_content .catalog_flexbox .catalog_img { position: relative; z-index: 2; } 
.catalog_content .catalog_con { background: #f3f3f3; text-align: center; padding: 6% 6% 6% 6%; position: relative; left: -48px; } 
.catalog_content .catalog_con h4 { font-size: 36px; } 
.catalog_content .catalog_con .catalog_txt { font-size: 20px; } 
.catalog_btn, .kawa_btn { width: 250px; height: 60px; margin: 20px auto; } 
.catalog_btn a, .kawa_btn a { font-size: 18px; text-align: center; display: inline-block; width: 100%; height: 100%; color: #fff; background: #333; line-height: 60px; } 

/* YASKAWA - robot list */
.catalog_content .robot_catal.catalog_btn { position: absolute; top: -84px; right: 10px; } 
.catalog_content .robot_catal.catalog_btn a { background: var(--sub-color); } 
.catalog_content .robot_flex { display: flex; flex-wrap: wrap; justify-content: flex-start; } 
.catalog_content .robot_flex .robot_box { width: 25%; padding: 10px 10px; } 
.catalog_content .robot_flex .robot_box .robot_img { border: 1px solid #e7e7e7; /* padding-top: 20px; */}
.catalog_content .robot_flex .robot_box .robot_img img { display: block; margin: 0 auto; padding-top: 20px; padding-bottom: 10px; } 
.catalog_content .robot_flex .robot_box .robot_img h3 { font-size: 20px; text-align: center; padding: 5px 0; background: #f5f4f4; } 

/* KAWASAKI - robot list */
.kawa_content .robot_catal.kawa_btn { position: absolute; top: -84px; right: 10px; } 
.kawa_content .robot_catal.kawa_btn a { background: var(--sub-color); } 
.kawa_content .robot_flex { display: flex; flex-wrap: wrap; justify-content: flex-start; } 
.kawa_content .robot_flex .robot_box { width: 25%; padding: 10px 10px; } 
.kawa_content .robot_flex .robot_box .robot_img { border: 1px solid #e7e7e7; /* padding-top: 20px; */}
.kawa_content .robot_flex .robot_box .robot_img img { display: block; margin: 0 auto; } 
.kawa_content .robot_flex .robot_box .robot_img h3 { font-size: 20px; text-align: center; padding: 5px 0; } 
.kawa_content .robot_flex .robot_box .robot_img p { text-align: center; font-size: 20px; padding-bottom: 4px; } 
.kawa_content .inner_sub { width: 780px; margin: 0 auto; position: relative; top: 10px; } 
.kawa_content .robot_catal { position:relative; top: 15px; } 
/* robot hover */
.robot_flex .robot_box .robot_img { transition: all 0.5s; } 
.robot_flex .robot_box .robot_img:hover { border: 1px solid var(--sub-color); } 

/* tm-robot */
.kawa_content .tm_img_box{padding-top: 15px;}


/* 자동화 부품 */
/* izk2*/
.izk_content .his2 { color: #333; font-size: 18px; font-weight: 500; } 

/* CAD FILE 캐드파일 & izk 제품시리즈*/
.file_wrap { width: 1200px; height: 100%; margin: 0 auto; position: relative; font-size: 16px; line-height: 1.5; } 
.file_content .robot_catal.catalog_btn {width: 236px;position: absolute;top: -84px;right: 0;}
.file_content .robot_catal.catalog_btn a { background: var(--sub-color); }
.file_content .izk_type_img{padding-top: 12px;}
/* tab-1 */
#file { } 
#file .file_content { } 
#file .file_content .file_flexbox { } 
#file ul.tabs li { background: none; display: inline-block; padding: 20px 20px; cursor: pointer; font-size: 24px; font-weight: 600; } 
 #file ul.tabs li.current { background: #ffe7e7; } 
#file .tab-content { display: none; background: #ffe7e7; padding: 15px; } 
#file .tab-content.current { display: inherit; } 

/* tab-2 */
#file .izk_tab li,
#file ul.tab2 li, 
#file ul.tab3 li { background: none; display: inline-block; padding: 20px 20px; cursor: pointer; font-size: 18px; font-weight: 500; } 

#file .izk_tab li.active,
#file ul.tab2 li.active,
#file ul.tab3 li.active { background: #fff; } 
#file .tab-content2,
#file .tab-content3 { display: none; background: #fff; padding: 50px 0; } 
#file .tab-content2.active,
#file .tab-content3.active { display: inherit; } 

/* industry 제품들의 tab css */
.industry_wrap { width: 1200px; height: 100%; margin: 0 auto; position: relative; font-size: 16px; line-height: 1.5; } 

/* tab-1 */
#industry { } 
#industry .industry_content { } 
#industry .industry_content .industry_flexbox { } 
#industry ul.tabs li { background: none; display: inline-block; padding: 20px 20px; cursor: pointer; font-size: 24px; font-weight: 600; } 
 #industry ul.tabs li.current { background: #ffe7e7; } 
#industry .tab-content { display: none; background: #ffe7e7; padding: 15px; } 
#industry .tab-content.current { display: inherit; } 

/* tab-2 */
#industry ul.tab2 li, #industry ul.tab3 li { background: none; display: inline-block; padding: 20px 10px; cursor: pointer; font-size: 18px; font-weight: 500; width: 200px; text-align: center; } 

#industry ul.tab2 li.active,
#industry ul.tab3 li.active { background: #fff; } 
#industry .tab-content2,
#industry .tab-content3 { display: none; background: #fff; padding: 50px 0; } 
#industry .tab-content2.active,
#industry .tab-content3.active { display: inherit; } 

/* tbi */
#industry .tbi_content .catalog_con .catalog_btn { margin: 20px 0 20px auto; } 
#industry .tbi_content .catalog_con .catalog_btn a { } 

#industry .tbi_content .tbi_flexbox { display: flex; flex-wrap: wrap; justify-content: space-between; } 
#industry .tbi_content .tbi_flexbox .tbi_img { } 
#industry .tbi_content .tbi_flexbox .tbi_img a { display: block; width: 100%; height: 100%; } 
#industry .tbi_content .tbi_flexbox .tbi_img a img { display: block; margin: 0 auto; } 
#industry .tbi_content .tbi_flexbox .tbi_img a h3 { font-size: 18px; text-align: center; padding: 4px 0 20px; } 
/* lm */
#industry .tbi_content .lm_img img { display: block; margin: 0 auto; } 
/* tbi2 */
.tbi2_flexbox { display: flex; flex-wrap: wrap; justify-content: space-between; } 
.tbi2_flexbox .tbi2_box .tbi2_img a { width: 100%; height: 100%; } 
.tbi2_flexbox .tbi2_box .tbi2_img a img { display: block; } 

.tbi2_box .ballsc_list { padding: 12px 0 30px 20px; } 
.tbi2_box .ballsc_list li { list-style: inside; } 
#industry .tbi_content .ballsc_img img { display: block; margin: 0 auto; } 
/* 기타 */
/* 크리퍼 gripper */
.tbi_content .des { width: 90%; margin: 0 auto; } 
.des .des_txt { position: relative; } 
.des .des_txt .gripper_btn { position: absolute; top: 0; right: 0; } 

.des .des_txt p { font-size: 18px; } 
.des .des_txt h3 { font-size: 20px; padding-left: 24px; } 

.des .des_flex_wrap { display: flex; justify-content: space-around; padding: 60px 0 20px 0; } 
.des .des_flex_wrap .des_box { } 
.des .des_flex_wrap .des_box .gripper_img { } 
.des .des_flex_wrap .des_box .gripper_img img { display: block; margin: 0 auto; } 

.des .des_flex_wrap .des_box .gripper_list { text-align: center; padding: 20px 0; } 
.des .des_flex_wrap .des_box .gripper_list p { font-size: 18px; } 
.des .des_flex_wrap .des_box .gripper_list p strong { } 

.des .des_wrap { } 
.des_wrap .gripper_img { } 
.gripper_img img { display: block; margin: 0 auto; } 

/* tpc */
#industry .tpc_flex { display: flex; flex-wrap: wrap; justify-content: flex-start; width: 90%; margin: 0 auto; } 
#industry .tpc_flex .tpc_box { width: 33.3%; } 
#industry .tpc_flex .tpc_box a { display: inline-block; width: 100%; } 
#industry .tpc_flex .tpc_box p,#industry .tpc_flex .tpc3_box p { font-size: 17px; text-align: center; padding: 6px 0 20px 0; } 
#industry .tpc_flex .tpc_box a img { display: block; margin: 0 auto; /* border: 1px solid #d2d2d2; */
 border-radius: 15px; } 
#industry .tpc_flex .tpc3_box { width: 100%; } 
#industry .tpc_flex .tpc3_box a img { display: block; margin: 0 auto; border-radius: 15px; } 

/* 온라인문의 */
/* SUB LAYOUT :: 온라인문의 */
.inquiry-style07-agree-con { margin-bottom: 50px; } 
.inquiry-style07-agree-con .agree-tit { color:#444; font-size:22px; letter-spacing:-0.75px; font-weight:500; padding-bottom:15px; } 
.inquiry-style07-agree-box { border:1px solid #cecece; height:130px; overflow-y:auto; overflow-x:hidden; background-color:#fff; } 
.inquiry-style07-agree-con .agree-txt { font-size:15px; line-height:20px; padding:13px 25px; letter-spacing:-0.65px; color:#414141; background-color:#f1f1f1; border:1px solid #cecece; border-top:0; } 
.inquiry-style07-agree-box textarea { display: block; width: 100%; height: 100%; border: 0; padding: 20px; box-sizing: border-box; line-height: 1.8; font-family: inherit; } 
.inquiry-style07-agree-con .agree-txt span { color:var(--main-color); font-weight:500; } 
.inquiry-style07-essential-txt { text-align:right; color:#373737; font-size:13px; letter-spacing:-0.3px; padding-bottom:15px; } 
.inquiry-style07-essential-icon { color:var(--main-color); font-size:15px; } 
/* 문의하기 01 :: 쓰기, 문의폼 :: 작성영역 */
.inquiry-tbl-style07 { width:100%; } 
.inquiry-tbl-style07 .write-input,
.inquiry-tbl-style07 .write-select,
.inquiry-tbl-style07 .write-textarea { height:50px; border:0px; width:50%; background-color:#fff; border:1px solid #d2d2d2; font-size:14px; vertical-align:middle; font-family: inherit; } 
.inquiry-tbl-style07 .write-input:focus { border-color:#333; } 
.inquiry-tbl-style07 .write-input { text-indent:10px; } 
.inquiry-tbl-style07 .write-select { height:54px; } 
.inquiry-tbl-style07 .write-textarea { width:100%; height:200px; resize:none; padding:20px 10px; text-indent:0px; } 
.inquiry-tbl-style07-container { width:100%; } 
.inquiry-tbl-style07-con { width:100%; padding:20px 0; } 
.inquiry-tbl-style07-con dt { font-size:20px; color:#444; font-weight:500; letter-spacing:-0.65px; padding-bottom:6px; } 
.inquiry-tbl-style07-2col { display:table; width:100%; } 
.inquiry-tbl-style07-2col > .inquiry-tbl-style07-con { display:table-cell; vertical-align:top; width:33.333%; padding-left:3%; } 
.inquiry-tbl-style07-2col > .inquiry-tbl-style07-con:first-child { padding-left:0; /*padding-right:3%; */ } 
.inquiry-tbl-style07-2col > .inquiry-tbl-style07-con .write-input { width:100%; } 

/* 문의하기 01 :: Custom checkbox */
.inquiry-style04-custom-checkbox { margin:0 -15px; } 
.inquiry-style04-custom-checkbox .checkbox-item { display:inline-block; vertical-align:middle; margin:3px 15px; } 
.inquiry-style04-custom-checkbox .checkbox-item input[type="radio"] { display:none; } 
.inquiry-style04-custom-checkbox .checkbox-item label { display:inline-block; position:relative; vertical-align:middle; color:#949494; font-size:15px; line-height:27px; letter-spacing:-0.65px; } 
.inquiry-style04-custom-checkbox .checkbox-item label i { font-size:24px; margin-right:5px; position:relative; top:-1px; } 
.inquiry-style04-custom-checkbox .checkbox-item input[type="radio"]:checked + label { color:#f36f21; } 
.cm-btn-controls { overflow: hidden; text-align: center; padding-top: 30px; } 
.cm-btn-controls input, .cm-btn-controls a { display: inline-block; width: 268px; height: 64px; border: 0; color: #fff; background-color:var(--main-color);; font-size: 18px; margin: 0 2px 5px 2px; cursor: pointer; vertical-align: top; text-align: center; font-weight: 400; -webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; font-family: inherit; } 

.top_area .pro_infoWrap p span { color:#666; } 
.top_area .pro_infoWrap p span i { color: var(--main-color); font-weight: 500; font-style:normal } 
.top_area .pro_infoWrap p span i.xi-error-o { position: relative; top: 3px; font-size: 19px; } 
.top_area .pro_infoWrap p span em { font-size:15px; margin-top:10px }