@charset "utf-8";
/* 당근고양이 'ㅅ' */

/* 초기화 */
@import url("default.css");
body {letter-spacing: -0.025em;}

.red {color:#f00 !important;}

/* 체크박스 */
	label.check {position:relative; display:block; padding-left:30px; cursor:pointer; line-height:24px;}
	label.check input {position:absolute; top:0; left:0; width:100%; height:100%; opacity:0;}
	label.check i {position:absolute; top:0; left:0; width:24px; aspect-ratio:1/1; background:#fff; border-radius:50%; transition:.2s linear;}
	label.check i:before {content:""; display:block; width:100%; height:100%; background:#fff; mask:url('/images/icon_check.png') no-repeat 50% 50%; -webki-tmask:url('/images/icon_check.png') no-repeat 50% 50%; transition:.2s linear;}
	label.check input:checked + i {background-color:#eee;}
	label.check input:checked + i:before {background:#000;}

/* header */
	.header26 {position:fixed; top:0; left:0; width:100%; z-index:100; transition:.2s linear;}
	.header26 .inner {position:relative; height:100px;}
	.header26 .logo {position:absolute; top:0; left:20px; line-height:100px; transition:none; background:#fff; mask:url('/images/logo.png') no-repeat 50% 50% / contain; -webkit-mask:url('/images/logo.png') no-repeat 50% 50% / contain;}
	.header26 .logo img {opacity:0;}
	.header26 h1 {font-size:0; width:0; height:0; overflow:hidden;}
	.header26 .gnb ul {display:flex; justify-content:center;}
	.header26 .gnb li {position:relative;}
	.header26 .gnb li > a {font-size:20px; color:#fff; font-weight:600; line-height:100px; padding:0 35px;}
	.header26 .contact {position:absolute; top:0; right:20px; height:100px; display:flex; align-items:center; gap:30px;}
	.header26 .contact .tel {position:relative; font-size:21px; color:#fff; font-weight:600; padding-left:28px; font-family:'Poppins';}
	/* .header26 .contact .tel:before {content:""; position:absolute; top:0; left:0; width:18px; height:100%; background:#fff; mask:url('/images/icon_tel.png') no-repeat 50% 50% / contain; -webkit-mask:url('/images/icon_tel.png') no-repeat 50% 50% / contain;} */
	.header26 .contact .btn_contact {font-size:17px; color:#fff; font-weight:700; line-height:48px; height:50px; padding:0 27px; background:#0f172a; border:#0f172a 1px solid; border-radius:25px; display:flex; align-items:center; gap:10px;} 
	/* .header26 .contact .btn_contact:after {content:""; display:block; width:21px; aspect-ratio:1/1; background:#fff; mask:url('/images/icon_contact.png') no-repeat 50% 50% / contain; -webkit-mask:url('/images/icon_contact.png') no-repeat 50% 50% / contain; transition:.2s linear;} */
	.header26 .contact .tel{position:relative; font-size:21px; color:#fff; font-weight:600; display:flex; align-items:center; gap:8px; font-family:'Poppins';}
	.header26 .contact .tel .material-symbols-outlined{font-size:22px;}

	.header26 .contact .btn_contact{font-size:17px; color:#fff; font-weight:700; line-height:48px; height:50px; padding:0 27px; background:#0f172a; border:#0f172a 1px solid; border-radius:25px; display:flex; align-items:center; gap:10px;}
	.header26 .contact .btn_contact .material-symbols-outlined{font-size:20px;}	

	.header26.fixed,
	.header26.white {background:#fff;}
	.header26.fixed {box-shadow:rgba(0,0,0,.1) 0 0 10px;} 
	.header26.fixed .logo,
	.header26.white .logo {background:none; mask:none; -webkit-mask:none;}
	.header26.fixed .logo img,
	.header26.white .logo img {opacity:1;}
	.header26.fixed .gnb li > a,
	.header26.white .gnb li > a {color:#222;}
	.header26.fixed .contact .tel,
	.header26.white .contact .tel {color:#0f172a;}
	.header26.fixed .contact .tel:before,
	.header26.white .contact .tel:before {background:#0f172a;}
/* footer */
	.footer26 {background:#222;}
	.footer26 .copy_txt {position:relative; padding:100px 0; display:flex; justify-content:space-between;}
	.footer26 .copy_txt .txt strong {display:block; font-size:34px; color:#fff; font-weight:700; line-height:46px;}
	.footer26 .copy_txt .txt p {font-size:20px; color:#1d6dff; font-weight:600; margin-top:15px;font-family:'Poppins';}
	.footer26 .copy_txt .btns {display:flex; flex-direction:column; gap:6px;}
	.footer26 .copy_txt .btns a {position:relative; font-size:16px; color:#fff; font-weight:500; line-height:48px; height:50px; width:190px; border:#666 1px solid; padding:0 12px;     border-radius: 10px;}
	.footer26 .copy_txt .btns a{display:flex; align-items:center; gap:8px;}
	.footer26 .copy_txt .btns a{position:relative;}
	.footer26 .copy_txt .btns a .icon{position:absolute; top:50%; right:18px; transform:translateY(-50%); font-size:21px; color:#fff;}
	.footer26 .copy_txt .btns a:hover .icon{color:#222;}

	.footer26 .copyright {border-top:#323232 1px solid; padding:50px 0; font-size:15px;}
	.footer26 .copyright .name {color:#fff; font-weight:500; margin-bottom:10px;}
	.footer26 .copyright ul {display:flex; flex-wrap:wrap; gap:15px 30px;}
	.footer26 .copyright li {color:#a0a0a0; }
	.footer26 .copyright .copy {width:100%; color:#777;}
	.footer26 .copyright span {font-weight:600;}
	
	.fixed_bar{display:none;}

.btn_top{position:fixed; right:clamp(12px,2.2vw,24px); bottom:calc(clamp(12px,2.2vw,24px) + env(safe-area-inset-bottom)); width:clamp(40px,4.2vw,52px); height:clamp(40px,4.2vw,52px); border:1px solid rgba(0,0,0,.08); background:rgba(255,255,255,.92); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border-radius:999px; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 25px rgba(0,0,0,.12); opacity:0; visibility:hidden; transform:translateY(10px); transition:opacity .2s ease, transform .2s ease, visibility .2s ease; z-index:9999; cursor:pointer;}
.btn_top .material-symbols-outlined{font-size:clamp(20px,2.2vw,24px); line-height:1;}
.btn_top.is_show{opacity:1; visibility:visible; transform:translateY(0);}
.btn_top:active{transform:translateY(1px);}

/* main */
	.mcon {font-size:14px; color:#222;}
	.mtit {margin-bottom:80px;}
	.mtit span {display:block; font-size:18px; color:#1d6dff; font-weight:700; line-height:1; font-family:'Poppins';}
	.mtit .tt {font-size:38px; color:#222; font-weight:700; line-height:53px; margin-top:20px;}
	.mtit .tt strong {color:#1d6dff;}

	.mc00 {padding:20px 0 100px; margin-top:100px;}
	.mc00 .inner {display:flex; gap:44px;}
	.mc00 .main_visual {position:relative; width:calc(100% - 384px); background:#000 no-repeat 50% 50% / cover; border-radius:10px;}
	.mc00 .main_visual strong {position:absolute; top:50%; left:0; width:100%; padding:0 85px; font-size:36px; color:#fff; font-weight:500; line-height:48px; transform:translateY(-50%);}
	.mc00 .main_visual b { font-weight:700; }
	
.mc00 .main_visual{position:relative;overflow:hidden}
.mc00 .main_visual .bg_video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}
.mc00 .main_visual strong{position:absolute;z-index:2}	
	
	.mc00 .main_contact {width:340px; background:#1d6dff; padding:20px; border-radius:10px;}
	.mc00 .main_contact .tit {font-size:18px; color:#fff; font-weight:600; line-height:48px; background:#1055d4; border-radius:6px; margin-bottom:14px; text-align:center;}
	.mc00 .main_contact dl {position:relative; display:flex; background:#fff; border-radius:6px; font-size:16px; line-height:48px; overflow:hidden;}
	.mc00 .main_contact dl + dl {margin-top:10px;}
	.mc00 .main_contact dt {width:90px; padding-left:18px; font-weight:600;}
	.mc00 .main_contact dd {width:calc(100% - 90px); } 
	.mc00 .main_contact dd .text {border:0; width:100%;}
	.mc00 .main_contact dd .text::placeholder {color:#b9b9b9; letter-spacing:-1px;}
	.mc00 .main_contact dd input.text {height:48px;}
	.mc00 .main_contact dd textarea.text {padding-top:15px; height:140px;}
	.mc00 .main_contact .terms_area {display:flex; justify-content:space-between; align-items:center; padding:17px 0;}
	.mc00 .main_contact .terms_area label.check {color:#fff;}
	.mc00 .main_contact .terms_area .btn_agree {font-size:13px; color:#fff; line-height:17px; border-bottom:#fff 1px solid;}

.mc00 .main_contact .terms_area label.check input{position:absolute; opacity:0;}
.mc00 .main_contact .terms_area label.check i{background:transparent; border:2px solid rgba(255,255,255,.9); border-radius:4px; box-shadow:none; transition:background .2s ease, border-color .2s ease, box-shadow .2s ease, transform .15s ease;}
.mc00 .main_contact .terms_area label.check input:checked + i{background:#fff; border-color:#fff; box-shadow:0 0 0 4px rgba(255,255,255,.28), 0 6px 14px rgba(0,0,0,.18); transform:scale(1.04);}
.mc00 .main_contact .terms_area label.check input:checked + i:after{content:""; position:absolute; left:50%; top:50%; width:7px; height:12px; border-right:3px solid #1d6dff; border-bottom:3px solid #1d6dff; transform:translate(-50%,-58%) rotate(45deg);}
	
	.mc00 .main_contact .btn_submit {display:flex; justify-content:center; align-items:center; gap:20px; background:#fff; font-size:18px; color:#1d6dff; font-weight:700; line-height:46px; border-radius:6px; width:100%; border:#1d6dff 1px solid;}
	.mc00 .main_contact .btn_submit:after {content:""; display:block; width:16px; height:12px; background:#1d6dff; mask:url('/images/arrow_submit.png') no-repeat 50% 50%; -webkit-mask:url('/images/arrow_submit.png') no-repeat 50% 50%;}
	.mc00 .main_contact ul.contact {margin-top:13px; font-family:'Poppins';}
	.mc00 .main_contact ul.contact li {position:relative; font-size:14px; color:#fff; font-weight:500; line-height:32px; padding-left:40px;}
	.mc00 .main_contact ul.contact li + li {margin-top:10px;}
	.mc00 .main_contact ul.contact li:before {content:""; position:absolute; top:0; left:0; width:32px; aspect-ratio:1/1; background:#1055d4 no-repeat 50% 50%; border-radius:50%;}
	.mc00 .main_contact ul.contact .i1:before {background-image:url('/images/icon_contact01.png');}
	.mc00 .main_contact ul.contact .i2:before {background-image:url('/images/icon_contact02.png');}

	.copy_mail {cursor:pointer; transition:.2s ease;}
	.copy_mail:hover {color:#1d6dff;}
	.copy_mail:active {transform:scale(.96);}
	.copy_toast {position:fixed; bottom:40px; left:50%; transform:translateX(-50%); background:#111; color:#fff; padding:12px 20px; font-size:14px; border-radius:30px; opacity:0; pointer-events:none; transition:.3s;}
	.copy_toast.on {opacity:1;}

	.terms_popup{position:fixed; inset:0; background:rgba(0,0,0,.55); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:opacity .3s ease; z-index:9999;}
	.terms_popup.on{opacity:1; visibility:visible;}
	.terms_box{width:min(600px,90%); background:#fff; padding:20px; box-shadow:0 30px 60px rgba(0,0,0,.2);     border-radius: 10px;}
	.terms_head{display:flex; justify-content:space-between; align-items:center; margin-bottom:25px;}
	.terms_head strong{font-size:20px; font-weight:700;}
	.terms_close{background:none; border:0; font-size:20px; cursor:pointer;}
	.terms_body{max-height:400px; overflow:auto; font-size:15px; line-height:1.7; color:#555;}

	.portfolio_list ul {display:flex; flex-wrap:wrap; gap:40px;}
	.portfolio_list li {width:calc((100% - 80px)/3);}
	.portfolio_list li .thumb {position:relative; width:100%; aspect-ratio:505/428; overflow:hidden; border-radius:10px; background:#000;}
	.portfolio_list li .thumb img {width:100%; height:100%; object-fit:cover; display:block; /* transition:.25s; */}
	.portfolio_list li .thumb::before {content:""; position:absolute; inset:0; background:rgba(0,0,0,.6); opacity:0; transition:.3s; z-index:1;}
	.portfolio_list li .hover {position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; justify-content:center; align-items:center; opacity:0; /* transition:.3s; */ }
	.portfolio_list li:hover .thumb::before {opacity:1;}
	.portfolio_list li:hover .hover {opacity:1;}



	.portfolio_list li .txt {padding:16px 0px 6px;}
	.portfolio_list li .cate {font-size:16px; color:#8f8f8f; }
	.portfolio_list li .name {font-size:22px; color:#222; font-weight:600; margin-top:2px;}

	.portfolio_list li .hover .tit {text-align:center;}
	.portfolio_list li .hover .tit strong {display:block; font-size:24px; color:#fff; font-weight:600; line-height:1.2; word-break:break-word;}

	.portfolio_list li .hover .btns {display:flex; justify-content:center; gap:10px; margin-top:26px;}
	.portfolio_list li .hover .btns a {width:68px; aspect-ratio:1/1; border-radius:50%; background:#fff; font-size:0; /* transition:.25s; */ pointer-events:auto;}
	.portfolio_list li .hover .btns a:before {content:""; display:block; width:100%; height:100%; background:#787878; mask:no-repeat 50% 50%; -webkit-mask:no-repeat 50% 50%;}
	.portfolio_list li .hover .btns .i1:before {mask-image:url('/images/icon_search.png'); -webkit-mask-image:url('/images/icon_search.png');}
	.portfolio_list li .hover .btns .i2 {background:#1055d4;}
	.portfolio_list li .hover .btns .i2:before {background:#fff; mask-image:url('/images/icon_home.png'); -webkit-mask-image:url('/images/icon_home.png');}
	.portfolio_list li .hover .btns .i1:hover {background:#1055d4;}
	.portfolio_list li .hover .btns .i1:hover:before {background:#fff;}
	.portfolio_list li .hover .btns .i2:hover {background:#083c9f;}

	.portfolio_list .more {display:block; font-size:17px; color:#adadad; line-height:1; width:100px; margin:100px auto 100px; text-align:center; transition:.25s ease;}
	.portfolio_list .more:before {content:""; display:block; width:46px; aspect-ratio:1/1; background:url('/images/btn_plus.png') no-repeat 50% 50% / contain; margin:0 auto 18px; transition:transform .45s cubic-bezier(.2,.8,.2,1),filter .25s ease;}
	.portfolio_list .more:hover {color:#fff;}
	.portfolio_list .more:hover:before {transform:rotate(180deg) scale(1.06); filter:drop-shadow(0 10px 18px rgba(0,0,0,.35));}

	/* .aboutbox {background:url('/images/bg_mc02.jpg') no-repeat 50% 50% / cover; padding:180px 0; margin-top:160px;} */
.aboutbox{position:relative; padding:180px 0;  overflow:hidden;}
.aboutbox::before{content:""; position:absolute; inset:0; background:rgba(0,0,0,0.6); backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(4px); z-index:1;}
.aboutbox .bg-video{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; z-index:0;}
.aboutbox .inner{position:relative; z-index:2;}
.aboutbox .mtit .tt{color:#fff;}
.aboutbox ul{display:flex; margin-top:100px;}
.aboutbox li{width:25%; text-align:center;}
.aboutbox li + li{border-left:#ffffff26 1px solid;}
.aboutbox li:before{content:""; display:block; width:100%; height:89px; margin-bottom:44px; background:no-repeat 50% 50% / contain;}
.aboutbox li strong{position:relative; display:inline-block; font-size:40px; color:#fff; font-family:'Poppins'; z-index:1;}
.aboutbox li strong:before{content:""; position:absolute; left:-6px; right:-6px; bottom:10px; height:20px; background:#1d6dff; z-index:-1;}
.aboutbox li p{font-size:20px; color:#fff; font-weight:500; margin-top:14px;}
.aboutbox li.i1:before{background-image:url('/images/icon_mc02_01.png');}
.aboutbox li.i2:before{background-image:url('/images/icon_mc02_02.png');}
.aboutbox li.i3:before{background-image:url('/images/icon_mc02_03.png');}
.aboutbox li.i4:before{background-image:url('/images/icon_mc02_04.png');}

/* sub */
	.container.pt {padding-top:190px;}
	.container.pb {/* padding-bottom:150px; */}
	.stit {margin-bottom:50px; text-align:center; line-height:1;}
	.stit strong {display:block; font-size:55px; color:#222; font-family:'Poppins';}
	.stit p {font-size:20px; color:#8b8b8b; margin-top:20px;}
	.ctit {margin-bottom:70px; text-align:center; line-height:1;}
	.ctit p {font-size:18px; color:#1d6dff; font-weight:700; margin-bottom:25px; font-family:'Poppins';}
	.ctit strong {display:block; font-size:48px; color:#222;}
/* 회사소개 */
	.about01 {height:100vh; background:url('/images/bg_about01_n.jpg') no-repeat 50% 50% / cover;}
	.about01 .inner {position:relative; height:100%; display:flex; flex-direction:column; justify-content:center; color:#fff;}
	.about01 strong {font-size:45px; line-height:59px;}
	.about01 p {font-size:19px; line-height:34px; margin-top:20px;}
	
.about02{padding:100px 0; background:#f7f8fb;}
.about02 ul{display:grid; gap:32px 26px; grid-template-columns:repeat(5,calc((100% - 104px) / 5)); grid-template-rows:repeat(2,220px);}
.about02 li{background:#fff; border:#e8edf3 1px solid; border-radius:12px; padding:34px 28px 24px; text-align:center; transition:.25s ease; box-shadow:0 4px 18px rgba(0,0,0,.03);}
.about02 li:hover{transform:translateY(-4px); box-shadow:0 10px 28px rgba(0,0,0,.06);}
.about02 li .icon{display:block; font-size:22px; color:#d3d3d3; margin-bottom:18px;}
.about02 li strong{display:block; font-size:22px; color:#222; line-height:1; margin-bottom:16px;}
.about02 li p{font-size:16px; color:#777; line-height:24px; display:flex; justify-content:center; align-items:center; height:72px;}
	
	.about03 {margin-top:0 !important;}
	.about04 {padding-top:80px;}
	.about04 .jq_tab {display:flex; justify-content:center; gap:24px; margin-bottom:50px;}
	.about04 .jq_tab button {display:block; font-size:18px; color:#8f8f8f; font-weight:500; line-height:68px; height:70px; width:180px; text-align:center; border:#dfdfdf 1px solid; border-radius:10px;}
	.about04 .jq_tab .on button {color:#fff; background:#1d6dff; border-color:#1d6dff;}
	.about04 .cont {position:relative; padding:45px 0 160px;}
	.about04 .cont:before {content:""; position:absolute; top:0; left:50%; width:1px; height:100%; background:#d7d7d7;}
	.about04 dl {padding-left:calc(50% + 100px);}
	.about04 dt {position:relative; font-size:35px; color:#1d6dff; font-weight:700; line-height:30px; font-family:'Poppins'; margin-bottom:30px;}
	.about04 dt:before,
	.about04 dt:after {content:""; position:absolute; top:50%; transform:translateY(-50%);}
	.about04 dt:before {left:-100px; width:62px; height:1px; background:#d7d7d7;}
	.about04 dt:after {left:-109px; width:18px; height:18px; background:#1d6dff; border:#abc9ff 5px solid; border-radius:50%;}
	.about04 dd p {font-size:18px; color:#8f8f8f; line-height:34px;}
	.about04 dl + dl {margin-top:90px;}
	.about04 dl:nth-child(2n) {padding-left:0; padding-right:calc(50% + 100px); text-align:right;}
	.about04 dl:nth-child(2n) dt:before {left:auto; right:-100px;}
	.about04 dl:nth-child(2n) dt:after {left:auto; right:-109px;}
	.about05 {padding:110px 0; background:#f0f4f8;}
	.about05 .flex {gap:75px; align-items:center;}
	.about05 .map_area {width:50%; border-radius:20px; overflow:hidden;}
	.root_daum_roughmap {max-width:100%;}
	.about05 .map_txt {width:calc(50% - 75px);}
	.about05 .tit {position:relative; font-size:35px; color:#222; font-weight:700; line-height:50px; padding-bottom:25px; margin-bottom:40px; border-bottom:#dedede 1px solid;}
	.about05 .tit .sns {position:absolute; top:0; right:0; display:flex; gap:10px;}
	.about05 .tit .sns a {width:50px; aspect-ratio:1/1; border-radius:5px; background:no-repeat 50% 50% / cover; font-size:0;}
	.about05 .tit .sns .kakao {background-image:url('/images/icon_kakao.jpg');}
	.about05 .tit .sns .naver {background-image:url('/images/icon_naver.jpg');}
	.about05 .address {display:flex; flex-wrap:wrap; gap:16px 60px;}
	.about05 .address li {position:relative; padding:5px 0 5px 50px; line-height:30px; font-size:18px; display:flex; gap:10px;}
	.about05 .address li:before {content:""; position:absolute; top:0; left:0; width:40px; height:40px; background:#fff no-repeat 50% 50% / contain; border-radius:50%;}
	.about05 .address li strong {color:#222;}
	.about05 .address li p {color:#777;}
	.about05 .address li.i1:before {background-image:url('/images/icon_about05_01.png');}
	.about05 .address li.i2:before {background-image:url('/images/icon_about05_02.png');}
	.about05 .address li.i3:before {background-image:url('/images/icon_about05_03.png');}
	.about05 .address li.i4:before {background-image:url('/images/icon_about05_04.png');}

	.jq_tabonoff .jq_cont .cont{display:none;}

/* 포트폴리오 */
	.view_tit {position:relative; height:100vh;}
	.view_tit img {width:100%; height:100%; object-fit:cover;}
	.view_tit .txt {position:absolute; top:50%; left:0; width:100%; transform:translateY(-50%); display:flex; flex-direction:column; justify-content:center; align-items:center; color:#fff; text-align:center; line-height:1;}
	.view_tit .tit p {font-size:17px; font-weight:300; font-family:'Poppins'; margin-bottom:15px;}
	.view_tit .tit .tt1 {font-size:45px; font-weight:600;}
	.view_tit .tit .tt2 {font-size:32px; font-weight:600;}
	.view_tit .engname {font-size:80px;  font-weight:700; margin-top:5px;}
	.view_tit .btn_outlink{display:inline-flex; justify-content:center; align-items:center; gap:15px; font-size:17px; line-height:60px; height:62px; backdrop-filter: blur(4px); border:#ffffff59 1px solid; border-radius:31px; padding:0 20px; margin-top:40px; color:#fff; transition:background .3s ease, color .3s ease, border-color .3s ease;}
	.view_tit .btn_outlink:after{content:""; display:block; width:40px; height:40px; background-color:#fff; background-image:url('/images/arrow_outlink.png'); background-repeat:no-repeat; background-position:50% 50%; border-radius:50%; transition:background-color .3s ease;}
	.view_tit .btn_outlink:hover{background:#fff; color:#1d6dff; border-color:#fff;}

	.bg_black {background:#222;}
	.portfolio_view03 {padding:100px 0 80px;}
	.portfolio_view03 img  {    padding: 0 70px;}
	.portfolio_view04 {padding-bottom:180px;}
	.portfolio_view04 .masonry {display:flex; gap:60px 20px; padding:0 40px; text-align:center;}
	.portfolio_view04 .masonry .col {width:calc(50% - 10px); padding:0; margin:0; list-style:none; display:flex; flex-direction:column; gap:60px;}
	.portfolio_view04 .masonry .col img {max-width:682px;}
	.page_remot {background:#fff;}
	.page_remot .inner {position:relative; height:180px;}
	.page_remot .btn_list {position:relative; width:auto; height:inherit; aspect-ratio:1/1; margin:0 auto; display:flex; justify-content:center; align-items:center; font-size:0;}
	.page_remot .btn_list span {position:relative; width:28px; height:3px; background:#222;}
	.page_remot .btn_list span:before,
	.page_remot .btn_list span:after {content:""; position:absolute; left:0; width:100%; height:100%; background:inherit;}
	.page_remot .btn_list span:before {top:-12px;}
	.page_remot .btn_list span:after {bottom:-12px;}
	.page_remot .btn_arrow {position:absolute; top:0; font-size:18px; color:#777; line-height:180px;}
	.page_remot .btn_arrow:before {content:""; position:absolute; top:0; width:21px; height:100%; background:url('/images/arrow_page.png') no-repeat 50% 50% / contain;}
	.page_remot .btn_prev {left:20px; padding-left:36px;}
	.page_remot .btn_prev:before {left:0;}
	.page_remot .btn_next {right:20px; padding-right:36px;}
	.page_remot .btn_next:before {right:0; transform:scale(-1);}

input,select,textarea,button {font-family:inherit; vertical-align:middle; box-sizing:border-box; outline:0;}
input,
select,
textarea {border:#ddd 1px solid; outline:0; background-color:#fff; transition:.2s linear; border-radius:5px;}
input,
select {height:30px; padding:0 10px;}
textarea {padding:10px;}

.title {font-size:30px; color:#000; font-weight:600; line-height:40px; margin-bottom:40px;  padding-bottom:40px;}
.title p {font-size:17px; color:#777; font-weight:500; line-height:1.5em; margin-top:-20px;}

.stit {position:relative; text-align:left;  font-size:24px; color:#333; font-weight:500; line-height:30px; margin-top:40px; }
.stit span {font-size:16px; font-weight:300;}
.stit span em {display:inline-block; color:#e60000; vertical-align:top;}


label.radio {position:relative; float:left; display:block; height:20px; line-height:20px; padding-left:30px; font-size:16px; color:#777; font-weight:500; margin-right:20px;}
label.radio input {display:none;}
label.radio .icon {position:absolute; top:0; left:0; width:18px; height:18px; border:#ddd 1px solid; border-radius:50%;}
label.radio .icon:before {content:""; position:absolute; top:50%; left:50%; width:0; height:0; background:#666; border-radius:50%; transition:.2s linear;}
label.radio input:checked + .icon:before {width:8px; height:8px; margin:-4px 0 0 -4px;}

label.check {position:relative; display:inline-block; height:20px; line-height:23px; padding-left:30px; font-size:15px; color:#777; font-weight:500;}
label.check input {display:none;}
label.check .icon {position:absolute; top:0; left:0; width:20px; height:20px; border:#777 1px solid;}
label.check .icon:before {content:""; position:absolute; top:50%; left:50%; width:0; height:0; background:#777; transition:.2s linear;}
label.check input:checked + .icon:before {width:8px; height:8px; margin:-4px 0 0 -4px;}

.form_box {margin-top:40px; padding-bottom: 50px; }
.form_box th,
.form_box td {padding:10px 0;}
.form_box th {font-size:17px; padding-left: 10px; color:#222; line-height:43px;    font-weight:500; text-align: left;}
.form_box th em {display:inline-block; color:#e60000; vertical-align:top; margin-left:5px;}
.form_box td {overflow:hidden;}
.form_box table.form input[type="text"] {background:#fafafa; border:#eee 1px solid; height:45px; line-height:43px; width:100%; font-size:15px; padding:0 5px;}

.file {position:relative; overflow:hidden;}
.filebox {float:left; width:350px; height:50px; padding:0 4px; overflow:hidden; border:1px solid #ddd; color:#666; font-size:15px; white-space:nowrap; line-height:48px; box-sizing:border-box;}
.filebutton {position:relative; float:left; width:110px; height:50px; overflow:hidden; cursor:pointer;}
.filebutton span {display:block; width:110px; height:50px; *height:48px; font-size:16px; color:#fff; font-weight:500; background:#898989; line-height:50px; text-align:center;}
.filebutton input {z-index:99; position:absolute; top:0; left:-350px; width:460px; height:50px; margin:0; padding:0; font-size:50px; line-height:0; opacity:0; filter:alpha(opacity = 0); -ms-filter:"alpha(opacity=0)"; cursor:pointer; _cursor:hand;}

.agree {margin-top:36px;}
.agree .btn_agree {display:inline-block; width:80px; height:26px; line-height:26px; text-align:center; font-size:14px; color:#0f172a; font-weight:500; border:#0f172a 1px solid; border-radius:2px; vertical-align:top;}
.agree label.check {margin:4px 10px 4px 0;}

.pop_agree {position:fixed; top:0; left:0; width:100%; height:100%; z-index:100; display:none;}
.pop_agree .black {position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:.2; filter:alpha(opacity=20);}
.pop_agree .inbox {position:absolute; top:50%; left:50%; width:800px; height:300px; margin:-150px 0 0 -400px; background:#fff; border:#ddd 1px solid; box-sizing:border-box; padding:20px; overflow:auto;}
.pop_agree .btn_close {position:absolute; top:50%; left:50%; width:40px; height:40px; margin:-190px 0 0 400px; cursor:pointer;}

.btn_apply {margin:70px 0; position:relative;  display:flex; flex-direction:column; justify-content:center;  gap:12px; margin-top:35px; width:100%;}
.btn_apply a,.btn_apply input[type="submit"] {position:relative; font-size:20px; font-weight:700; height:68px; line-height:68px; padding:0 40px; border-radius:10px; color:#fff; background:#0f172a; border:#0f172a 1px solid; }
.form_box .btns {margin:70px 0;position:relative;  display:flex; flex-direction:column; justify-content:center;  gap:12px; width:100%;}
.form_box .btns .btn {display:block; margin:0 auto;  width: 220px;  font-size:20px; font-weight:700; height: 68px; line-height:68px; padding:0 40px; border-radius:10px; color:#fff; background:#0f172a; border:#0f172a 1px solid; }
.form_box .btns .btn:hover{background:#fff; color:#0f172a;}

.tbl_tab{display:flex;justify-content:center;gap:24px;margin-bottom:50px;border:0}
.tbl_tab li{float:none;width:300px;height:70px;line-height:68px;border:1px solid #dfdfdf;border-radius:10px;font-size:18px;color:#8f8f8f;font-weight:500;text-align:center;cursor:pointer;box-sizing:border-box}
.tbl_tab li a{display:block;width:100%;height:100%;line-height:68px;font-size:18px;color:#8f8f8f;font-weight:500}
.tbl_tab li.on{background:#0f172a;border-color:#0f172a}
.tbl_tab li.on a{color:#fff}


#online_form #btn_submit {     font-size: 20px;    font-weight: 700;    height: 68px;    line-height: 68px;    padding: 0 40px;    border-radius: 10px;
    color: #fff;    background: #0f172a;      width: 220px;   display:block; margin:40px auto;}
#online_form #btn_submit:hover{background:#fff; color:#0f172a; border-color: #0f172a}