/*
 * @Common Sub-Page
 * @Date : 2017-08-24
*/

/* Right banner Hidden */
#bodywrap{
	width: 100%;
	max-width: 1240px;
	margin: 0px auto;
	display: table;
}
#hkcontent {
	margin-left:300px;
	padding: 0;
	margin-top: 21px;
	float: initial;
	width: -webkit-fill-available;
}
#side{
	float: left;
}
#right_banner {display:none}

/* CB Reset */
.cb-wrap {overflow: hidden; float: right; width: 842px; margin: 0; padding: 0}
.cb-wrap * {box-sizing: content-box}
ul, ol, dl {list-style: none; margin: 0; padding: 0}

/* Content */
.content-title {display:block; /*height:40px;*/ height:30px; margin-top:45px; margin-bottom:20px; /*border-bottom:2px solid #1b1b1b*/ border-bottom:1px solid #333}
.content-title h3 {margin:0; /*font-size :28px;*/ font-size :20px; font-weight:600; color:#222; line-height:28px}
.contents-wrap {font-size: 13px; line-height: 1.52}
.contents-wrap .intro {position:relative; background-color:#fbfbfb; border:4px solid #00adbb; text-align: center}
.contents-wrap .intro-box {padding: 30px 0;}
.contents-wrap .intro-subtitle {padding-bottom: 14px; font-size: 18px; color:#222; font-weight: 400; line-height:18px; letter-spacing: 0}
.contents-wrap .intro-title {padding-bottom: 30px; font-size :34px; color:#00adbb; font-weight: 600; line-height:34px; letter-spacing: 0}
.contents-wrap .intro-subscript {width: 550px; margin: auto; padding-bottom: 20px; font-size: 13px; color: #666; line-height: 24px; letter-spacing: 0; word-break: keep-all;}
.contents-wrap .intro-call {margin-bottom: 30px; font-size: 13px; color:#666; line-height:13px; letter-spacing: 0}
.contents-wrap .wrap-title {width:100%; padding-bottom:16px; margin-top:60px; margin-bottom:16px; border-bottom:1px solid #e9e9e9; font-size: 20px; font-weight:600; color:#222; line-height:20px; letter-spacing: 0}
.contents-wrap .wrap-subtitle {padding-bottom:8px; font-size: 16px; line-height: 30px; color:#222}
.contents-wrap .wrap-subscript {word-break:keep-all; font-size: 13px; color:#666; line-height:24px}
.contents-wrap .intro-box .btns {min-width: 110px; padding: 7px 29px; font-size: 16px; font-weight: 600; line-height: 24px;}

/*welcome*/
.contents-wrap .wrap-welcome {width: 840px; margin: 50px 0; padding: 30px 0; background-color: #fbfbfb; border: 1px solid #efefef; text-align: center}
.contents-wrap .welcome-text {font-size: 14px; padding-bottom: 15px}
.contents-wrap .wrap-welcome .btns {padding: 8px 38px; font-size: 16px; font-weight: 600}

/*header*/
#header {margin: 0}
#header .header-container {position: relative; width: 1140px; margin: 0 auto}
#header .header-container::after {content:""; display:block; clear:both;}
#header .header-mobile {display: none;}
#header .header-top {overflow: hidden; height: 73px}
#header .header-top .brand-logo {float: left; margin-top: 22px; margin-left:17px;}
#header .header-top .brand-ad {float: right; margin-top: 16px;}

#header .header-nav {position: relative; padding-bottom: 20px; background-color: #1b1b1b;}
#header .header-nav .gnb-menu {float: left; height: 57px;}
#header .header-nav .gnb-list {float: left;}
#header .header-nav .gnb-title {display: block; margin: 0; padding: 17px 12px; color: lightgray; font-size: 13.5px; font-weight: 400; line-height: 20px; border-top: 3px solid transparent; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; box-shadow: none;}
#header .header-nav .gnb-title:hover {text-decoration: none}
#header .header-nav .gnb-itembox {display: none; position: absolute; top: 57px; z-index: 9999; min-width: 250px; padding: 8px; border: none; border-bottom: 2px solid #00adbb; color: rgba(27,27,27,0.8); background: #fff; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
#header .header-nav .gnb-items a {display: block; height: 37px; padding: 0px 0 0 15px; line-height: 37px; font-size: 12px; font-weight: 400; color: #1b1b1b; border-bottom: 1px solid #e6e6e6; border-top: 0px !important}
#header .header-nav .gnb-items a:hover {text-decoration: none; background-color: #f7f7f7}
#header .header-nav .gnb-items a::before {content: "\f105"; width: 30px; height: 30px; padding-right: 10px; color: rgba(27,27,27,0.6); font-family: FontAwesome; font-size: 12px;}
#header .header-nav .gnb-list.on .gnb-title {background-color: #fff; color: #00adbb; border-top: 3px solid #00adbb; text-decoration: none}
#header .header-nav .gnb-list.on .gnb-itembox {display: block}

#header .header-nav .user-menu {display: inline-block; position: absolute; top: 20px; right: 0}
#header .header-nav .user-menu a {font-size: 12px; color: #C5C3C3; text-decoration: none;}
#header .header-nav .user-menu span {padding: 0 5px; font-size: 12px; color: #eee;}

#header .header-nav .header-search {position: relative; height: 62px; background: #D3D8D9; width: 1140px; margin: 0 auto;}
#header .header-nav .header-www {position: absolute; top: 16px; left: 108.5px; font-family:Helvetica Neue,Helvetica,Arial,sans-serif; font-size:22px; font-weight:bold; line-height:30px; color:#9D9DA8}
#header .header-nav .header-search-area {position: absolute; top: 16px; left: 205px; margin: 0; padding: 0; list-style: none;}
#header .header-nav .header-search-area li {float: left;}
#header .header-nav .header-search-area input {display: block; width: 528px; height: 28px; line-height: 28px; padding: 0 11px; background-color: #fff; font-size: 12px; color: #555; line-height: 1.42857143; border: 1px solid #ccc; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
#header .header-nav .header-search-area input:focus {border-color: #66afe9; outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);}
#header .header-nav .header-search a {display: block; height: 28px; padding: 0 10px; line-height: 26px; font-size: 12px; text-decoration: none; background: #00adbb; border: 1px solid #02A4B1; color: #fff; text-align: center; box-sizing: border-box;}
#header .header-nav .header-search a:hover {background: #0294A0; border: 1px solid #357ebd;}
#header .header-nav a.header-domein-research {position: absolute; top: 16px; right: 168px; width: 103px; padding: 0 18px;}
#header .header-nav a.header-domein-price {position: absolute; top: 16px; right: 17px; display: block; width: 147px; padding: 0 18px;}

/*header - middle device*/
@media (min-width: 1024px) and (max-width: 1140px) {
	#header .header-container {width: 100%; padding: 0 15px}
	#header .header-top .brand-logo {margin-left: 0}
	#header .header-nav .gnb-title {padding: 17px 6px}
	#header .header-nav .user-menu {right: 15px}

	#header .header-nav .header-search {width: 100%}
	#header .header-nav .header-www {left: 30px}
	#header .header-nav .header-search-area {left: 125px}
	#header .header-nav .header-search-area input {width: 520px;}
	#header .header-nav a.header-domein-research {right: 170px}
	#header .header-nav a.header-domein-price {right: 15px}
}

@media (min-width: 768px) and (max-width: 1023px) {
	#header .header-container {width: 100%; padding: 0 15px; text-align: center;}
	#header .header-top .brand-ad {display: none}
	#header .header-top .brand-logo {display: inline-block; float: none}
	#header .header-mobile {display: block; }
}
@media screen and (max-width: 980px) {
#side{
	display:none;
}
	.m-toggle-side{
		display: none;
	}
	#bodywrap{
		margin:0px 0 50px;
		display: table;
	}
	#hkcontent{
		width:95vw;
		margin:0px auto;
		margin-top:56px;
	}
}

/*
 * @Module
*/

/*button*/
.btns {display:inline-block; font-size: 13px; padding:7px 16px; border-radius:2px; text-align:center; cursor:pointer; text-indent:0}
.btns:hover {text-decoration: none}
.btns-type-01 {background-color:#00adbb; border:1px solid #009ba7; color:#fff!important}
.btns-type-02 {background-color:#fbfbfb; border:1px solid #e9e9e9; color:#666!important}
.btns-type-03 {background-color:#d20421; border:1px solid #b1051d; color:#fff!important}
.btns-wrap {margin-top: 32px; text-align: center;}
.btns-wrap .btns {width: 168px; height: 40px; padding: 0; line-height: 42px; font-size: 16px; font-weight: 600;}
.btns-calendar {padding:4px; border:1px solid #e9e9e9; border-radius:2px; background-color:#fbfbfb;}

/*font*/
.color1{color:#00adbb!important}
.color2{color:#bb0000!important}
.color3{color: #333}
.bold {font-weight:800}
.through {text-decoration: line-through;}
.letter25 {letter-spacing: -.25px}
.line24 {line-height: 24px}
.line30 {line-height: 30px}
.mt20 {margin-top: 20px}
.ta-right {text-align: right}

/*process-bar*/
.process-type {overflow:hidden; width:100%; height:57px; text-align:center; background:url("../../images/crebiz/common/process-type.png") no-repeat; background-size:842px; background-position:0 0}
.process-type.step02 {background-position:0 -61px}
.process-type.step03 {background-position:0 -122px}
.process-type.step04 {background-position:0 -183px}
.process-type li {float:left; height:57px; font-size: 13px; color:#666; line-height:57px; text-align:center; letter-spacing: 0; text-indent:-20px}
.process-type li:nth-child(1) {width:223px}
.process-type li:nth-child(2) {width:205px}
.process-type li:nth-child(3) {width:205px}
.process-type li:nth-child(4) {width:209px}
.process-type.step01 li:nth-child(1),
.process-type.step02 li:nth-child(2),
.process-type.step03 li:nth-child(3),
.process-type.step04 li:nth-child(4) {color:#fff; font-weight:bold}

.process-type2 {overflow:hidden; width:100%; height:57px; text-align:center; background:url("../../images/crebiz/common/process-type2.png") no-repeat; background-size:842px; background-position:0 0}
.process-type2.step02 {background-position:0 -61px}
.process-type2.step03 {background-position:0 -122px}
.process-type2 li {float:left; height:57px; font-size: 13px; color:#666; line-height:57px; text-align:center; letter-spacing: 0; text-indent:-20px}
.process-type2 li:nth-child(1) {width:291px}
.process-type2 li:nth-child(2) {width:293px}
.process-type2 li:nth-child(3) {width:258px}
.process-type2.step01 li:nth-child(1),
.process-type2.step02 li:nth-child(2),
.process-type2.step03 li:nth-child(3) {color:#fff; font-weight:bold}

/*form*/
.wrap-form input[type="text"] {width:120px; height:34px; border:1px solid #e9e9e9; font-size: 13px; text-indent:1em}
.wrap-form input[type="text"].input-center {text-align:center}
.wrap-form input[type="text"].middle-desc {width:190px}
.wrap-form input[type="text"].long-desc {width:360px}
.wrap-form input[type="text"].size220 {width:220px}
.wrap-form input[type="text"].size290 {width:290px}
.wrap-form input[type="text"].size310 {width:310px}
.wrap-form input[type="text"].full-desc {width:95%}
.wrap-form input[type="text"].calendar {width:140px}
.wrap-form input[type="text"].phone {width: 90px}
.wrap-form input[type="text"].captha {width: 442px}
.wrap-form input[type="text"].warning {color:#d20421; border:1px solid #d20421}
.wrap-form input::placehorder {color:#999}
.wrap-form input::-moz-placeholder {color:#999}
.wrap-form input[type="button"] {width:70px; padding:7px 0}
.wrap-form select {padding:7px 14px; border:1px solid #e9e9e9; font-size: 13px; color:#666; letter-spacing: 0}
.wrap-form select.long-desc {width:148px}
.wrap-form select.short-desc {width:68px}
.wrap-form select.phone {width:90px}
.wrap-form input[type="checkbox"],
.wrap-form input[type="radio"] {overflow:hidden; position:absolute; width:1px; height:1px; margin:-1px;padding:0; clip:rect(0,0,0,0); border:0}
.wrap-form input[type="checkbox"] + label {display:inline-block; position:relative; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none}
.wrap-form input[type="checkbox"] + label:before {content:''; display:inline-block; width:18px; height:18px; line-height:18px; margin:-2px 8px 0 0; text-align:center; vertical-align:middle; background:#fff; border:1px solid #ddd; border-radius:2px}
.wrap-form input[type="checkbox"]:checked + label:before {content: '\2714'; color:#99a1a7; background:#e9ecee; border-color: #adb8c0}
.wrap-form input[type="radio"] + label {display:inline-block; position:relative; margin-right: 13px; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none}
.wrap-form input[type="radio"] + label:before {content:''; display:inline-block; width:20px; height:20px; line-height:18px; margin:-2px 8px 0 0; text-align:center; vertical-align:middle; background:url("../../images/crebiz/common/radio-emt.png") no-repeat}
.wrap-form input[type="radio"] + label:last-of-type {margin-right: 0}
.wrap-form input[type="radio"]:checked + label:before {background:url("../../images/crebiz/common/radio-chk.png") no-repeat}

.wrap-form textarea {border:1px solid #e9e9e9}
.wrap-form textarea.full-desc {width: 91%; padding: 8px 14px}
.wrap-form textarea.full-width {width: 94%; height: 337px; margin: 10px 0; padding: 13px}

/*table*/
.wrap-form table {width:100%; border-top: 1px solid #e9e9e9}
.wrap-form th,
.wrap-form td {padding-left: 14px; border-bottom: 1px solid #e9e9e9}
.wrap-form th {font-size: 13px; font-weight: 600; color: #222; line-height: 49px; letter-spacing: 0; vertical-align: middle; text-align: left; background-color: #fbfbfb}
.wrap-form td {font-size: 13px; color: #666; letter-spacing: 0; text-align: left}
.wrap-form .td-first {text-indent: 1em}
.wrap-form .td-center {text-align: center}

/*customer-info*/
.wrap-form .info-box {overflow:hidden; width:100%; border-collapse:separate; border-width:1px 0 0 0; border-style:solid; border-color:#e9e9e9}
.wrap-form .info-box th {width:160px; text-align:left; text-indent:14px; vertical-align:middle; border-width:0 0 1px 0; border-style:solid; border-color:#e9e9e9}
.wrap-form .info-box td {position:relative; width:682px; height:auto; padding:9px 0; font-size: 13px; text-indent:14px; vertical-align:middle; border-width:0 0 1px 0; border-style:solid; border-color:#e9e9e9}
.wrap-form .info-box input {height: 34px}
.wrap-form .info-box select {height: 36px; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url('../../images/crebiz/common/select-arrow.png') no-repeat 95% 50%;}
.wrap-form .info-box select::-ms-expand {display: none}
.wrap-form .info-box label {text-indent:0}
.wrap-form .info-box input.short-desc {width:118px}
.wrap-form .info-box input.addr-desc {width:448px}
.wrap-form .info-box input.long-desc {width:651px}
.wrap-form .info-box input.cost {width:218px; padding-right:14px; text-align:right}
.wrap-form .info-box select.long-desc {width:220px}
.wrap-form .info-box .info-desc {margin-left:14px}
.wrap-form .info-box input.phone-num {position:relative; width:60px}
.wrap-form .info-box select.phone-num {width:80px}
.wrap-form .info-box .phone-hypen {display: inline-block; padding: 0 3px; font-family:dotum,"�룍��"; font-size:10px; font-weight:bold; text-indent:0}
.wrap-form .info-box input.email-addr {width:143px}
.wrap-form .info-box select.email-addr {width:160px}
.wrap-form .info-box .email-sign {display: inline-block; padding: 0 1px; font-weight: bold; text-indent: 0}
.wrap-form .info-box textarea.full-width {width: 625px; height: 188px; margin: 0; padding: 13px}
.wrap-form .info-box textarea.full-width + p {margin-top: 20px}

.wrap-form .info-box .get-post {width:100px}
.wrap-form .info-box .addr-head {padding-bottom:36px}
.wrap-form .info-box .addr-box {margin-bottom:4px}
.wrap-form .info-box .locate-box {margin:12px 0 6px}
.wrap-form .info-box input[type="radio"] + label {width: auto; padding: 6px 0; line-height: 24px;}
.wrap-form .info-box input[type="radio"] + label.radio-desc {width:260px}
.wrap-form .info-box input[type="radio"] + label.type-select {width:120px}
.wrap-form .info-box input[type="radio"] + label.payment-select {width:120px; margin:7px 0 10px}
.wrap-form .info-box .dcode-radio {margin-right:14px; text-indent:0}
.wrap-form .info-box .dcode-input {margin-left:8px}
.wrap-form .info-box .innerbox {padding:0}
.wrap-form .info-box .inner-border {display:table; width:100%; border-bottom:1px solid #e9e9e9}
.wrap-form .info-box .inner-border:last-of-type {border-bottom:0}
.wrap-form .info-box .innerbox-left,
.wrap-form .info-box .innerbox-right {display:table-cell}
.wrap-form .info-box .innerbox-left {width:122px; font-weight:700; border-right:1px solid #e9e9e9; vertical-align:middle}
.wrap-form .info-box .innerbox-right {padding:8px 0}
.wrap-form .innerbox-right .innder-chkbox {margin:6px 0 6px; text-indent:0}
.wrap-form .info-box .email-desc {margin:12px 0 6px}
.wrap-form .info-box .cn-input {margin:12px 0}
.wrap-form .info-box .tax-td {padding-top:14px}
.wrap-form .info-box .desc-box {padding:9px 0}
.wrap-form .info-box .desc-box2 {padding:9px 0 0}

/*paging*/
.page-nav {overflow:hidden; display:table; margin:20px auto 0; border-left: 1px solid #e9e9e9}
.page-nav span {display: inline-block; float: left; padding: 6px 4px; margin-left: -1px; min-width: 23px; min-height: 19.2px; text-align: center; line-height: 19.2px; border: 1px solid #e9e9e9}
.page-nav .on {background-color:#00adbb; color:#fff}
.page-nav img {display:inline-block; padding:3px 0}

/*map*/
.locate-map {margin-bottom: 20px}
.locate-section {overflow: hidden; margin-bottom: 10px}
.locate-section dt,
.locate-section dd {float: left; line-height: 24px}
.locate-section dt {width: 80px; font-weight: 600; color: #222}

/*faq*/
.wrap-faq {position: relative; margin-bottom: 4px}
.wrap-faq .faq-title {position: relative; padding-left: 40px; line-height: 48px; background-color: #fbfbfb; border: 1px solid #efefef; cursor: pointer;}
.wrap-faq .faq-title::before {content: 'Q.'; position: absolute; left: 20px}
.wrap-faq .faq-title .triangle {position: absolute; top: 50%; right: 13px; width: 0; height: 0; margin-top: -10px}
.wrap-faq .faq-title .triangle.down {margin-top: -5px; border-top: 5px solid #000; border-right: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 5px solid transparent}
.wrap-faq .faq-title .triangle.up {border-top: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 5px solid #000; border-left: 5px solid transparent}
.wrap-faq .faq-subscript {position: relative; padding: 14px 14px 14px 40px; border-left: 1px solid #efefef; border-bottom: 1px solid #efefef; border-right: 1px solid #efefef; line-height: 24px; word-break: keep-all; }
.wrap-faq .faq-subscript::before {content: 'A.'; position: absolute; left: 20px}
