@charset "utf-8";

@import url('base.css');

/************************************************
	skipLink
************************************************/
#skipLink{ width:100%; overflow:hidden; position:relative; z-index:1000;}
#skipLink a{ margin:0px -1px -1px 0px; width:1px; height:1px; text-align:center; line-height:0; overflow:hidden; font-size:0px; display:block;}
#skipLink a:focus{ background:rgb(32, 38, 44); margin:0px; padding:8px 0px 8px 15px; width:auto; height:30px; color:rgb(255, 255, 255); line-height:1; font-size:12px; font-weight:700;}
#skipLink a:hover{ background:rgb(32, 38, 44); margin:0px; padding:8px 0px 8px 15px; width:auto; height:30px; color:rgb(255, 255, 255); line-height:1; font-size:12px; font-weight:700;}
#skipLink a:active{ background:rgb(32, 38, 44); margin:0px; padding:8px 0px 8px 15px; width:auto; height:30px; color:rgb(255, 255, 255); line-height:1; font-size:12px; font-weight:700;}

/* --------------------------------------------
 * layout
/* ------------------------------------------ */
.mbg{ display:none; position:fixed; left:0; top:0; width:100%; height:100%; background-color:#000; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter:alpha(opacity=70); opacity:.7; z-index:9;}
.mbg.type01{ height: calc(100vh - 6rem);}
body.ovf_hdn, .ovf_hdn{ overflow:hidden; height:100%;}

#wrap{ position: relative; width:100%; margin:0 auto; overflow:hidden; padding: 0;}

#header{ position: absolute; top: 0; left: 0; width:100%; z-index:5; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition:all 0.2s ease-in-out; }
#header.out{ top: -100px;}
#header > .inner{ width: 100%; height: 100px; margin: 0 auto; position: relative; padding: 0; max-width: 1280px; display: flex; justify-content: space-between; align-items: center;}
#header h1.logo{ position: relative; width: 102px; z-index: 3;  -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition:all 0.2s ease-in-out;}
#header h1.logo a{ display: block; text-indent: -9999px; height: 40px; background: url(../images/logo.png) 50% 50% no-repeat; background-size: 100% auto;}
#header .utill{ display: flex; align-items: center;}
#header .lang{ position: relative; z-index: 4; font-family: 'Roboto'; }
#header .lang::before{ content:""; position: absolute; top:0; left:0; width:100%; height:32px; display:block; border: rgba(255,255,255,.25) 1px solid; border-radius: 15px; transition:all 0.1s ease-in-out; }
#header .lang .bt{ position: relative; display: block; font-size: 14px; color: #fff; width: 66px; height: 32px; line-height: 32px;  font-weight: 600;  padding: 0 22px 0 14px;}
#header .lang .bt::after{ content: ''; display: block; position: absolute; top: 50%; right: 12px; width: 6px; height: 6px; margin-top: -5px; transform: rotate(135deg); border-top: #898989 2px solid; border-right: #898989 2px solid;}
#header .lang.active::before{ height:64px;}
#header .lang.active .bt::after{ transform: rotate(-45deg);  }
#header .lang ul{ position: absolute; top: 30px; left: 0; width: 100%; display: none;}
#header .lang ul a{ color:#fff; font-size: 14px; padding: 0 14px; display:block; line-height:32px;}
#header .bt-mn{ position: relative; width: 32px; height: 32px; display: block; margin-left: 12px;}
#header .bt-mn span{ position: absolute; top: -9999px; left: -9999px;}
#header .bt-mn i{ position: absolute; display: block; background-color: #fff; height: 2px; width: 24px; top: 50%; right: 0; }
#header .bt-mn i:nth-child(1){ margin-top: -6px;}
#header .bt-mn i:nth-child(3){ margin-top: 6px;}
body.main #header{ position: fixed;}
.fixed #header{ position: fixed; background-color: #090909;}
.dark #header{ background-color: #090909;}

#container{ position: relative; margin: 0 auto; padding: 0 0 180px 0; }
#container::before{ content: ''; display: block; clear: both; height: .05rem; width: 100%;}

#contents{ padding: 210px 0 0; max-width: 1280px;  margin: 0 auto;}

.h2-tit{ font-size: 36px; color: #111; font-weight: 600; }

footer{ position: relative; background-color: #191919; color: #fff; padding: 90px 0;}
footer .footer-wrap{ position: relative; max-width: 1280px; margin: 0 auto; padding-right: 480px;}
footer address{ margin-top: 12px; color: #888;}
footer address span + span{ margin-left: 30px;}
footer .copy{ margin-top: 10px; color: #333;}
footer .foot-bt{ position: absolute; bottom: 0; right: 0; display: flex;}
footer .foot-bt a{ display: flex; align-items: center; border: #555 1px solid; color: #555; padding: 0 20px; height: 50px; justify-content: space-between; width: 228px;}
footer .foot-bt a::after{ content: ''; width: 16px; height: 16px; background: url(../images/ic_dw.png);}
footer .foot-bt a + a{ margin-left: 10px;}
footer .foot-bt a:hover{ background-color: #222;}

.opacity{ opacity: 0;}

#menu{ position: fixed; z-index: 2; top: 50%; left: 90px; transform: translateY(-50%);}
#menu li{ position: relative;}
#menu li + li{ margin-top: 5px;}
#menu li a{ display: block; padding-left: 18px; font-size: 14px; color: #222; font-weight: 600;}
#menu li a span{ opacity: 0;}
#menu li a::before{ content: ''; position: absolute; top: 50%; left: 3px; width: 4px; height: 4px; display: block; margin-top: -2px; background-color: #8d8d8d; border-radius: 50%;}
#menu li.active a::before{ width: 10px; height: 10px; background-color: #000; margin-top: -5px; left: 0; }
#menu li.active a span{ opacity: 1;}
#menu.light li a::before{ background-color: #fff;}
#menu.light li a{ color: #fff;}

#siteFunctions{ position: fixed; top: 24px; bottom: 75px; right: 50%; margin-right: -640px; z-index: 10; display: none; width: 480px; background-color: #191919; padding: 80px 50px; }
#siteFunctions .lnb-bottom{ margin-top: 30px; color: #555; font-size: 13px;}
#siteFunctions .lnb-bottom p + p{ margin-top: 8px;}
#siteFunctions .bt-close{ position: absolute; top: 22px; right: 50px; width: 30px; height: 30px; display: block;}
#siteFunctions .bt-close span{ position: absolute; top: -9999px; left: -9999px;}
#siteFunctions .bt-close::before{ content: ''; position: absolute; top: 50%; left: 50%; width: 18px; height: 2px; background-color: #fff; display: block; margin: -1px 0 0 -9px; transform: rotate(45deg);}
#siteFunctions .bt-close::after{ content: ''; position: absolute; top: 50%; left: 50%; width: 18px; height: 2px; background-color: #fff; display: block; margin: -1px 0 0 -9px;transform: rotate(-45deg);}
.mobMenu a{ position: relative; display: block; color: #777;}
.mobMenu > li > a{ border-bottom: #333 1px solid; color: #fff; font-size: 18px; padding: 25px 0;}
.mobMenu > li > a::after{ content: ''; width: 70px; height: 70px; display: block; position: absolute; top: 50%; right: 0; margin-top: -35px; background: url(../images/blt_plus.png) 50% 50% no-repeat;}
.mobMenu > li.active > a::after{ background-image: url(../images/blt_minus.png);}
.subDepth{ border-bottom: #333 1px solid; padding: 15px 2px;}
.subDepth > li + li{ margin-top: 25px;}

@media screen and (max-width:1200px){
}

/* main */
#indexWrap .section .inbx{ padding-top: 100px; }
#indexWrap .section{ background-size: cover; background-position: 50% 50%;}
.section01{ background-image: url(../images/main_sec02.jpg); }
#indexWrap .section02 .inbx{ padding: 200px 0;}
#indexWrap .section02 .inbx{ background-image: url(../images/main_sec03.jpg); background-size: cover;}

.mainVis .swiper-slide{ position: relative; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.mainVis .bg{ position: relative; width: 100%; height: 100vh; background: url(../images/main_vis_bg.jpg) 50% 50% no-repeat; background-size: cover;}
.mainVis .copy{ position: absolute; color: #fff; font-size: 18px; display: flex; flex-direction: column; justify-content: flex-end;}
.mainVis .copy b{ display: block; font-size: 70px; line-height: 1.1; opacity: 0; font-family: 'Roboto';}
.mainVis .copy span{ display: block; margin-top: 30px; opacity: 0;}
.mainVis .itm1 .copy{ background: url(../images/main_vis01.png) 100% 50% no-repeat; width: 680px; height: 572px; padding-bottom: 30px; }
.mainVis .itm2 .copy{ background: url(../images/main_vis02.png) 100% 50% no-repeat; width: 680px; height: 572px; padding-bottom: 30px; }
.mainVis .itm3 .copy{ background: url(../images/main_vis03.png) 100% 50% no-repeat; width: 680px; height: 572px; padding-bottom: 30px; }
.mainVis .corl{ position: absolute; bottom: 85px; right: 50%; margin: 0 -640px 0 0; display: flex; justify-content: center; align-items: center; color: #aaa; font-size: 14px; z-index: 3;}
.mainVis .corl button{ display: flex; align-items: center; color: #aaa; font-size: 14px;}
.mainVis .corl .prev::before{ content: ''; width: 16px; height: 16px; border-top: #aaa 3px solid; border-right: #aaa 3px solid; transform: rotate(-135deg); margin-right: 8px;}
.mainVis .corl .next::after{ content: ''; width: 16px; height: 16px; border-top: #aaa 3px solid; border-right: #aaa 3px solid; transform: rotate(45deg); margin-left: 8px;}
.mainVis .corl .prev:hover,
.mainVis .corl .next:hover,
.mainVis .corl .prev:hover::before,
.mainVis .corl .next:hover::after{ color: #fff; border-color:#fff;}
.mainVis .corl span{ margin: 0 5px;}

.main-tit{ max-width: 1280px; margin: 0 auto 60px;}
.main-tit .tit{ font-size: 62px;}
.main-tit p{ margin-top: 30px;}
.main-tit p span{ display: block; margin-top: 15px;}
.section02 .main-tit{ text-align: center;}

.main-productLst{ max-width: 1280px; margin: 0 auto; display: flex;}
.main-productLst .itm{ flex: 1; position: relative;}
.main-productLst .itm + .itm{ margin-left: 38px;}
.main-productLst .itm .thumb{ display: block;}
.main-productLst .itm .desc{ position: absolute; top: 0; left: 0; width: 100%; bottom: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; font-size: 20px; color: #fff; background-color: rgba(0,0,0,0); transition:all 0.2s ease-in-out;}
.main-productLst .itm .desc strong{ display: flex; font-weight: 400;}
.main-productLst .itm .desc strong em{ position: relative;}
.main-productLst .itm .desc strong em + em{ margin-left: 8px; padding-left: 8px; }
.main-productLst .itm .desc strong em + em::before{ content: ''; position: absolute; top: 50%; left: 0; margin-top: -6px; height: 12px; width: 1px; background-color: rgba(255,255,255,.5);}
.main-productLst .itm .desc .bt{ width: 40px; height: 40px; border-radius: 50%; border: rgba(255,255,255,.5) 1px solid; background-image: url(../images/ic_plus.png); background-position: 50% 50%; background-repeat: no-repeat; margin-top: 12px; transition:all 0.2s ease-in-out;}
.main-productLst .itm .desc .bt i{ position: absolute; top: -9999px; left: -9999px;}
.main-productLst .itm a:hover .desc{ background-color: rgba(0,0,0,.65); }
.main-productLst .itm a:hover .desc .bt{ transform: rotate(180deg);}

.section02 .btz{ margin: 50px 0 0 0; display: flex; justify-content: center;}
.section02 .btz .bt{ border: #d6d6d6 1px solid; height: 60px; display: flex; align-items: center; justify-content: space-between; width: 300px; font-size: 18px; font-weight: 600; padding: 0 30px 0 28px;}
.section02 .btz .bt + .bt{ margin-left: 18px;}
.section02 .btz .bt::after{ content: ''; width: 18px; height: 10px; background: url(../images/ic_arr.png) 50% 50% no-repeat;}
.section02 .btz .bt:hover{ background-color: #000; border-color:#000; color: #fff;}
.section02 .btz .bt:hover::after{ background: url(../images/ic_arr_w.png) 50% 50% no-repeat;}

/* sub */
.locationBar{ position: absolute; top: 660px; width: 100%; left: 50%; transform: translateX(-50%); background-color: #fff; z-index: 3; }
.sub0101 .locationBar,
.sub0102 .locationBar{ transition:all 0.7s ease; }
.locationBar .inner{ max-width: 1280px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between;}
.locationBar .inner .breadcrumb{ font-size: 14px; display: flex;}
.locationBar .inner .breadcrumb .home{ display: flex; align-items: center; color: rgba(12,35,64,.4);}
.locationBar .inner .breadcrumb .home::before{ content: ''; width: 14px; height: 14px; background: url(../images/ic_h.png) 50% 50% no-repeat; margin-right: 14px; }
.locationBar .inner .breadcrumb .home + *{ background: url(../images/ic_loc.png) 0 50% no-repeat;}
.locationBar .inner .breadcrumb strong{ margin-left: 10px; padding-left: 15px; position: relative; color: rgba(12,35,64,1); font-weight: 400;}
.sub-mn{ display: flex;}
.sub-mn > li a{ display: block; height: 120px; line-height: 120px; position: relative; color: rgba(12,35,64,.4); font-size: 24px; padding: 0 12px;}
.sub-mn > li a::after{ content: ''; position: absolute; bottom: 0; left: 50%; width: 0; background-color: #0c2340; opacity: 0; height: 3px; transition:all 0.2s ease-in-out; }
.sub-mn > li + li{ margin-left: 90px;}
.sub-mn > li.active a,
.sub-mn > li:hover a{ font-weight: 600; color: rgba(12,35,64,1);}
.sub-mn > li.active a::after,
.sub-mn > li:hover a::after{ width: 100%; opacity: 1; left: 0;}
.locationBar.fixed{ position: fixed; top: 100px;}
.locationBar.fixed .sub-mn > li a{ height: 60px; line-height: 60px;}
.sub0101 .locationBar.fixed,
.sub0102 .locationBar.fixed{ top: 0; }

/* products */
.sub-vis .copy{ position: absolute; top: 0; left: 50%; width: 1280px; margin: 0 auto; justify-content: center; transform: translateX(-50%); display: flex; height: 660px; flex-direction: column; color: #fff; font-size: 18px;}
.sub-vis .copy b{ display: block; font-size: 66px; line-height: 1.2; font-family: 'GmarketSans'; font-weight: 500;}
.sub-vis .copy span{ display: block; margin-top: 30px;}
.pro-vis{ vertical-align: top;}
.pro-vis .bg{ position: relative; background-size: cover; height: 660px; }
.pro-vis.pro01 .bg{ background-image: url(../images/pro01_vis.jpg); }    
.pro-vis.pro02 .bg{ background-image: url(../images/pro02_vis.jpg); }    
.pro-vis.pro03 .bg{ background-image: url(../images/pro03_vis.jpg); }  
.pro-vis.company .bg{ background-image: url(../images/company_vis.jpg); }   
.pro-vis.estimate .bg{ background-image: url(../images/estimate_vis.jpg); }   

.pro-desc01{ margin: 0 auto; padding: 180px 0 0;}
.fp-viewing-pro0102 .pro-desc01{ padding-top: 80px;}
.pro-desc01 .desc{ position: relative; font-size: 21px; max-width: 1280px; margin: 0 auto; z-index: 2;}
.pro-desc01 .desc .txt{ margin-top: 30px;}
.pro-desc01 .desc .img{ margin-top: 100px;}
.pro-desc01 .thumb{ position: absolute; top: 180px; left: 50%; }
.pro-desc01 .thumb img{ height: 600px;}
.pro-title{ max-width: 1280px; margin: 120px auto 110px;}
.pro-title .tit{ text-align: center; font-size: 36px; color: #222; text-transform: uppercase; margin-bottom: 35px;}
.pro-title .tit span{ font-weight: 400;}
.pro-title p{ text-align: center; font-size: 21px; color: #333; line-height: 1.2;}

.pro-hd{ max-width: 1280px; margin: 0 auto 120px; display: flex; }
.pro-hd .t-tx{ padding: 0 0 0 240px; position: relative; color: #111; font-size: 36px; font-weight: 600; line-height: 1.2; width: 50%; text-transform: uppercase;}
.pro-hd .t-tx::before{ content: ''; position: absolute; top: 0; left: 0; width: 120px; height: 8px; background-color: #111; display: block;}
.pro-hd .c-tx{ color: #333; font-size: 21px;}
.pro-tgumb{ max-width: 1280px; margin: 0 auto;}

.pro01-lst01{ max-width: 1280px; margin: 0 auto; display: flex; justify-content: space-evenly;}
.pro01-lst01 dl{ border-top: #a1a1a1 2px solid;}
.pro01-lst01 dl dt{ line-height: 58px; text-align: center; font-size: 16px; text-transform: uppercase;}
.pro01-lst01 dl dd{ text-align: center;}

.pro0102{ position: relative; padding: 0;}
.pro0102::before{ content: ''; position: absolute; background-color: #f9f9f9; bottom: 0; top: 700px; left: 0; width: 100%; z-index: -1;}
.pro0102-1{ position: relative; padding: 0;}
.pro0102-1::before{ content: ''; position: absolute; background-color: #f9f9f9; bottom: 0; top: 0; left: 0; width: 100%; z-index: -1;}
.pro0103{ position: relative; padding: 0;}
.pro0202{ position: relative; padding: 0;}
.pro0202::before{ content: ''; position: absolute; background-color: #f9f9f9; bottom: 0; top: 700px; left: 0; width: 100%; z-index: -1;}

.pro-desc0201{ max-width: 1280px; display: flex; justify-content: space-evenly; margin: 0 auto;}

.mov-bx{ position: relative; margin-top: 80px; }
.mov-bx .cover{ position: absolute; top: 0; left: 0; width: 100%; height: 600px; }
.mov-bx .cover::after{ content: ''; position: absolute; top: 0; left: 0; width: 100%; bottom: 0; background-color: rgba(0,0,0,.5);}
.mov-bx .cover img{ width: 100%; height: 600px; object-fit: cover; object-position: center;}
.mov-bx .cover .bt{ position: absolute; top: 50%; left: 50%; width: 100px; height: 100px; display: block; margin: -50px 0 0 -50px; background: url(../images/bt_play.png) 50% 50% no-repeat; text-indent: -9999px; z-index: 3;}
.mov-bx iframe{ width: 100%; height: 600px; display: block; object-fit: cover;}

.pro2-desc01{ max-width: 1280px; margin: 0 auto; overflow: hidden;}
.pro2-desc01 .swiper-slide{ position: relative; text-align: center;}
.pro2-desc01 .swiper-slide::after{ content: ''; position: absolute; top: -44px; left: 50%; width: 18px; height: 18px; background-color: #000; border: #fff 5px solid; border-radius: 50%; margin-left: -9px;}
.pro2-desc01 .swiper-slide b{ font-size: 18px; color: #222; display: block; font-weight: 400;}
.pro2-desc01 .swiper-slide p{ margin-top: 30px;}
.pro2-desc01 .cotl{ position: relative; display: flex; justify-content: space-between; margin-bottom: 20px;}
.pro2-desc01 .cotl::before{ content: ''; position: absolute; top: 50%; left: 30px; width: calc(100% - 60px); height: 1px; background-color: #a1a1a1;}
.pro2-desc01 .cotl button{ position: relative; width: 30px; height: 30px; border: #0f0f0f 1px solid; border-radius: 50%; background-color: #fff; display: flex; justify-content: center; align-items: center; opacity: .5;}
.pro2-desc01 .cotl button:hover{ opacity: 1;}
.pro2-desc01 .cotl button span{ position: absolute; top: -9999px; left: -9999px;}
.pro2-desc01 .cotl button::after{ content: ''; display: block; width: 10px; height: 10px; border-top: #222 2px solid; border-right: #222 2px solid; transform: rotate(45deg); margin-right: 4px; }
.pro2-desc01 .cotl button.prev::after{ transform: rotate(-135deg); margin-right: 0; margin-left: 4px;}

.tbl-hd{ display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px;}
.tbl-hd .total{ color: #939394;}
.tbl-hd .total b{ color: #000;}
.tbl-hd .tbl-sch{ display: flex; border: #cecece 1px solid;}
.tbl-hd .tbl-sch .select{ width: 160px; border: none;}
.tbl-hd .tbl-sch .keyword{ border: none; width: 180px;}
.tbl-hd .tbl-sch .sch-bx{ display: flex; border-left: #cecece 1px solid;}
.tbl-hd .tbl-sch .sch{ width: 60px; height: 40px; background: url(../images/ic_sch.png) 50% 50% no-repeat; text-indent: -9999px; text-align: left;}

div.paging{ text-align:center; padding:0; margin:50px 0 0 0; position:relative; clear:both;}
div.paging a,
div.paging strong{ display:inline-block; width:38px; height:38px; line-height:38px; font-size: 16px; color:#111; text-align:center; margin:0; vertical-align:middle; overflow: hidden; margin-left: -5px;}
div.paging a:hover{ color: #23439b;}
div.paging .on,
div.paging .on:hover{ color:#23439b; font-weight:600; }
div.paging .direction{ position:relative; opacity: .2;}
div.paging .direction > span{ position:absolute; top:-9999px; left:-9999px;}
div.paging .direction.first:before{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 0px; width:10px; height:10px; display:block;  border:2px solid #111; border-top:none;border-right:none;-webkit-transform:rotate(45deg);transform:rotate(45deg); }
div.paging .direction.first:after{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 -4px; width:10px; height:10px; display:block;  border:2px solid #111; border-top:none;border-right:none;-webkit-transform:rotate(45deg);transform:rotate(45deg); }
div.paging .direction.prev:after{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 -4px; width:10px; height:10px; display:block;  border:2px solid #111; border-top:none;border-right:none;-webkit-transform:rotate(45deg);transform:rotate(45deg); }
div.paging .direction.next:after{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 -4px; width:10px; height:10px; display:block;  border:2px solid #111; border-top:none;border-right:none;-webkit-transform:rotate(-135deg);transform:rotate(-135deg); }
div.paging .direction.last:before{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 -8px; width:10px; height:10px; display:block;  border:2px solid #111; border-top:none;border-right:none;-webkit-transform:rotate(-135deg);transform:rotate(-135deg); }
div.paging .direction.last:after{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 -4px; width:10px; height:10px; display:block;  border:2px solid #111; border-top:none;border-right:none;-webkit-transform:rotate(-135deg);transform:rotate(-135deg); }
div.paging .direction:hover{ opacity: 1;}

.thumb-list{ border-top: #222 2px solid; display: flex; flex-wrap: wrap;}
.thumb-list .itm{ width: calc(33.3% - 25px); margin: 55px 0 0 38px;}
.thumb-list .itm:nth-child(3n+1){ margin-left: 0;}
.thumb-list .itm .name{ display: block; padding: 35px 30px 0; font-size: 20px; color: #222; font-weight: 600;}

.tblView { border-top:2px solid #222;}
.tblView .top { padding:40px 30px 40px 0; border-bottom:1px solid #cecece; text-align:center; background-color: #f6f6f6; display: flex; align-items: center;}
.tblView .top .num { font-size:21px; color:#999; width: 90px; flex: 0 0 auto;}
.tblView .top .tit { font-size:24px; color:#111; font-weight:bold; flex: 1 1 auto; text-align: left; padding-left: 50px;}
.tblView .top .date { font-size:14px; color:#999; width: 130px; flex: 0 0 auto;}
.tblView .contBox { padding:40px; border-bottom:1px solid #d9d9d9; }
.tblView .bottom { display:flex; margin-top:50px; align-items: center;}
.tblView .bottom .btnPrev { flex: 0 0 auto; width: calc(50% - 150px); font-size:14px; display:flex; align-items: center;}
.tblView .bottom .btnPrev b{ position: relative; flex: 0 0 auto; width: 110px;}
.tblView .bottom .btnPrev b::before { content:''; display:inline-block; width:12px; height:12px; margin-right:20px; margin-top:-5px; vertical-align: middle; border-top: #111 2px solid; border-right: #111 2px solid; transform: rotate(-135deg);}
.tblView .bottom .btnPrev b::after{ content: ''; display: block; position: absolute ;top: 50%; right: 0; width: 1px; background-color: #cecece; margin-top: -5px; height: 10px;}
.tblView .bottom .btnPrev span{ flex: 1 1 auto; padding-left: 15px;}
.tblView .bottom .btnList { display:flex; flex:0 0 auto; width:300px; height:60px; margin:0 auto; font-size:18px; color:#111; font-weight:bold; text-align:center; justify-content: center; background:#fff; border: #cecece 1px solid; align-items: center;}
.tblView .bottom .btnNext { flex: 0 0 auto; width: calc(50% - 150px); font-size:14px; display:flex; align-items: center; text-align: right;}
.tblView .bottom .btnNext b{ position: relative; flex: 0 0 auto; width: 110px;}
.tblView .bottom .btnNext b::before{ content: ''; display: block; position: absolute ;top: 50%; left: 0; width: 1px; background-color: #cecece; margin-top: -5px; height: 10px;}
.tblView .bottom .btnNext b::after { content:''; display:inline-block; width:12px; height:12px; margin-left:20px; margin-top:-5px; vertical-align: middle; border-top: #111 2px solid; border-right: #111 2px solid; transform: rotate(45deg);}
.tblView .bottom .btnNext span{ flex: 1 1 auto; padding-right: 15px;}

.tblView .fileBox { padding:25px 0; border-bottom:1px solid #d9d9d9; display: flex;}
.tblView .fileBox .t-tx{ position: relative; width: 140px; text-align: center; font-size: 18px; color: #222; font-weight: 600;}
.tblView .fileBox .t-tx::after{ content: ''; width: 1px; height: 12px; position: absolute; top: 50%; right: 0; background-color: #d9d9d9; display: block; margin-top: -6px;}
.tblView .fileBox .c-tx{ padding: 0 40px; font-size: 14px;}
.tblView .fileBox .c-tx a + a{ margin-left: 65px;}

table.data{ border-top: #222 2px solid;}
table.data th{ padding: 25px 0 25px 70px; background-color: #f6f6f6; text-align: left; font-size: 18px; color: #222; font-weight: 500; border-bottom: #d9d9d9 1px solid;}
table.data td{ padding: 25px 40px; border-bottom: #d9d9d9 1px solid;}

/* 회사소개 */
.company-int{ padding: 110px 0 210px; background: url(../images/company_bg.jpg) 10% 100% no-repeat; }
.company-int .inbx{ display: flex; max-width: 1280px; margin: 0 auto;}
.company-int .tit{ width: 50%; font-size: 42px; color: #222; font-weight: 600;}
.company-int .tbx{ display: flex; flex-direction: column; font-size: 16px;}
.company-int .tbx b{ font-size: 32px; margin-bottom: 35px; font-weight: 400;}

.company-desc{ position: relative; border-top: #c4c4c4 1px solid; display: flex; justify-content: space-between;}
.company-desc .company-video{ position: relative; flex: 1; padding: 100px 0 0 0; display: flex; flex-direction: column; align-items: flex-end;}
.company-desc .company-video .tit-area{ width: 44vw; }
.company-desc .company-video .tit-area .tit{ font-size: 42px; color: #222; text-transform: uppercase; margin-bottom: 30px;}
.company-desc .company-video .mov-bx{ margin-top: auto; width: 100%;}
.company-desc .company-video .mov-bx .cover,
.company-desc .company-video .mov-bx .cover img,
.company-desc .company-video .mov-bx iframe{ height: 495px;}
.company-desc .company-book{ position: relative; width: 38vw; background: url(../images/company_bg2.jpg) 50% 50% no-repeat; background-size: cover; padding: 100px 0 100px 105px; }
.company-desc .company-book .tit-area{ color: #fff;}
.company-desc .company-book .tit{ font-size: 42px; margin-bottom: 20px;}
.company-desc .company-book .book-bx{ margin-top: 85px; width: 280px;}
.company-desc .company-book .book-bx .btz{ display: flex; width: 100%; margin-bottom: 15px;}
.company-desc .company-book .book-bx .btz a{ flex: 1; height: 45px; padding: 0 20px; display: flex; justify-content: space-between; align-items: center; border: #fff 2px solid; color: #fff; opacity: .75;}
.company-desc .company-book .book-bx .btz a + a{ margin-left: -2px;}
.company-desc .company-book .book-bx .btz a::after{ content: ''; width: 13px; height: 14px; background: url(../images/ic_down.png) 50% 50% no-repeat; }
.company-desc .company-book .book-bx .btz a:hover{ opacity: 1;}
.company-partner .img{ position: relative; height: 840px; background: url(../images/company_bg3.jpg) 50% 50% no-repeat; background-size: cover; }
.company-partner .img .copy{ position: relative; max-width: 1280px; margin: 0 auto; padding: 130px 0 0 0; color: #fff;}
.company-partner .img .copy b{ font-size: 42px; display: block;}
.company-partner .img .copy span{ display: block; font-size: 16px; color: rgba(255,255,255,.75); margin-top: 30px;}
.company-partner ul{ display: flex; justify-content: center; width: 1280px; margin: 0 auto;}
.company-partner ul > li{ padding: 140px 0; display: flex; align-items: center; flex: 1;}
.company-partner ul > li + li{ border-left: #c4c4c4 1px solid; padding-left: 120px;}
.company-partner ul > li .thumb{ width: 180px; margin-right: 50px;}
.company-partner ul > li .desc{ font-size: 16px; color: #323232; }
.company-partner ul > li .desc b{ color: #222; font-size: 20px; display: block; margin-bottom: 15px;}

.map-bx{ position: relative;}
.map-bx iframe{ display: block; width: 100%; height: 600px; filter: grayscale(100%); opacity: .5; transition:all 0.2s ease-in-out; }
.map-bx:hover iframe{ filter: grayscale(0); opacity: 1;}
.map-bx .addr{ position: absolute; background-color: rgba(255,255,255,.85); width: 1280px; display: flex; justify-content: center; left: 50%; bottom: 60px; padding: 25px; transform: translateX(-50%); z-index: 2; color: #000; font-size: 16px;}
.map-bx .addr b{ font-size: 18px; margin-right: 70px;}
.map-bx .addr p{ display: flex;}
.map-bx .addr p span{ position: relative;}
.map-bx .addr p span + span{ margin-left: 15px; padding-left: 15px;}
.map-bx .addr p span + span::before{ content: ''; position: absolute; width: 1px; height: 12px; background-color: #d5d5d5; display: block; top: 50%; left: 0; margin-top: -6px;}


/* 견적문의 */
.sub-tit{ display: flex; justify-content: space-between; align-items: center; border-bottom: #222 1px solid; padding-bottom: 50px; margin-bottom: 60px;}
.sub-tit .tit{ color: #111; font-size: 36px; font-weight: 600;}
.sub-tit .bt-detail{ color: #1d5499; font-size: 24px; font-weight: 600; display: flex; align-items: center;}
.sub-tit .bt-detail::after{ content: ''; width: 12px; height: 12px; border-top: #1d5499 2px solid; border-right: #1d5499 2px solid; transform: rotate(45deg); margin-left: 10px;}

.form-tit{ display: flex; justify-content: space-between; align-items: center; margin: 0 0 30px 0;}
.form-tit .tit{ font-size: 24px; color: #111; font-weight: 600;}
.form-tit .tit span{ font-size: 18px;}
.form-tit p{ color: #b9bcc2;}

.form-bx + .form-bx{ margin-top: 60px; border-top: #f5f5f5 1px solid; padding-top: 60px;}
.form-bx .row-bx{ display: flex;}
.form-bx .row-bx + .row-bx{ margin-top: 10px;}
.form-bx .row-bx .t-tx{ width: 150px; font-size: 16px; color: #333; font-weight: 600; display: flex; padding-top: 15px;}
.form-bx .row-bx .t-tx::before{ content: ''; width: 4px; height: 4px; background-color: #b2b2b2; border-radius: 50%; margin-right: 5px; margin-top: 10px; }
.form-bx .row-bx .t-tx em{ color: #999; font-size: 14px; }
.form-bx .row-bx .c-tx{ flex: 1; display: flex;}
.form-bx .row-bx .c-tx .inp + .inp{ margin-left: 10px;}
.form-bx .row-bx .c-tx.col{ flex-direction: column;}
.form-bx .inp,
.form-bx .select{ height: 58px; line-height: 58px;}
.form-bx .chk-bx{ display: flex; padding-bottom: 30px; margin-bottom: 30px; border-bottom: #a1a1a1 1px dotted;}
.form-bx .chk-bx label + label{ margin-left: 30px; }
.form-bx .c-tx-bx{ display: flex; align-items: center;}
.form-bx .c-tx-bx + .c-tx-bx{ display: flex; margin-top: 10px;}
.form-bx .c-tx-bx label{ width: 150px; }
.form-bx .c-tx-bx label span{ color: #999;}
.form-bx .select{ flex: 1; padding: 0 40px 0 20px;}
.form-bx .inp-bx{ position: relative;  flex: 1; display: flex; align-items: center; border: #d0d0d0 1px solid; margin-left: 10px; }
.form-bx .inp-bx .inp{ height: 56px; line-height: 56px; border: none; flex: 1;}
.form-bx .inp-bx span{ position: absolute; top:0; right:0; padding: 0 20px; line-height: 56px;}
.form-bx .s-tit{ color: #1d5499; font-size: 16px; margin: 10px 0; font-weight: 600; display: flex; align-items: center;}
.form-bx .s-tit label{ font-weight: 400; margin-left: 30px;}
.form-bx .col .inp-bx{ margin:0;}
.form-bx .col .inp-bx + .inp-bx{ margin-left:10px;}

.cls-lst{ display: flex; flex-wrap: wrap;}
.cls-lst li{ width: 30%;}
.cls-lst li + li{ margin-left: 5%;}
.cls-lst li label{ padding: 30px 20px; color: #999;}
.cls-lst li label input:checked + span{ color: #000;}
.cls-lst li:nth-child(3n+1){ margin-left: 0;}

.tbl-select{ margin-top: 30px; border-top: #0c2340 1px solid; display: flex; background-color: #f7f8f9; align-items: center;}
.tbl-select dt{ font-size: 14px; color: #0c2340; font-weight: 600; padding: 20px 0; width: 150px; text-align: center;}
.tbl-select dd{ position: relative; padding: 20px 50px; display: flex; flex: 1;}
.tbl-select dd::before{ content: ''; position: absolute; top: 50%; left: 0; width: 1px; height: 12px; margin-top: -6px; display: block; background-color: #818d9c;}
.tbl-select dd label{ color: #0c2340;}
.tbl-select dd label + label{ margin-left: 50px;}

.privacy-bx{ margin: 20px 0 0 0; background-color: #fafbfb; border: #e1e1e1 1px solid; padding: 25px;}
.privacy-bx h4{ margin: 25px 0 10px;}

.form-bx .ul-list01{ padding: 25px;}
.ul-list01 > li{ text-indent: -10px; padding-left: 10px; color: #a1a1a1;}
.ul-list01 > li + li{ margin-top: 10px;}
.ul-list01 > li::before{ content: ''; width: 4px; height: 4px; background-color: #a1a1a1; margin-right: 5px; display: inline-block; border-radius: 50%; vertical-align: 3px;}

.dv-chk{ border-top: #f5f5f5 1px solid; display: flex; justify-content: space-between; align-items: center; padding: 30px 0;}

.lay-pop{ position: fixed; display: none; width: 1080px; max-height: 100vh; overflow-y: auto; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); background-color: #fff; z-index: 999;}
.lay-pop > .close{ position:absolute; top: 40px; right: 40px; cursor:pointer; width: 40px; height: 40px;}
.lay-pop > .close span{ position: absolute; top: -9999px; left: -9999px;}
.lay-pop > .close::before{ content: ''; position: absolute; top: 50%; left: 50%; margin: 0 0 0 -15px; width: 30px; height: 1px; background-color: #000; display: block; transform: rotate(45deg);}
.lay-pop > .close::after{ content: ''; position: absolute; top: 50%; left: 50%; margin: 0 0 0 -15px; width: 30px; height: 1px; background-color: #000; display: block; transform: rotate(-45deg);}
.lay-pop .pop-tit{ padding: 40px 60px; border-bottom: #000 1px solid;}
.lay-pop .pop-tit .tit{ font-size: 30px; color: #000; line-height: 1.2;}
.lay-pop .pop-con{ padding: 60px; color: #777;}
.lay-pop .pop-con .tit{ font-size: 21px; color: #000; font-weight: 600; margin: 50px 0 10px; }
.lay-pop.sm{ max-width:600px; width:600px;}

table.view{ width: 100%; border-top: #000 1px solid; font-size: 14px; }
table.view thead th{ background-color: #fafafa; color: #000; border-left: #f5f5f5 1px solid; border-bottom: #e8e8e8 1px solid; text-align: center; padding: 8px 10px; line-height: 1.2; font-weight: 400;}
table.view tbody td{ color: #777; padding: 8px; text-align: center; border-left: #f5f5f5 1px solid; border-bottom: #f5f5f5 1px solid;}
table.view .brdLn{ border-left: none;}


@media screen and (max-width:1280px){
    
    #header > .inner{ padding: 0 2rem;}
    
    .lay-pop{ width: 100%; }
    .lay-pop .pop-tit{ padding: 2rem;}
    .lay-pop .pop-tit .tit{ font-size: 2rem;}
    .lay-pop > .close{ top: 1rem; right: 1rem;}
    .lay-pop .pop-con{ padding: 2rem;}
    .lay-pop .pop-con .tit{ font-size: 1.6rem; margin: 2rem 0 .5rem;}


    @media screen and (max-width:1024px){

        br.pc{ display: none;}

        #header > .inner{ height: 6rem;}
        #header h1.logo{ width: 7.7rem;}
        #header h1.logo a{ height: 3rem; background-size: 100% auto;}

        #siteFunctions{ top: 0; bottom: 0; right: 0; margin-right: 0; width: 100%; padding: 6rem 3rem 3rem;}
        #siteFunctions .bt-close{ right: 2rem;}
        .mobMenu > li > a{ padding: 1rem 0; font-size: 1.8rem;}
        .mobMenu > li > a::after{ width: 2rem; height: 2rem; margin-top: -1rem;}

        footer{ padding: 4rem 2.5rem; }
        footer .footer-wrap{ padding: 0;}
        footer .footer-wrap .logo img{ height: 3rem;}
        footer address{ font-size: 1.2rem;}
        footer .foot-bt{ position: relative; margin-top: 2rem;}

        #menu{ display: none;}

        #container{ padding: 0 0 5rem 0;}
        #contents{ padding: 10rem 2.5rem 0;}

        .mainVis .itm1 .copy,
        .mainVis .itm2 .copy,
        .mainVis .itm3 .copy{ max-width: 640px; width: 80%; background-size: 100% auto;}
        .mainVis .copy b{ font-size: 4rem;}
        .mainVis .copy span{ font-size: 1.5rem; margin-top: 1rem;}

        .main-tit{ margin-bottom: 3rem;}
        .main-tit .tit{ font-size: 3rem;}
        .main-tit p{ margin-top: 1.5rem;}

        #indexWrap .section .inbx{ padding: 4rem 2.5rem;}

        .main-productLst{ flex-direction: column;}
        .main-productLst .itm + .itm{ margin: 2rem 0 0 0;}

        .section02 .btz{ margin-top: 2rem;}
        .section02 .btz .bt{ font-size: 1.4rem; height: 4rem; padding: 0 2rem;}

        .pro-vis.company .bg{ height: 30rem;}
        .sub-vis .copy{ height: 30rem; width: 100%; left: 0; transform: translateX(0); padding: 0 2.5rem;}
        .sub-vis .copy b{ font-size: 3.6rem;}
        .sub-vis .copy span{ font-size: 1.3rem; margin-top: 1.5rem;}
        .pro-vis .bg{ height: 30rem;}

        .company-int{ padding: 5rem 2.5rem;}
        .company-int .inbx{ flex-direction: column;}
        .company-int .tit{ width: 100%; font-size: 3rem;}
        .company-int .tbx{ margin-top: 2rem; font-size: 1.3rem;}
        .company-int .tbx b{ font-size: 1.5rem; margin-bottom: 1.5rem;}

        .company-desc{ flex-direction: column;}
        .company-desc .company-video{ flex-direction: column; padding: 5rem 0 0 0;}
        .company-desc .company-video .tit-area{ width: 100%; padding: 0 2.5rem;}
        .company-desc .company-video .tit-area .tit{ font-size: 3rem; margin-bottom: 1.5rem;}
        .company-desc .company-video .mov-bx{ margin-top: 3rem;}
        .company-desc .company-video .mov-bx .cover, 
        .company-desc .company-video .mov-bx .cover img, 
        .company-desc .company-video .mov-bx iframe{ height: 20rem;}
        .mov-bx .cover .bt{ width: 6rem; height: 6rem; margin: -3rem 0 0 -3rem; background-size: cover;}
        .company-desc .company-book{ width: 100%; padding: 3rem 2.5rem;}
        .company-desc .company-book .tit{ font-size: 3rem;}
        .company-desc .company-book .book-bx{ margin: 3rem 0 0 0; width: 100%;}
        .company-desc .company-book .book-bx p{ text-align: center;}

        .company-partner .img{ height: 30rem;}
        .company-partner .img .copy{ padding: 5rem 2.5rem;}
        .company-partner .img .copy b{ font-size: 3rem;}
        .company-partner .img .copy span{ margin-top: 1.5rem;}
        .company-partner .img .copy span{ font-size: 1.3rem;}

        .company-partner ul{ width: 100%; flex-direction: column; padding: 0 2.5rem;}
        .company-partner ul > li{ padding: 2rem 0;}
        .company-partner ul > li .thumb{ width: 8rem; margin-right: 2rem;}
        .company-partner ul > li .desc{ font-size: 1.3rem;}
        .company-partner ul > li .desc b{ font-size: 1.8rem; margin-bottom: 1rem;}
        .company-partner ul > li + li{ border-top: #c4c4c4 1px solid; padding-left: 0; border-left: none;}

        .map-bx img{ width: 100%; height: 20rem; object-fit: cover; object-position: center; }
        .map-bx .addr{ width: 90%; font-size: 1.3rem; flex-direction: column; padding: 1.5rem;}
        .map-bx .addr b{ font-size: 1.3rem; margin-right: 0;}
        .map-bx .addr p{ flex-wrap: wrap;}
        .map-bx .addr p span:last-child{ margin-left: 0; padding-left: 0;}
        .map-bx .addr p span:last-child::before{ display: none;}

        .locationBar{ top: 30rem;}
        .locationBar.fixed{ top: 6rem;}
        .locationBar .inner .breadcrumb{ display: none;}
        .sub-mn{ width: 100%; padding: 0 2.5rem; }
        .sub-mn > li + li{ margin-left: 0;}
        .sub-mn > li a{ height: 6rem; line-height: 6rem; font-size: 1.5rem;}
        .sub0101 .locationBar, .sub0102 .locationBar{ transition: all 0s ease;}

        .pro-desc01{ padding: 9rem 2.5rem 3rem;}
        .h2-tit{ font-size: 3rem;}
        .pro-desc01 .desc{ font-size: 1.3rem;}
        .pro-desc01 .desc .txt{ margin-top: 2rem;}
        .pro-desc01 .desc .img{ margin-top: 2rem;}
        .pro-desc01 .thumb{ position: relative; width: 100%; top: auto; left: auto; margin: 3rem 0 0 0;}
        .pro-desc01 .thumb img{ height: auto;}

        .pro0102{ padding: 3rem 2.5rem;}
        .pro-hd{ flex-direction: column; margin: 0 auto 3rem;}
        .pro-hd .t-tx{ padding: 1rem 0 0 0; font-size: 2.4rem; width: 100%;}
        .pro-hd .t-tx br{ display: none;}
        .pro-hd .t-tx::before{ width: 4rem; height: .3rem;}
        .pro-hd .c-tx{ font-size: 1.3rem; margin-top: 2rem;}
        .pro0102-1{ padding: 3rem 2.5rem;}
        .pro-title{ margin: 0;}
        .pro-title .tit{ font-size: 2rem; margin-bottom: 1.5rem;}
        .pro-title p{ font-size: 1.3rem;}
        .pro-title p br{ display: none;}
        .pro-desc0201{ margin-top: 3rem;}
        .pro0103{ padding: 3rem 2.5rem;}
        .pro01-lst01{ flex-direction: column;}
        .pro01-lst01 dl + dl{ margin-top: 3rem;}
        .pro01-lst01 dl dt{ font-size: 1.3rem; line-height: 1.2; display: flex; flex-direction: column; justify-content: center; padding: 1rem 0;}
        .mov-bx .cover,
        .mov-bx iframe,
        .mov-bx .cover img{ height: 30rem;}

        .pro0202{ padding: 3rem 2.5rem;}
        .pro0202-1{ padding: 3rem 2.5rem;}
        .pro2-desc01{ margin-top: 3rem;}
        .pro2-desc01 .swiper-slide b{ font-size: 1.3rem;}

        .tbl-hd{ flex-direction: column; align-items: flex-start; margin-bottom: 1rem;}
        .tbl-hd .total{ order: 2; margin-top: 1rem;}
        .tbl-hd .tbl-sch{ order: 1;}
        .tbl-hd .tbl-sch .select{ width: 30%;}
        .tbl-hd .tbl-sch .sch-bx{ flex: 1;}
        .tbl-hd .tbl-sch .keyword{ width: 100%; padding: 0 0 0 1rem;}

        .thumb-list .itm,
        .thumb-list .itm:nth-child(3n+1){ width: 48%; margin: 2rem 0 0 4%;}
        .thumb-list .itm:nth-child(2n+1){ margin-left: 0;}
        .thumb-list .itm .name{ padding: 1rem 0 0 0; font-size: 1.3rem;}
		.tblView .fileBox{ padding:1rem 0;}
		.tblView .fileBox .t-tx{ font-size:1.4rem; width:8rem;}

		.tblView .top{ padding:2rem; flex-direction: column; align-items: flex-start;}
		.tblView .top .tit{ font-size:2rem; padding:0;}
		.tblView .contBox{ padding:2rem 0;}

		.tblView .bottom .btnPrev { font-size:1.4rem; width: calc(50% - 7.5rem);}
		.tblView .bottom .btnPrev b::before { width:1rem; height:1rem; margin-right:.6rem; margin-top:-3px;}
		.tblView .bottom .btnList { width:15rem; height:5rem; font-size:1.6rem;}
		.tblView .bottom .btnNext { font-size:1.4rem; width: calc(50% - 7.5rem);}
		.tblView .bottom .btnNext a::after { width:1rem; height:1rem; margin-left:.6rem; margin-top:-3px;}
		.tblView .bottom .btnPrev b,
		.tblView .bottom .btnNext b{ width: 100%;}
		.tblView .bottom .btnPrev b::after,
		.tblView .bottom .btnNext b::before,
		.tblView .bottom .btnPrev span,
		.tblView .bottom .btnNext span{ display: none;}

        div.paging{ margin-top: 3rem;}

        .sub-tit{ flex-direction: column; align-items: flex-start; margin-bottom: 1rem; padding-bottom: 2rem;}
        .sub-tit .tit{ font-size: 1.8rem;}
        .sub-tit .bt-detail{ font-size: 1.5rem;}
        .sub-tit .bt-detail::after{ width: 1rem; height: 1rem;}

        .form-tit{ flex-direction: column; align-items: flex-start; margin-bottom: 1.5rem;}
        .form-tit .tit{ font-size: 2rem;}
        .form-tit .tit span{ font-size: 1.3rem;}
        .form-bx .row-bx{ flex-direction: column;}
        .form-bx .row-bx .t-tx{ width: 100%; padding-top: 0; font-size: 1.5rem; margin-bottom: .5rem;}
        .form-bx .row-bx .t-tx span{ flex: 1;}
        .form-bx .row-bx .t-tx span br{ display: none;}
        .form-bx .row-bx .t-tx span em{ font-weight: 400; font-size: 1.3rem;}
        .form-bx .inp, 
        .form-bx .select{ height: 4rem; line-height: 4rem; padding: 0 1rem;}
        .form-bx + .form-bx{ margin-top: 2rem; padding-top: 2rem;}
        .form-bx .chk-bx{ padding-bottom: 1.5rem; margin-bottom: 1.5rem;}
        .form-bx .c-tx-bx label{ width: 40%; }
        .form-bx .c-tx-bx label + .inp{ flex: 1;}
        .form-bx .inp-bx{ width: 60%;  margin-left:.5rem;} 
        .form-bx .inp-bx .inp{ width: 100%; height: 3.8rem; line-height: 3.8rem;}
		.form-bx .inp-bx span{ padding:0 .5rem; line-height:38px;}
		.form-bx .col .c-tx-bx .inp-bx{ width:33.3%; margin:0;}
		.form-bx .col .c-tx-bx .inp-bx + .inp-bx{ margin-left:.5rem;}

        .cls-lst li label{ padding: 1rem 0; flex-direction: column;}

        .tbl-select{ flex-direction: column;}
        .tbl-select dt{ padding: 1rem; font-size: 1.4rem; width: 100%;}
        .tbl-select dd{ padding: 0 1rem 2rem; width: 100%;}
        .tbl-select dd::before{ display: none;}
        .tbl-select dd label + label{ margin-left: 0;}
        .tbl-select dd label{ flex-direction: column; flex: 1; text-align: center; font-size: 1.3rem;}

        .privacy-bx{ padding: 2rem; font-size: 1.3rem;}
        .privacy-bx h4{ margin: 2rem 0 .5rem;}

        .form-bx .ul-list01{ padding: 2rem 0;}

        .dv-chk{ padding: 2rem 0 0 0; flex-direction: column;}
        .dv-chk .btn{ margin-top: 2rem;}
        
        .cls-lst li label input + span{ font-size: 1.3rem; line-height: 1.2; text-align: center; margin-top: 1rem;}

		.lay-pop.sm{ width:90%;}
		.lay-pop .btn-box .btn{ flex:1;}

    }    
    
}