@charset "utf-8";
@import url("main.css");

/* ==============================
 * common - 컨텐츠 공통
 * ============================== */

select::-ms-expand {
    display: none;
}

body.scrollLock {overflow: hidden;}
.innerBox{position:relative;max-width:1240px;margin:0 auto; padding:0 20px;}

#container{ overflow:hidden; position:relative; margin-top:120px;}

/* 글자색 */
.txtRed1 { color:#de190a;}
.txtBlue1 { color:#003388;}
.txtGray1 { color:#999999;}
.txtBlack1 { color:#111;}

/* 글자 숨기기 */
.hidden { overflow:hidden; position:absolute; top:0; left:0; width:0; height:0; font-size:0;}

/* dotList */
.dotList {}
.dotList li { position:relative; padding-left:15px; font-size:16px; color:#111; font-weight:200; line-height:2;}
.dotList li:before { content:''; position:absolute; top:15px; left:0; width:3px; height:3px; border-radius:50%; background:#999999}

/* 게시판 */
[class*=table] .width1 { width:100px;}
[class*=table] .width2 { width:200px;}
[class*=table] .width3 {}
[class*=table] .width4 {}

.tableList {}
.tableList th { height:95px; border-bottom:1px solid #f0f0f0; border-top:5px solid #000000; font-size:18px; font-weight:bold; background:#f9f9f9;}
.tableList tr:hover { background:#f9f9f9;}
.tableList td { border-bottom:1px solid #e3e3e3; font-size:15px; text-align:center; font-weight:300; color:rgba(17,17,17,0.7);}
.tableList td.number { color:#000;}
.tableList td.data { color:#999999;}
.tableList td a { overflow:hidden; display:block; padding:38px 10px; text-overflow:ellipsis; white-space:nowrap;}
.tableList td .iconMedia { position:relative; padding-right:40px; font-size:14px; color:#29407e; font-weight:bold;}
.tableList td .iconMedia:after { content:''; display:block; position:absolute; top:50%; right:20px; width:16px; height:16px; background:url('../images/notice/icon_media.png') no-repeat; transform:translateY(-50%);}

.boardView { margin-top:90px;}
.boardView .boardHeader { overflow:hidden; position:relative; width:100%; padding:35px 100px 40px; border-top:5px solid #000; border-bottom:1px solid #e1e1e1; background:#f9f9f9;}
.boardView .boardHeader .title { font-size:18px; font-weight:bold;}
.boardView .boardHeader .data { float:left; margin-top:20px; font-size:15px; color:#999999;}
.boardView .boardHeader.type2 .title { padding-right:100px;}
.boardView .boardHeader.type2 .data { float:none; position:absolute; top:50%; right:100px; margin-top:0; transform:translateY(-50%);}
.boardView .boardHeader .name { float:right; margin-top:20px; font-size:18px; font-weight:bold;}
.boardView .boardCont { padding:100px 100px; border-bottom:1px solid #f0f0f0; font-size:15px; color:#111;}
.boardView .btnList { display:block; width:280px; height:70px; margin:50px auto 150px; font-size:20px; color:#fff; font-weight:bold; line-height:70px; text-align:center; background:#303a55;}

/* searchbox */
.searchBox { display:flex; position:relative; height:80px; margin:40px 0 60px; border:6px solid #e1e1e1; vertical-align:middle;}
.searchBox select { width:275px; padding-left:45px; border:0; border-right:1px solid #e1e1e1; background:none;}
.searchBox input { width:100%; height:68px; border:0; padding:0 80px 0 50px; line-height:68px; font-size:18px;}
.searchBox button { position:absolute; top:0; right:0; width:68px; height:68px; font-size:0; background:url('../images/common/btn_search.jpg') no-repeat center center;}

/* searchbox */
.searchBox2 { display:flex; position:absolute; top:77px; right:20px; width:332px; border-radius:25px; vertical-align:middle; background:#e6e6e6;}
.searchBox2 select { width:275px; padding-left:45px; border:0; border-right:1px solid #e1e1e1; background:none;}
.searchBox2 input { width:100%; height:50px; border:0; padding:0 50px 0 30px; line-height:50px; font-size:14px; background:none;}
.searchBox2 button { position:absolute; top:0; right:0; width:50px; height:50px; font-size:0; background:url('../images/common/btn_search.png') no-repeat center center;}

/* 페이징 */
.paging { margin:60px 0 150px; font-size:0; text-align:center;}
.paging strong,
.paging a { display:inline-block; position:relative; width:60px; height:60px; margin:0 2px; vertical-align:middle; font-size:15px; line-height:60px;}
.paging a:hover { border-color:#3d644a; transition: all .3s ease;}
.paging strong {}
.paging strong:before { content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; border:1px solid #000; border-radius:50%; box-sizing:border-box;}
.paging a[class*=btn] { border:0; font-size:0;}
.paging a.btnPrev { background:url('../images/common/btn_paging_prev.png') no-repeat center center;}
.paging a.btnNext { background:url('../images/common/btn_paging_next.png') no-repeat center center;}

/* form */
.inputBox { display:flex; margin-left:-10px;}
.inputBox > * { flex:1 1 auto; width:100%; margin-left:10px;}
.inputBox input { width:100%; height:60px; border:0; padding:0 0 0 40px; border:1px solid #e1e1e1; line-height:58px; font-size:16px;}
.inputBox select { width:100%; height:60px; border:0; padding:0 0 0 40px; border:1px solid #e1e1e1; line-height:58px; font-size:16px; background:none;}
.inputBox textarea { width:100%; height:360px; border:0; padding:20px 0 20px 40px; border:1px solid #e1e1e1; font-size:16px; background:none;}
.inputBox .ui-spinner { display:block; border:0;}
.inputBox + .inputBox { margin-top:5px;}
.inputBox .ui-spinner-input { margin:0;}

.checkBox { position:relative; margin:40px 0;}
.checkBox input { position:absolute; opacity:0;}
.checkBox label { position:relative; padding-left:40px; font-size:16px; color:#555;}
.checkBox label:before { content:''; display:block; position:absolute; top:0; left:0; width:25px; height:24px; background:url('../images/common/icon_checkbox.png') no-repeat;}
.checkBox input:checked + label:before { background-image:url('../images/common/icon_checkbox_on.png')}

.formWrap { position:relative; padding-left:190px;}
.formWrap + .formWrap { margin-top:20px;}
.formWrap .title { position:absolute; top:20px; left:0; font-size:21px; font-weight:bold;}
.formWrap .title span { color:#999999;}
.formWrap .inputBox.heightA { height:auto;}
.formWrap .inputBox input,
.formWrap .inputBox select { height:70px;}
.formWrap .inputBox + .inputBox { margin-top:10px;}

.fileBox { position:relative; padding-right:200px;}
.fileBox > input { width:100%; height:70px; border:0; padding:0 0 0 40px; border:1px solid #e1e1e1; line-height:58px; font-size:16px;}
.fileBox .fileBtn { position:absolute; top:0; right:0;}
.fileBox .fileBtn label { display:block; width:200px; height:70px; font-size:16px; color:#fff; line-height:70px; text-align:center; font-weight:bold; background:#262626;}
.fileBox .fileBtn input { position:absolute; opacity:0;}

/* ===========================================================================
content
=========================================================================== */

.subVisual { display:none; overflow:hidden; position:relative; height:260px; margin-top:60px;}
.subVisual span { display:block; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-size:cover; background-position:center center; animation:subVisualM 1s;}
@keyframes subVisualM{
	0% { transform:scale(1.2)}
	100% { transform:scale(1)}
}

.contTit { padding-top:110px; font-size:42px; letter-spacing: -2px; color:#111; font-weight:bold;}

.locationBox { position:absolute; top:145px; right:20px; z-index:2; text-align:right;}
.locationBox strong { font-size:14px; color:#999999; font-weight:bold;}
.locationBox strong:before { content:''; display:inline-block; width:16px; height:16px; margin-top:-3px; margin-right:18px; vertical-align:middle; background:url('../images/common/icon_location.png') no-repeat; background-size:100%;}
.locationBox > a { margin-left:45px; position:relative; font-size:14px; color:#111111; padding-right:30px; font-weight:bold;}
.locationBox > a:before { content:''; display:block; position:absolute; top:50%; left:-22px; width:1px; height:12px; background:#e5e5e5; transform:translateY(-50%);}
.locationBox > a:after { content:''; display:block; position:absolute; top:50%; right:0px; width:9px; height:6px; margin-top:-2px; background:url('../images/common/icon_location_arrow.png') no-repeat;; transform:translateY(-50%); transition:all .3s ease;}
.locationBox > a.on:after { transform:translateY(-50%) rotate(180deg);}
.locationBox > div.link { display:inline-block; position:relative;}
.locationBox > div.link > a { margin-left:45px; position:relative; font-size:14px; color:#111111; padding-right:30px; font-weight:bold;}
.locationBox > div.link > a:before { content:''; display:block; position:absolute; top:50%; left:-22px; width:1px; height:12px; background:#e5e5e5; transform:translateY(-50%);}
.locationBox > div.link > a:after { content:''; display:block; position:absolute; top:50%; right:0px; width:9px; height:6px; margin-top:-2px; background:url('../images/common/icon_location_arrow.png') no-repeat;; transform:translateY(-50%); transition:all .3s ease;}
.locationBox > div.link > a.on:after { transform:translateY(-50%) rotate(180deg);}
.locationBox .locationList { display:none; position:absolute; top:25px; right:0; width:140px; border:1px solid #eee; text-align:left; background:#fff;}
.locationBox .locationList a { display:block; padding:10px 10px; font-weight:bold;}
.locationBox .locationList a:hover { background:#eee;}

.imgFull {}
.imgFull img { width:100%;}

.imgPC { display:block;}
.imgMo { display:none;}

/* 회사소개 */
.introduce1 { display:flex; position:relative; margin-bottom:180px; margin-top:40px;}
.introduce1 h2 { flex:1 1 auto; font-size:40px; font-weight:100; line-height:1.25}
.introduce1 h2 span { display:block; margin-bottom:30px; font-size:16px; font-weight:bold;}
.introduce1 .textBox { flex:0 0 auto; width:500px; padding-top:60px;}
.introduce1 .textBox p { line-height:1.375; font-size:16px; letter-spacing: -0.5px;}
.introduce1 .textBox p + p { margin-top:20px;}
.introduce1 .president { position:absolute; bottom:0; left:0; font-weight:bold; font-size:16px;}
.introduce1 .president span { font-weight:normal;}

.introduce2_1 { position:relative; padding-bottom:100px;}
.introduce2_1 .textBox { padding-top:60px;}
.introduce2_1 h2 { margin-bottom:20px; font-size:24px; font-weight:bold;}
.introduce2_1 ul { margin-bottom:60px;}
.introduce2_1 li { padding-left:30px; font-size:20px; line-height:1.5; letter-spacing: -1px;}
.introduce2_1 li + li { margin-top:10px;}
.introduce2_1 li:before { top:13px;}
.introduce2_1 .imgFull { margin:100px -80px 0;}

.introduce2_2 { padding:100px 0 150px; background:#f6f6ff;}
.introduce2_2 h2 { margin-bottom:120px; font-size:24px; font-weight:bold;}

.introduce3 { padding-bottom:150px; background:#f7f7f7;}
.introduce3 .imgFull { padding-top:160px;}

.introduce4 { position:relative; margin-top:80px; margin-bottom:150px;}
.introduce4:before { content:''; display:block; position:absolute; top:0; left:50%; width:1px; height:100%; background:#dce3eb;}
.introduce4 > div { position:relative; min-height:280px; margin:0 auto; text-align:right;}
.introduce4 > div:before { content:''; display:block; position:absolute; top:45px; left:50%; width:19px; height:19px; margin-left:-9.5px; background:url('../images/introduce/icon_page4.png') no-repeat;;}
.introduce4 > div + div { margin-top:80px}
.introduce4 h2 { position:absolute; top:15px; left:15%; font-size:60px; font-weight:100; letter-spacing: -3px;}
.introduce4 .textBox { display:inline-block; width:50%; text-align:left; opacity:0; padding-top:20px; padding-bottom:80px;}
.introduce4 .textBox dl { display:flex; padding-left:120px; margin-bottom:40px;}
.introduce4 .textBox dt { flex:0 0 auto; position:relative; width:110px; padding-left:10px; font-size:18px;  text-align:left;}
.introduce4 .textBox dt:before { content:''; display:block; position:absolute; top:10px; left:0; width:3px; height:3px; border-radius:50%; background:#999999;}
.introduce4 .textBox dd { font-size:16px; text-align:left;}
.introduce4 .textBox dd span { display:block;}
.introduce4 .textBox dd span + span { margin-top:15px;}
.introduce4 .top { position:absolute; top:0; left:50%; font-size:120px; line-height:1; color:rgba(153,153,153,0.1); transform:translateX(-50%); }
.introduce4 .bottom { position:absolute; bottom:0; left:50%; font-size:120px; line-height:1; color:rgba(153,153,153,0.1); transform:translateX(-50%);}

.introduce4 .cssMotion .textBox { animation:fadeInUp .7s .3s both;}
.introduce4 .cssMotion h2 { animation:fadeInLeft .7s both;}
.introduce4 .cssMotion.wait-animation .textBox { animation:fadeOutUp .1s both;}
.introduce4 .cssMotion.wait-animation h2 { animation:fadeOutUp .1s both;}

.introduce5 { margin-top:80px; margin-bottom:150px;}
.introduce5 h2 { margin-bottom:45px; font-size:24px; font-weight:bold;}
.introduce5 ul { overflow:hidden; margin-left:-20px;}
.introduce5 ul li { float:left; width:20%; padding-left:20px;}
.introduce5 ul li img { width:100%;}
.introduce5 ul li.type2 { width:40%;}
.introduce5 ul li:nth-child(6),
.introduce5 ul li:nth-child(7) { margin-top:20px}
.introduce5 ul + h2 { margin-top:100px;}

.introduce6_1 { padding:0px 0 100px; background:#f2f2f2;}
.introduce6_1 h2 { padding-top:100px; margin-bottom:75px; font-size:24px; font-weight:bold;}
.introduce6_1 .imgText { position:relative;}
.introduce6_1 .textBox { position:absolute; top:0; right:0; bottom:0; width:320px;}
.introduce6_1 .textBox h3 { display:inline-block; padding-bottom:5px; border-bottom:3px solid #1e3f74; font-size:20px; color:#1e3f74;}
.introduce6_1 .textBox p { margin:30px 0; font-size:16px; color:#1e3f74; line-height:1.5;}

.introduce6_2 { padding:100px 0 150px; text-align:right;}
.introduce6_2 h2 { position:absolute; top:0; left:0; padding-top:50px; font-size:24px; font-weight:bold;}
.introduce6_2 .imgText { display:inline-block; width:782px; font-size:0;}
.introduce6_2 .imgText img { display:inline-block; width:260px; vertical-align: top;}
.introduce6_2 .imgText .textBox { display:inline-block; width:420px; padding-top:50px; margin-left:100px; text-align:left;}
.introduce6_2 .imgText .textBox p { display:flex; position:relative; height:50px; padding-left:100px; font-size:16px; color:#1e3f74; align-items:center; letter-spacing: -0.5px;}
.introduce6_2 .imgText .textBox p + p { margin-top:54px;}
.introduce6_2 .imgText .textBox p:before { content:''; display:inline-block; position:absolute; top:0; left:0; width:50px; height:50px; margin-right:50px; border-radius:50%; vertical-align:middle;}
.introduce6_2 .imgText .textBox .type1:before { background:#1e3f74;}
.introduce6_2 .imgText .textBox .type2:before { border:1px solid #d8d8d8; background:#fff;}

.introduce7 { padding-top:80px;}
.introduce7 .imgFull { margin:0 -80px;}
.introduce7 .textBox { display:flex; margin-top:0px; justify-content:space-around; justify-content:space-between;}
.introduce7 .textBox > div {}
.introduce7 .textBox h2 { font-size:40px; font-weight:100;}
.introduce7 .textBox h2.small { margin-bottom:5px; font-size:16px; font-weight:bold;}
.introduce7 .textBox h2 span { display:block; margin-bottom:10px; font-size:16px; font-weight:bold;}
.introduce7 .textBox .text { margin-top:25px; font-size:16px;}
.introduce7 .textBox .time { font-size:40px; font-weight:100; letter-spacing:-0.5px;}
.introduce7 .textBox .time span { font-size:14px; font-weight:normal;}
.introduce7 .textBox .day { margin-top:10px; font-size:16px; font-weight:bold;}
.introduce7 .textBox .text2 { margin-top:5px; font-size:14px; color:#999; font-weight:200;}
.introduce7 .textBox dl { margin-top:50px; font-size:16px;}
.introduce7 .textBox dl + dl { margin-top:10px;}
.introduce7 .textBox dt { display:inline-block; font-weight:bold;}
.introduce7 .textBox dd { display:inline-block;}

.locationMap { width:100%; margin-top:100px;}
.locationMap iframe { width:100%; height:560px;}

/* 제품소개 */
.productViewWrap { padding-bottom:190px;}
.productViewWrap.bgNone { padding-bottom:0; background:none;}
.productViewWrap .searchBox + .tabBox { margin-top:50px;}
.productViewWrap .tabBox { display:flex; margin-top:30px; margin-left:-10px;}
.productViewWrap .tabBox a { display:flex; flex:1 1 auto; width:33.33%; height:50px; margin-left:10px; border:1px solid #262626; text-align:center; font-size:14px; color:#262626; align-items:center; justify-content: center; word-break: break-all;}
.productViewWrap .tabBox a.on { color:#fff; background:#262626;}
.productViewWrap .depth3 { margin-top:20px; text-align:center; background:#f9f9f9;}
.productViewWrap .depth3 a { position: relative; display:inline-block; padding:0 18px; line-height:34px; color:#777777;}
.productViewWrap .depth3 a + a:before { content:''; display:block; position: absolute; top:50%; left:0; width:1px; height:13px; margin-top:-6.5px; background:#ebebeb}
.productViewWrap .depth3 a.on { color:#262626;}
.productViewWrap .location { position:relative; margin-top:80px; padding-bottom:25px; margin-bottom:50px; border-bottom:1px solid #d8d8db; padding-left:10px; font-size:14px;}
.productViewWrap .location:before { content:''; display:block; position:absolute; top:8px; left:0; width:2px; height:2px; border-radius:50%; background:#999999;}
.productViewWrap .location span { font-weight:bold;}
.productViewWrap h2 { margin:60px 0 40px; padding-bottom:15px; border-bottom:1px solid #e5e5e5; font-size:30px; font-weight:bold;}
.productViewBox { display:flex; position:relative;}
.productViewBox .productImg { position: relative; flex:1 1 auto; width:65%;}

.productViewBox .thumbnail { overflow:hidden; position:absolute; top:510px; left:0; right:40px; width:660px; padding:0 78px; margin:0 auto;}
.productViewBox .thumbnail .btnLeft { display:block; position:absolute; top:50%; left:0; width:33px; height:82px; font-size:0; background:url('../images/product/btn_thumbnail_arrow.png') no-repeat; background-size:100%; transform: translateY(-50%);}
.productViewBox .thumbnail .btnRight { display:block; position:absolute; top:50%; right:0; width:33px; height:82px; font-size:0; background:url('../images/product/btn_thumbnail_arrow.png') no-repeat; background-size:100%; transform:rotate(180deg) translateY(50%);}
.productViewBox .thumbnail .thumbnailList { overflow:hidden; margin-left:-24px;}
.productViewBox .thumbnail .thumbnailList > div { width:5000px; height:100%;}
.productViewBox .thumbnail .thumbnailList a { overflow:hidden; position:relative; display:block; float:left; width:108px; height:108px; margin-left:24px; transition:all .3s ease;}
.productViewBox .thumbnail .thumbnailList a:after { content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; border:1px solid #d4d4d4; background:rgba(255,255,255,0.2); box-sizing:border-box; transition:all .3s ease;}
.productViewBox .thumbnail .thumbnailList a.on:after,
.productViewBox .thumbnail .thumbnailList a:hover:after { border:2px solid #303a55;background:rgba(255,255,255,0);}
.productViewBox .thumbnail img { width:100%;}
.productViewBox .imgBox { height:510px; padding:0 80px 0 40px; text-align:center;}
.productViewBox .imgBox p {display:none; animation:fadeOut .5s;}
.productViewBox .imgBox p.on { display:block; animation:fadeIn .5s;}
.productViewBox .imgBox img { max-width:100%; max-height:486px;} /*2020-12-03 제품이미지 높이조정*/

.productViewInfo { flex:1 1 auto; width:35%;}
.productViewInfo .innerBox { display:flex;}
.productViewInfo .innerBox:after { content:''; display:block; clear:both;}
.productViewInfo .infoTable { clear:both; border-top:1px solid #000000;}
.productViewInfo .infoTable .width1 { width:120px;}
.productViewInfo .infoTable tr {border-bottom:1px solid #e5e5e5;}
.productViewInfo .infoTable th { padding:20px 0 20px 15px; font-size:16px; letter-spacing: -1px; font-weight:bold; text-align:left; vertical-align: top;}
.productViewInfo .infoTable td { padding:20px 0 20px 30px; font-size:14px; color:#555;}
.productViewInfo .infoTable td p { line-height:1.71;}
.productViewInfo .infoTable td p + p { margin-top:30px;}
.productViewInfo .infoTable .line,
.productViewInfo .infoTable td + th, 
.productViewInfo .infoTable td { border-left:1px solid #e5e5e5;}
.productViewInfo .btn2 { display:block; float:right; position: relative; width:200px; height:44px; margin-bottom:20px; padding-left:20px; border-radius:22px; font-size:14px; color:#fff; font-weight:bold; line-height:44px; background:#8b9bcc;}
.productViewInfo .btn2:after { content:''; display:block; position:absolute; top:50%; right:20px; width:16px; height:16px; margin-top:-8px; background:url('../images/product/icon_btn2.png') no-repeat;}
.productViewWrap .btnLink { display:flex; width:100%; margin-top:20px;}
.productViewWrap .btnLink a { flex:1 1 auto; display:block; width:100%; height:70px; font-size:16px; text-align:center; color:#fff; font-weight:bold; line-height:70px;}
.productViewWrap .btnLink a + a { margin-left:20px;}
.productViewWrap .btn { background:#303a55;}
.productViewWrap .btn3 { background:#202021}

.productList { margin-top:70px;}
.productList ul { margin-left:-20px; margin-bottom:-60px; font-size:0;}
.productList ul li { display:inline-block; width:25%; padding-left:20px; margin-bottom:60px; vertical-align:top;}
.productList ul li a { display:block; position:relative;}
.productList ul li a:before { content:''; display:block; position:absolute; top:0; left:0; z-index:1; width:0%; height:0%; border:1px solid #e1e1e1; border-width:1px 0 0 1px; box-sizing:border-box; background:transparent; transition:all .2s ease;}
.productList ul li a:after { content:''; display:block; position:absolute; right:0; bottom:0; width:0%; height:0%; border:1px solid #e1e1e1; border-width:0 1px 1px 0; box-sizing:border-box; background:transparent; transition:all .2s .1s ease;}
.productList .img { overflow:hidden; position:relative;}
.productList .img img { width:100%;transition:all .3s ease;}
.productList .img span { position:absolute; top:30px; right:40px; width:16px; height:16px; transition:all .3s ease;}
.productList .img span:before { content:''; display:block; position:absolute; top:0; left:50%; bottom:0; width:2px; margin-left:-1px; background:#ebebeb; }
.productList .img span:after { content:''; display:block; position:absolute; top:50%; left:0; right:0; height:2px; margin-top:-1px; background:#ebebeb; }
.productList .textBox { position:relative; z-index:1; padding:10px 0 30px; text-align:center;}
.productList .textBox h2 { margin-bottom:10px; font-size:16px; color:#111111;}
.productList .textBox .txt1 { font-size:13px; color:#999999;}
.productList .textBox .txt2 {font-size:13px; color:#999999; font-weight:200;}

.productList a:hover {}
.productList a:hover:before { width:100%; height:100%;}
.productList a:hover:after { width:100%; height:100%;}
.productList a:hover .img img { transform:scale(1.1)}
.productList a:hover .img span { transform:rotate(180deg)}
.productList a:hover .img span:before,
.productList a:hover .img span:after { background:#262626}
.productList a:hover .textBox:before { width:100%; left:0;}

.editBox { border-top: 2px solid #e1e1e1; padding-top: 40px; padding-bottom:160px;}
.editBox img { max-width:100%;}


.inquiryWrap { margin:40px 0 150px;}
.inquiryWrap .text { margin-bottom:100px; font-size:30px; font-weight:bold; line-height:1.333;}
.inquiryWrap .agreeBox { position:relative; margin-top:70px; padding-top:70px; border-top:1px solid #d4d4d4;}
.inquiryWrap .agreeBox h2 { font-size:24px; font-weight:bold;}
.inquiryWrap .agreeBox .checkBox { position:absolute; top:70px; right:0; margin:0;}
.inquiryWrap .agreeTextBox { overflow-y:auto; height:520px; margin-top:40px; border:1px solid #e1e1e1; padding:50px;}
.inquiryWrap .agreeTextBox .title { margin-bottom:30px; font-size:22px;}
.inquiryWrap .agreeTextBox .title2 { margin-bottom:20px; font-size:18px; font-weight:bold;}
.inquiryWrap .agreeTextBox .text { margin-bottom:40px; font-size:16px; color:#999999; line-height:1.5}
.inquiryWrap .agreeTextBox .text + .title,
.inquiryWrap .agreeTextBox .text + .title2 { margin-top:70px;}
.inquiryWrap .btn { display:block; width:280px; height:70px; margin-top:50px; text-align:center; font-size:18px; color:#fff; line-height:70px; font-weight:bold; background:#303a55;}

.recruit1_1 { position:relative; padding-top:80px;}
.recruit1_1:before { content:''; display:block; position:absolute; bottom:0; left:50%; width:283px; height:600px; margin-left:400px; background:url('../images/recruit/bg_recruit1.png')}
.recruit1_1 h2 { margin-bottom:85px; font-size:40px; font-weight:100; line-height:1.25}
.recruit1_1 h2 span { display:block; margin-bottom:40px; font-size:16px;}
.recruit1_1 .list { padding:80px 0 120px; background:#f5f5f5;}
.recruit1_1 .list .innerBox { display:flex; padding-right:15%; justify-content:space-around; justify-content:space-between;}
.recruit1_1 .list .num { width:30px; height:30px; margin-bottom:45px; border:1px solid #adadad; border-radius:50%; line-height:28px; text-align:center; font-size:12px;}
.recruit1_1 .list .text { margin-bottom:45px; font-size:18px; font-weight:bold;}
.recruit1_1 .list .icon { display:block; width:46px; height:38px;}
.recruit1_1 .list .icon.type1 { background:url('../images/recruit/icon_recruit1_1.png');}
.recruit1_1 .list .icon.type2 { background:url('../images/recruit/icon_recruit1_2.png');}
.recruit1_1 .list .icon.type3 { background:url('../images/recruit/icon_recruit1_3.png');}
.recruit1_1 .list .icon.type4 { background:url('../images/recruit/icon_recruit1_4.png');}

.recruit1_2 { position:relative; padding-bottom:150px;}
.recruit1_2:before { content:''; display:block; position:absolute; top:392px; left:50%; width:100px; height:58px; margin-left:-50px; background:url('../images/recruit/icon_recruit1_5.png') no-repeat;}
.recruit1_2 h2 { height:421px; font-size:40px; color:#fff; font-weight:bold; text-align:center; line-height:421px; letter-spacing:10px; background:url('../images/recruit/img_recruit1.jpg') no-repeat center center; background-size:cover;}
.recruit1_2 ul { display:flex; padding-top:130px; justify-content:space-around; justify-content:space-between;}
.recruit1_2 ul li { display:flex; width:190px; height:190px; border-radius:50%; font-size:16px; font-weight:bold; align-items:center; justify-content:center; text-align:center; background:#f3f3f3;} 


/* 타블렛 변환 */
@media screen and (max-width:1240px){
	#container {margin-top: 70px; }
	.locationBox { top:190px;}
	
	.subVisual { margin-top:0;}

	.productViewWrap .contTit { padding-bottom:60px;}

	.productViewBox .thumbnail {width:528px;}

	.searchBox2 { top:115px;}
	
	.introduce6_1 .imgText img { max-width:100%;}
	.introduce6_1 .textBox { position:static; width:100%; margin-top:40px;}
	.introduce6_1 .textBox p { position:static; margin-top:20px;}
	.introduce6_1 .textBox p br { display:none;}
	
	.introduce6_2 { text-align:left;}
	.introduce6_2 h2 { position:static; padding-top:0; margin-bottom:40px;}
	.introduce6_2 .imgText { display:block; position:relative; width:100%; height:260px; padding-left:320px;}
	.introduce6_2 .imgText img { position:absolute; top:0; left:0;}
	.introduce6_2 .imgText .textBox { width:100%; margin-left:0;}
	.introduce6_2 .imgText .textBox p br { display:none;}
	
	.recruit1_1:before { margin-left:30%;}
}

@media screen and (max-width:950px){
	
	
	
	.boardView .boardHeader { padding-left:50px; padding-right:50px;}
	.boardView .boardCont { padding:50px;}

	.introduce1 { display:block;}
	.introduce1 .textBox { width:100%;}
	.introduce1 .textBox br { display:none;}
	.introduce1 .president { position:static; margin-top:40px;}
	
	.introduce7 .textBox { overflow:hidden; display:block;}
	.introduce7 .textBox > div { float:left; width:50%;}
	.introduce7 .textBox > div:nth-child(3) { width:100%;}
	
	/* 제품소개 */
	.productViewWrap { padding-bottom:100px;}
	.productViewBox { display:block;}
	.productViewBox .productImg { width:100%;}
	.productViewBox .imgBox { height:auto; padding-right:0; padding-bottom:100px;}
	.productViewBox .thumbnail { bottom:0; top:auto; right:0; width:444px;}
	.productViewBox .thumbnail .thumbnailList a { width:80px; height:80px;}
	.productViewBox .thumbnail .btnLeft { width:25px; height:62px;}
	.productViewBox .thumbnail .btnRight { width:25px; height:62px;}
	
	.productViewInfo { width:100%; padding-top:20px;}
	
	.inquiryWrap .text br { display:none;}
	
	.recruit1_1 .list .innerBox {flex-flow: wrap;}
	.recruit1_1 .list .innerBox > div { width:50%; margin-bottom:30px;}
	
	.recruit1_2 ul { justify-content:center;flex-flow: wrap;}
	.recruit1_2 ul li { margin:0 10px;}
	
	.productList ul li { width:33.33%;}
	.productList .textBox { padding:20px;}
	
}
/* 모바일 */
@media screen and (max-width:768px){
	/*
	 * 모바일
	 * 대타이틀 : 30
	 * 타이틀 : 22
	 * 텍스트 : 16
	 * 작은 텍스트 : 14
	 * 버튼 : 16	
	 * 간격 : 50, 35, 20
	 */

	#container { margin-top:50px;}
	
	.imgPC { display:none;}
	.imgMo { display:block;}
	
	.subVisual { height:150px;}
	.contTit { padding:30px 0 0px; font-size:30px;}
	.productViewWrap .contTit { padding-bottom:0;}
	.locationBox { display:none;}
	
	/* table */
	[class*=table] .width1 { width:60px;}
	[class*=table] .width2 { width:85px;}
	[class*=table] .width3 {}
	[class*=table] .width4 {}
	
	[class*=table] .number { display:none;}
	
	.tableList th { height:50px; font-size:13px;}
	.tableList td { padding:10px 5px; font-size:13px;}
	.tableList td.tl { padding-left:20px}
	.tableList td a { padding:15px 0;}
	.tableList td .iconMedia { padding-right:20px; font-size:13px;}
	.tableList td .iconMedia:after { right:4px;}
	
	.boardView { margin-top:50px;}
	.boardView .boardHeader { padding:20px;}
	.boardView .boardHeader .title { font-size:16px;}
	.boardView .boardHeader .data {margin-top:10px; font-size:14px;}
	.boardView .boardHeader .name { margin-top:10px; font-size:14px;}
	.boardView .boardHeader.type2 .data { right:20px;}
	.boardView .boardCont { padding:20px 20px; font-size:14px;}
	.boardView .btnList { width:50%; height:50px; margin:35px auto 50px; font-size:14px; line-height:50px;}
	
	.paging { margin:35px 0 50px;}
	.paging strong, .paging a { width:45px; height:45px; line-height:45px;}

	/* searchbox */
	.searchBox { display:block; height:auto; margin:35px 0 50px; border:3px solid #e1e1e1;}
	.searchBox select { width:100%; height:40px; border-bottom:1px solid #e1e1e1; padding-left:20px;}
	.searchBox input { display:block; height:50px; padding:0 40px 0 20px; line-height:50px; font-size:14px;}
	.searchBox button { position:absolute; top:40px; right:0; width:50px; height:50px;}
	
	.searchBox2 { position:relative; top:auto; left:auto; width:100%; margin-top:30px;}
	.searchBox2 input {height:50px; padding:0 50px 0 20px; line-height:50px; font-size:14px;}
	.searchBox2 button { position:absolute; top:0px; right:0; width:50px; height:50px;}
	
	/* 회사소개 */
	.introduce1 { margin-bottom:50px; margin-top:50px;}
	.introduce1 h2 { font-size:22px;}
	.introduce1 h2 span { margin-bottom:20px; font-size:14px;}
	.introduce1 .textBox { padding-top:35px;}
	.introduce1 .textBox p { font-size:14px;}
	.introduce1 .textBox p + p { margin-top:10px;}
	.introduce1 .president { margin-top:35px;}
	
	.introduce2_1 { padding-bottom:0px; background-size:cover;}
	.introduce2_1 .textBox { padding-top:50px;}
	.introduce2_1 h2 { margin-bottom:10px; font-size:22px; font-weight:bold;}
	.introduce2_1 ul { margin-bottom:35px;}
	.introduce2_1 li { font-size:14px; line-height:1.5}
	.introduce2_1 li + li { margin-top:10px;}
	.introduce2_1 .imgFull { margin:50px -20px 0;}
	.introduce2_2 { padding:50px 0;}
	.introduce2_2 h2 { margin-bottom:35px; font-size:22px; font-weight:bold;}
	
	.introduce3 { padding-bottom:50px;}
	.introduce3 .imgFull { padding-top:50px;}
	
	.introduce4 { margin:50px 0;}
	.introduce4:before { display:none;}
	.introduce4 > div { min-height:auto;}
	.introduce4 > div:before { display:none;}
	.introduce4 > div + div { margin-top:35px;}
	.introduce4 .cssMotion .textBox { width:100%; text-align:left;}
	.introduce4 h2 { position:static; font-size:30px; text-align:left;}
	.introduce4 .textBox { padding-bottom:0px;}
	.introduce4 .textBox dl { padding-left:0; margin-bottom:10px;}
	.introduce4 .textBox dt { width:80px; font-size:14px;}
	.introduce4 .textBox dd { font-size:14px;}
	.introduce4 .top,
	.introduce4 .bottom { display:none;}
	
	.introduce5 { margin-top:50px; margin-bottom:50px;}
	.introduce5 h2 { margin-bottom:35px; font-size:22px;}
	.introduce5 ul li { width:50%; margin-bottom:20px; animation-delay:0ms !important;}
	.introduce5 ul li.type2 { width:100%;}
	.introduce5 ul li:nth-child(6),
	.introduce5 ul li:nth-child(7) { margin-top:0px}
	.introduce5 ul + h2 { margin-top:35px;}
	
	.introduce6_1 { padding-bottom:50px;}
	.introduce6_1 h2 { padding-top:35px; margin-bottom:35px; font-size:22px;}
	.introduce6_1 .textBox h3 { font-size:16px;}
	.introduce6_1 .textBox p { font-size:14px;}

	.introduce6_2 { padding:50px 0;}
	.introduce6_2 h2 { margin-bottom:35px; font-size:22px;}
	.introduce6_2 .imgText { height:auto; padding-left:0;}
	.introduce6_2 .imgText img { position:static; width:100%;}
	.introduce6_2 .imgText .textBox { display:block;}
	.introduce6_2 .imgText .textBox p { padding-left:60px; font-size:14px;}
	.introduce6_2 .imgText .textBox p:before { top:5px; width:40px; height:40px;}
	.introduce6_2 .imgText .textBox p + p { margin-top:20px;}
	
	.introduce7 { padding-top:35px;}
	.introduce7 .textBox { margin-top:0px;}
	.introduce7 .textBox > div:nth-child(1) { padding-right:5px;}
	.introduce7 .textBox h2 { font-size:22px;}
	.introduce7 .textBox h2.small { font-size:16px;}
	.introduce7 .textBox h2 span { font-size:16px;}
	.introduce7 .textBox .text { margin-top:20px; font-size:14px;}
	.introduce7 .textBox .time { font-size:24px;}
	.introduce7 .textBox .time span { font-size:12px;}
	.introduce7 .textBox .day { margin-top:10px; font-size:14px;}
	.introduce7 .textBox .text2 { margin-top:5px; font-size:14px;}
	.introduce7 .textBox dl { margin-top:35px; font-size:14px;}
	
	.locationMap { margin-top:50px;}
	.locationMap iframe { height:300px;}
	
	
	/* 제품 소개 */
	.productViewWrap .tabBox { overflow-x:scroll; margin-top:35px;}
	.productViewWrap .tabBox a { flex:1 0 auto; width:140px;}
	.productViewWrap .depth3 { overflow-x:scroll; display:flex; margin-top:20px;}
	.productViewWrap .depth3 a { flex:1 0 auto; padding:0 10px;}
	.productViewWrap .depth3 a.on { color:#262626;}
	.productViewWrap .productView { margin-top:50px;}
	.productViewWrap .productView .location { padding-bottom:20px; margin-bottom:35px;}
	
	.productViewWrap h2 { margin-top:50px; font-size:22px;}
	.productViewWrap .productImg .imgBox { padding-left:0;}
	
	.productViewInfo .infomation { overflow:hidden; padding-top:50px;}
	.productViewInfo .infoTable { margin-bottom:35px;}
	.productViewInfo .infoTable .width1 { width:80px;}
	.productViewInfo .infoTable th { padding:10px 0 10px 10px; font-size:13px; letter-spacing:-1px;}
	.productViewInfo .infoTable td { padding:10px; font-size:12px;}
	.productViewInfo .infomation .btnLink { flex-wrap: wrap;}
	.productViewInfo .infomation .btnLink a + a { margin-left:0px; margin-top:20px;}
	
	.productViewInfo .btn2 { font-size:13px; }
	.productViewWrap .btnLink a { height:50px; line-height:50px; font-size:14px;}
	
	.productViewBox .thumbnail { bottom:0; top:auto; width:340px;}

	.productList { margin-top:50px;}
	.productList ul { margin-left:-20px; margin-bottom:-50px;}
	.productList ul li { width:50%; padding-left:20px; margin-bottom:50px;}
	.productList .img span { top:10px; right:20px;}
	.productList .textBox { padding:10px;}
	.productList .textBox h2 { font-size:16px;}
	.productList .textBox .txt1 { font-size:14px;}
	.productList .textBox .txt2 {font-size:14px;}

	.editBox { padding-top: 40px; padding-bottom:80px;}
	.editBox p { font-size:14px;}
	.editBox img { max-width:100%;}
	
	.checkBox { margin:25px 0;}
	.checkBox label { font-size:14px;}
	
	.inquiryWrap { margin:35px 0 50px;}
	.inquiryWrap > .text { margin-bottom:35px; font-size:16px;}
	.inquiryWrap .agreeBox { margin-top:50px; padding-top:50px;}
	.inquiryWrap .agreeBox h2 { font-size:22px;}
	.inquiryWrap .agreeBox .checkBox { position:static; margin-top:20px;}
	.inquiryWrap .agreeTextBox { height:300px; margin-top:35px; padding:20px;}
	.inquiryWrap .agreeTextBox .title1 { margin-bottom:20px; font-size:22px;}
	.inquiryWrap .agreeTextBox .title2 { margin-bottom:10px; font-size:16px;}
	.inquiryWrap .agreeTextBox .text { margin-bottom:10px; font-size:14px;}
	.inquiryWrap .agreeTextBox .text + .title,
	.inquiryWrap .agreeTextBox .text + .title2 { margin-top:35px;}
	.inquiryWrap .btn { width:auto; height:50px; margin-top:35px; line-height:50px; font-size:14px;}
	
	.formWrap { padding-left:0;}
	.formWrap + .formWrap { margin-top:35px;}
	.formWrap .title { display:block; position:static; margin-bottom:10px; font-size:16px;}
	.formWrap .inputBox {}
	.formWrap .inputBox input { height:50px; padding-left:20px; line-height:48px; font-size:14px;}
	.formWrap .inputBox select { height:50px; padding-left:20px; line-height:48px; font-size:14px;}
	.formWrap .inputBox textarea { height:200px; padding:20px;}
	
	.fileBox { padding-right:0px;}
	.fileBox > input { height:50px; padding-left:20px; line-height:48px; font-size:14px;}
	.fileBox .fileBtn { position:static;}
	.fileBox .fileBtn label { width:100%; height:50px; line-height:50px;}
	
	.recruit1_1 { padding-top:50px;}
	.recruit1_1:before { bottom:0; top:29px; left:auto; right:-37px; width:150px; height:317px; margin-left:0px; background-size:100%; background-repeat:no-repeat;}
	.recruit1_1 h2 { margin-bottom:50px; font-size:30px;}
	.recruit1_1 h2 span { margin-bottom:20px; font-size:16px;}
	.recruit1_1 .list { padding:50px 0 15px;}
	.recruit1_1 .list .innerBox > div { margin-bottom:35px;}
	.recruit1_1 .list .num { width:25px; height:25px; margin-bottom:20px; line-height:23px;}
	.recruit1_1 .list .text { margin-bottom:35px; font-size:16px;}
	
	.recruit1_2 { padding-bottom:50px;}
	.recruit1_2:before { top:240px; width:50px; margin-left:-25px; background-size:100%;}
	.recruit1_2 h2 { height:250px; font-size:30px; line-height:250px;}
	.recruit1_2 ul { padding-top:50px;}
	.recruit1_2 ul li { width:95px; height:95px; margin:5px; font-size:14px;} 

}