﻿@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url(//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSans-kr.css);
@font-face {
  font-family: 'GoyangIlsan';
  src: url('./font/GoyangilsanL.eot'); /* IE 호환성 보기 */
  src: url('./font/GoyangilsanL.eot') format('embedded-opentype'), /* IE 6 ~ 8 */
       url('./font/GoyangilsanR.ttf') format('truetype'),
       url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/GoyangIlsan.woff') format('woff'); /* 구 모바일 브라우저 */
}

/* @font-face { font-family: 'GoyangIlsan'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/GoyangIlsan.woff') format('woff'); font-weight: normal; font-style: normal; } */

/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,heade,nav,aside,section,article,footer
{ margin:0;  padding:0;}
table {border-collapse:collapse; border-spacing:0;}
input,select { vertical-align:top; padding:0;}
fieldset,img {border:0; vertical-align:top;}
address,caption,cite,code,dfn,var {font-style:normal; font-weight:normal; }
ol,ul {list-style: none; }
caption,th { text-align:left;}
h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight:normal;}
q:before,q:after {content:"";}
a{outline:1;   text-decoration:none; color:inherit;}
em { font-style:normal; }
body { font: 14px /1.4 arial, sans-serif; color:black; overflow-x:hidden; font-family: 'GoyangIlsan','Spoqa Han Sans', 'Noto Sans KR', "맑은 고딕", "Malgun Gothic", "애플 SD 산돌고딕 Neo", "Apple SD Gothic Neo", sans-serif; font-weight: 500; min-width: 1100px;  overflow-x: auto;}
body,html{ min-width: 1100px;
}
.h { position:absolute; top:-99999px;}

input,select, textarea{font-family: 'GoyangIlsan','Noto Sans KR', sans-serif; font-weight: 500;}
textarea{padding:10px; box-sizing:border-box}

/*scrollbar*/
html {scrollbar-3dLight-Color: #efefef; scrollbar-arrow-color: #dfdfdf; scrollbar-base-color: #efefef; scrollbar-Face-Color: #dfdfdf; scrollbar-Track-Color: #efefef; scrollbar-DarkShadow-Color: #efefef; scrollbar-Highlight-Color: #efefef; scrollbar-Shadow-Color: #efefef}
/* Chrome, Safari용 스크롤 바 */
::-webkit-scrollbar {width: 8px; height: 8px; border: 3px solid #fff; }
::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment {display: block; height: 10px; background: url('./images/bg.png') #efefef}
::-webkit-scrollbar-track {background: #efefef; -webkit-border-radius: 10px; border-radius:10px; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.2)}
::-webkit-scrollbar-thumb {height: 50px; width: 50px; background: rgba(0,0,0,.2); -webkit-border-radius: 8px; border-radius: 8px; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.1)}

html, body{background-color:#f8f8f8}
/* Styles specific to this particular page */
.scroll-pane
{
	width: 100%;
	height: 200px;
	overflow: auto;
}
.horizontal-only
{
	height: auto;
	max-height: 200px;
}


/*header*/
header{width:100%; height:77px; position: fixed; top:0; z-index: 99999; background-color:white;  }
header > h1{
	text-align: center;
	margin-top: 13px;
}
#header {border-top:0; border-top: 2px solid #f37025; border-bottom:1px solid #ddd; height:90px; box-sizing:border-box}
#header .wfix{width:90%; margin:10px auto; position:relative;}
#header .wfix h1{display:inline-block;}
#container{height:100%;}
/* header */
#header {position:relative;  padding-top:15px; background:#fff; z-index: 200; min-width:1200px;}
#header h1 {width:120px; height:37px; padding-bottom:15px;}
#header h1 img{max-width:120px;}
#header .gnb {position:absolute; top:15px; right:0; overflow:hidden;}
#header .gnb li {float:left; margin-left:20px; text-align:right;}
#header .gnb a:hover {font-weight:bold;}

#header .gnb li a{display: block; position: relative; }

#header .gnb li.myPage{ z-index: 10; -webkit-transition: all 0.5s ease; transition: all 0.5s ease;}
#header .gnb li.myPage img{margin-top: 5px; margin-left: 5px; opacity: 0.1;}

#header .gnb li.myPage a{ height: 48px; width:120px; text-align: center;  }
#header .gnb li .depth2{overflow: hidden; display: none;}
/*
#header .gnb li .depth2.on{
    border-bottom:2px solid #f37025; height:auto;
}
*/

#header .gnb li .depth2 li{clear: both; margin-left: 0px;}
#header .gnb li .depth2 li a{line-height: 2.7; background: rgba(255,255,255,0.9);}

#header .gnb li.logOut{margin-left: 10px;}

.hd_info{
  display: inline-block;
    padding-left: 10px;
    font-size: 17px;
    height: 20px;
    /* padding-top: 25px; */
    vertical-align: top;
    margin-top: 14px;}
  .hd_info span:nth-child(1) strong{color:#f37025; padding-right:10px; position:relative; }
  .hd_info span:nth-child(1):after strong{
    position: absolute;
      width: 2px;
      height: 16px;
      background-color: #f37025;
      display: block;
      content: '';
      right: 0;
      bottom:3px;}

/* step_bar */

#stepBar {border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    background: #fff;
    height: 35px;
    display: inline-block;
    margin: 0 auto;
    position: absolute;
    top: 35px;
    left: 0;
    right: 0;
    margin: auto;
    width: 303px;
  z-index:999}
#stepBar .wfix{text-align:center;}
#stepBar .wfix ul{display:inline-block;}
#stepBar .wfix ul:after{display:block; content:''; clear:both;}
#stepBar .list_step {margin:0 auto; border-left:1px solid #ccc;}
#stepBar .list_step li {float:left; width:150px; border-right:1px solid #ccc; background:#fff; line-height:35px; color:#999; text-align:center; font-size:15px;}
#stepBar .list_step span {display:inline-block; position:relative; margin-right:10px; padding-right:14px; font-size:12px;}
#stepBar .list_step span:after {position:absolute; top:50%; right:0; width:1px; height:14px; margin-top:-7px; background:#bbb; content:''}
#stepBar .list_step span em {font-size:24px; font-weight:bold;}
#stepBar .list_step strong {font-weight:normal;}
#stepBar .list_step .on {background:#f47228; color:#fff; font-size:17px;}
#stepBar #btnGuide {position:absolute; top:10px;  width:90px;  right: 50%;
    margin-right: -499px; }
#stepBar #btnGuide .ico_order {width:12px; height:17px; margin:9px 7px 0 0; background-position:-110px 0;}

/* 주문입력 */
.tab02{display: block; max-width:1400px; margin:0 auto; padding: 20px; padding-top: 35px;     height: calc(100vh - 145px);
    overflow: auto;}
.box {border: 1px solid #d5d5d5; background: #fff; display:inline-block;}
.box.envelope{width:31%;}
.box.envelope .dl_form{height:55px; position:relative;}
.box.envelope .cont_box{padding-bottom:10px;}
.hd_box { height: 45px; padding: 0 16px 0 24px;  border-bottom: 1px solid #ccc;}
.hd_box strong {  display: block; float: left; font-size: 18px; line-height: 45px; font-weight: normal;}
.cont_box { padding: 20px;}
.cont_box:after,
.tab02:after{display:block; content:''; clear:both;}
.envelope .cont_box input[type=radio]{width: 20px;height: 20px;display:none;	-webkit-appearance: radio;}
.envelope .ico_tel input[type="radio"] + label span {	display: inline-block;	width: 15px;	height: 15px;	vertical-align: middle;	cursor: pointer;	background-size:15px;	margin-right: 10px;}
.envelope .ico_tel input[type="radio"]:checked + label span {background:url('../img/checked_2.png') right top no-repeat; background-size:15px;}
.envelope .ico_tel input[type="radio"] + label span{background: url('../img/check.png') no-repeat; background-size:15px;}


.contents.ovf{    display: inline-block;    width: 68%;    float: right;}
.contents.ovf .cont_box { min-height:170px; }
.contents.ovf .fl{width:100%;}
.contents.ovf .fl .box.open {    display: inline-block;}
.contents.ovf .fl .box {display: none; width:49.5%; margin-right:1%; box-sizing:border-box; float:left;}
.contents.ovf .fl .box:nth-child(2){margin-right:0}
.ex {    display: block;    color: #666;    font-size: 14px;    padding-left: 25px;    margin-top: 5px;}

.env dt .ico_tel { height: 14px; background-position: -125px -20px;  margin-top: 13px;}
.env label{font-size:16px;}
.dl_form:after{display:block; content:''; clear:both;}
.envelope .dl_form dd {  float: right; position:absolute; top:0; right:0;}
.contents.ovf .dl_form dd {width:calc(100% - 110px); float:right;}
.contents.ovf .fl .box .dl_form dt {
    float: left;
    width: 100px;
    margin-right: 8px;
    line-height: 40px;
    font-size:16px;
}
.dl_form{width:100%; float:left; padding-bottom:5px;}
.dl_form:after{display:inline-block;}
.dl_form dt{font-size:16px;}
.contents.ovf .slt {
    position: relative;
    background: #fff;
}
.contents.ovf .slt select,
.contents.ovf dd input {
  font-size:14px;
  top: 0;
  left: 0;
  width: 100%;
  height: 38px;
  border-radius:2px;
  border:1px solid #dbdbdb
}
.tf input[type="text"], .tf select, .tf input{height:40px; width:100%; font-size:14px; border:1px solid #dbdbdb}
.box.sent{width:45%; float:left; display:inline-block;}
.sent .dl_form dt{width:100px; display:inline-block; line-height:40px;}
.sent .dl_form dd{width:calc(100% - 110px); float:right}
.sent .contents > .fl {width:785px; margin-right:8px;}
.sent .fl .cont_box {height:auto;min-height:320px;}
.sent .thumb {float:left; width:310px; height:300px; margin-right:32px; overflow:hidden;}
.sent .thumb + .dl_form {overflow:hidden;}
.sent .fl dt .ico_order {width:18px; height:18px; background-position:-145px -50px; margin:11px 0 0 4px;}
.sent .file .tf {width:60%;}
.sent .file label {width:83px; margin:0; padding:0 10px;}
.sent .fl + .ovf .tf {border-color:#eee; background:#f5f5f5;}
.sent .fl + .ovf .dl_form {padding-bottom:8px; margin-bottom:8px; border-bottom:1px solid #e5e5e5;}
.sent .fl + .ovf .dl_form .address .tf:first-child {position:relative;}
.sent .fl + .ovf .dl_form .address .tf:first-child button {position:absolute; top:0; right:0;}
.sent .fl + .ovf .dl_form .address .tf +.tf {margin-top:8px;}
#szip{width:80%;}
.addr_btn{width:19%; float:right; height:40px;}
#sadd1, #sadd2{margin-top:5px;}
.sent .dl_form{padding-bottom:8px;}



.payment.box{width:54%; float:right;}
.wrap_btn{width: auto; display: inline-block; float: right; width:360px; box-sizing:border-box;}
.wrap_btn li{width:120px; padding: 0;box-sizing: border-box; float:left;}
.wrap_btn li a{width:100%; box-sizing:border-box;}
.wrap_btn .ico_order {width:23px; height:17px; margin-top:14px;}
.wrap_btn .btn_oran{   border: 1px solid #e94200;
    background: #f47228;
    color: #fff;
    cursor: pointer;}

.payment .wrap_btn .ico_prev {background-position:-135px -120px; margin-right:5px;}
.payment .wrap_btn .ico_save{background-position:-93px -25px; width:27px;height:24px; margin-right:2px;margin-top:11px; opacity: 0.89}
.payment .wrap_btn .ico_next {background-position:-110px -120px; margin-left:5px;}
.payment .wrap_btn .ico_pay {width:25px; height:27px; background-position:-80px -120px; margin-right:5px;}
.payment .cost {line-height:80px;}
.payment .send .dl_form {width:49.5%; margin-right:1%;display:inline-block; height:80px;}
.payment .send .dl_form:nth-child(2n){float:right; margin-right:0;}
.payment .calendar {position:relative; padding-right:40px;}
.payment .calendar label {position:absolute; top:0; right:0; width:40px; height:40px; background:#444; text-align:center; cursor:pointer;}
.payment .calendar label .ico_order {width:24px; height:24px; background-position:-125px -85px; margin-top:8px;}
.top_cost{display: inline-block; line-height: 52px; font-size: 19px; padding-left:20px;}
.payment .btn{font-size: 16px;
    width: 120px;
    height: 35px;
    display: inline-block;
    background-color: #f47228;
    color: #fff;
    line-height: 35px;
    text-align: center;
    border-radius: 2px;
    float: right;
    margin-top: 8px;}
.send .info_comm p{padding-top:3px;}
    /* 주문내역 상세 */
    .payment .hd_box {position:relative; height:45px; padding:0 16px 0 24px; border-bottom:1px solid #ccc;}
    .payment .hd_box a {float:right; margin-top:8px; padding:0 10px;}
    .payment .hd_box a .ico_order {width:19px; height:19px; margin:7px 6px 0 0; background-position:-105px -100px;}
    .payment dt {font-weight:500}
    .payment .wrap_box + .wrap_box {margin-top:8px;}
    .payment .box {height:506px;}
    .payment .box.fl {width:702px; margin-right:8px;}
    .payment .box+.box {overflow:hidden;}
    .payment .box_bold {height:382px; border:2px solid #777}
    .payment .box_bold.fl {width:700px;}
    .payment .box_dual {position:relative; overflow:hidden;}
    .payment .box_dual:after {position:absolute; top:0; left:50%; width:1px; height:335px; background:#d5d5d5; content:''}
    .payment .box_dual .inner {float:left; width:50%;}
    .payment .box_dual .cont_box {overflow:hidden;}
    .payment .box_dual .fl {width:100px; margin-right:14px; margin-top:7px;}
    .payment .box_dual .btn_view {display:block; margin-top:10px; border:1px solid #ccc; text-align:center; line-height:28px; font-size:14px;}
    .payment .box_dual .btn_view .ico_order {width:16px; height:16px; background-position:-85px -100px; margin:6px 3px 0 0;}
    .payment .box_dual .dl_info {overflow:hidden;}
    .payment .box_dual .dl_info dd+ dt,
    .payment .box_dual .dl_info dd + dt +dd{margin-top:19px;}
    .payment .box_dual .dl_info dt{}
    .payment .box_dual .dl_info dd {overflow:hidden; line-height:28px; font-size:14px;}
    .payment .box_dual .dl_info dt {float:left; width:70px; line-height:26px; border:1px solid #ccc; border-radius:4px; text-align:center; margin-right:8px; font-size:13px; }
    .payment .box_dual .dl_info dd span {display:block; font-size:777; line-height:1; letter-spacing:0}
    .payment .area {float:left; width:214px;}
    .payment .area:first-child {margin-right:15px;}
    .payment .area strong {display:block; margin-bottom:5px;}
    .payment .area strong span {font-weight:normal; font-size:14px; color:#777}
    .payment .area ul {height:208px; border:1px solid #d5d5d5; overflow-y:auto;}
    .payment .list_area1 {background:#f5f5f5;}
    .payment .list_area1 li a {display:block; padding:12px;}
    .payment .list_area1 li a:hover {background:#e5e5e5;}
    .payment .list_area1 li.on a {background:#333; color:#fff; font-weight:bold;}
    .payment .list_area2 li {padding:10px 15px; font-size:14px;}
    .payment .list_area2 li+li {border-top:1px solid #d5d5d5;}
    .payment .dl_form {overflow:hidden;}
    .payment .dl_form .tf {background:#f5f5f5; display:block;}
    .payment .wrap_dl  {overflow:hidden; margin:0 10px;}
    .payment .fl .cont_box > .dl_form {margin:0 10px;}
    .payment .fl .wrap_dl + .wrap_dl,
    .payment .fl .cont_box > .dl_form,
    .payment .fl .cont_box > .dl_form + .wrap_dl {padding-top:9px; margin-top:9px; border-top:1px solid #ddd;}
    .payment .wrap_dl .dl_form:first-child {float:left; width:335px; margin-right:40px;}


    .payment .wrap_dl .dl_form + .dl_form {overflow:hidden;}
    .payment .wrap_dl .dl_form + .dl_form dt {width:60px;}
    .payment .tit_dot {position:relative; width:120px;  font-size:16px; line-height:36px; display:inline-block;}
    /*.payment .tit_dot:after {position:absolute; top:50%; left:0; width:3px; height:3px; background:#333; margin-top:-1px; content:''} */
    .payment .tit_dot + dd {line-height:40px;}
    .payment .address .tf:first-child {position:relative; width:220px;}
    .payment .address .tf:first-child button {position:absolute; top:0; right:0;}
    .payment .address .tf +.tf {margin-top:8px; }
    .payment .address .tf.fl {width:220px; margin-right:8px;}
    .payment .file .tf {width:383px;}
    .payment .file .file_input label {margin:0;}
    .payment .origin {padding:36px 20px;}
    .payment .origin .tit_dot + dd {position:relative; padding-left:18px;}
    .payment .origin .tit_dot + dd:after {position:absolute; top:12px; left:0; width:1px; height:15px; background:#ccc; content:''}
    .payment .cost {display:block; border:3px solid #333; text-align:center; line-height:45px; font-size:18px; font-weight:bold;}
    .payment .cost dt,
    .payment .cost dd {display:inline-block; margin:0 5px;}
    #estimate{width: 100px;
    height: 35px;
    font-size: 14px;
    font-weight: normal;
    background-color: #666;
    display: inline-block;
    line-height: 2.4;
    color: #fff;
    border-radius: 2px;
    vertical-align: top;
    margin-top: 11px;}
    /* etc */
    .ico_comm {display:inline-block; background:url(../img/ico_comm.png) 0 0 no-repeat; vertical-align:top; font-size:0; line-height:0; text-indent:-9999px;}
    .ico_order {display:inline-block;background: url(../img/ico_order.png) 0 0 no-repeat;font-size:0;line-height:0;text-indent:-9999px;vertical-align:top;}

.popup{
    display:none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index:2100;
    background-color:#fff;
}
#delivery_area{
    width: 550px;
    height: 380px;
}
#delivery_area .hd_box{text-align:left; color: #f47228; font-size:16px;}
#delivery_area .hd_box strong{float:none; display:inline-block; color:#333; padding-right:10px;}
#delivery_area .area{
    width: 49.5%;
  display:inline-block;
float:left;}
#delivery_area .area ul{width:100%;    height: 208px; border: 1px solid #d5d5d5; overflow-y: auto;}
#delivery_area .area#resultBox{float:right}
#delivery_area .area ul:after{display:block; content:''; clear:both;}


#delivery_area .area strong{font-size:16px;}
#delivery_area .area ul li{font-size:16px; padding:10px 5px;}
#delivery_area .area ul li:nth-child(2n){background-color:#f8f8f8}
#delivery_area .btn_close{
  background-color: #f47228;
    width: 120px;
    display: inline-block;
    text-align: center;
    height: 35px;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    line-height: 2.5;
  color:#fff;}
.popup_bg{position:fixed; width:100vw; height:100%; left:0; right:0; bottom:0; top:0; margin:auto; background:rgba(0, 0, 0, .3); display:none; z-index:2000}

#estimateWrap{width:500px; height:500px;}



/* footer */
#footer {padding:70px 0; background:#333; color:#ddd; font-size:15px; overflow:hidden; min-width:1200px;}
#footer .logo {float:left; width:120px; opacity:0.5}
#footer .links {overflow:hidden; text-align:right;}
#footer .links li {display:inline-block; position:relative; margin-left:15px; padding-left:16px; }
#footer .links li:hover {color:#fff;}
#footer .info {clear:both; margin-top:30px;}
#footer .info span {display:inline-block; position:relative; margin-right:15px;}
#footer .info span+span {padding-left:16px;}
#footer .links li +li:after,
#footer .info span+span:after {position:absolute; top:50%; left:0; width:1px; height:14px; margin-top:-7px; background:#ddd; content:''}
#footer .copyright {margin-top:10px; letter-spacing:0; }


/* btn_wrap */
.btn30 {display:inline-block; line-height:28px; padding:0 10px; font-size:14px; min-width:40px; text-align:center;}
.btn35 {display:inline-block; line-height:33px; padding:0 14px; font-size:15px; min-width:70px; text-align:center;}
.btn40 {display:inline-block; line-height:38px; padding:0 10px; font-size:15px; min-width:70px; text-align:center}
.btn45 {display:inline-block; line-height:43px; padding:0 14px; font-size:15px; min-width:70px; text-align:center}
.btn60 {display:inline-block; line-height:58px; padding:0 30px; font-size:18px; min-width:110px; text-align:center}
.btn_rdus {border-radius:4px;}
.btn_dark {border:1px solid #454545; background:#555; color:#fff; cursor:pointer;}
.btn_dark:hover {background:#444;}
.btn_white {border:1px solid #777; background:#fff; color:#333; cursor:pointer;}
.btn_white:hover {background:#f8f8f8;}
.btn_emph {border:1px solid #e94200; background:#f47228; color:#fff; cursor:pointer;}
.btn_emph:hover {background:#db5407;}
.box_btn {
  display: inline-block;
  position: absolute;
  top:0;
  z-index: 999;
  width: 40px;
  height:auto;
  background-color:#e61a0f
}
#result .box_btn {
  left:-40px;
}
.box_btn a{
  display: inline-block;
  width: 100%;
  height: 100%;
  text-align: center;
}
.box_btn a span{
  display: inline-block;
  padding-top: 50px;
  padding-bottom: 11px;
  line-height: 1.4;
  color: #fff;
  font-size: 16px;
}
.left0{
  left:0
}
.right0{
  right:0
}
.top0{
  top:calc(-100% + 40px)
}

/*left_menu*/


#left_menu{
    width:70px;
    height: 100%;
    background: url(../img/menu_bg.png) repeat-y;
    border-right: solid 1px #d4d4d4;
    position: fixed;
    top:78px;
    z-index: 200;
}

#left_menu>ul{
   border-bottom: 2px solid #ee8680;
}

#left_menu>ul>li {
    min-height: 77px;
    border-bottom: 2px solid #bc2620;
    border-top: 2px solid #ee8680;
}

#left_menu>ul>li>a{
    display: flex; width:100%; height: 77px;
    min-height: 100%;
    justify-content: center;
    align-items: center;
}

.select2-container{width:100% !important}

#left_menu>ul>li.on{
    background: white;
}

#top_menu{
    width:100%;
    background-color:#F4F5F0;
    position: fixed;
    top:80px;
    left:0px;
    font-size: 14px;
    z-index: 200;
     box-sizing: border-box;
     min-width: 1000px;
     overflow: hidden;
	 height: 90px;
}
.btn2 {
    color: #ee2e24;
    border: 2px solid #ee2e24;
    background-color: white;
    padding: 8px 35px;
    border-radius: 3px;
    line-height: 100%;
    display: inline-block;
    font-weight: 800;
}

.btn2.gray {
    color: #666;
    border: 2px solid #666;
    background-color: white;
}
header .btn2{
     padding: 6px 30px;
     display: inline-block;
}

header .btns{
	position: absolute;
	left: 15px;
	top: 35px;

}
#top_menu>ul{
    /* display:flex; */
    border-bottom: 1px solid #d4d4d4;
    height: 53px;
	padding-left: 499px;

}
#top_menu li{
	float: left;
    border-right: 1px solid #d4d4d4;

}
#top_menu li:first-child{
	border-left: 1px solid #d4d4d4;
}
#top_menu li a{
    padding:17px 38px;
    display: block;
}
#top_menu li.on{
    border-bottom: 1px solid white;
    height: 54px;
    background-color: white;
}
#top_menu li.on a{

    font-weight: 600;
}

#wrap{width:100%;
margin-left: 53px; padding: 40px;
margin-top: 113px;

}

body.quick #wrap{
    display: flex;
    align-items: flex-start;
}



.check_form{
    /* display: flex;
    algin-items:center; */
}
.check_form input{width: 0;
overflow: hidden;
opacity: 0;
height: 0;
padding: 0;
position: absolute;}
.check_form label:before{content: ''; width:17px; height: 17px; display:inline-block; background: url(../img/check.png) no-repeat; position: relative; }

.check_form label{font-weight:400; letter-spacing: -0.5px; width:auto; margin-left: 10px; font-size: 15px;}
.check_form input[type="checkbox"]:checked+label:before{background:url(../img/checked.png) no-repeat;}

.check_form input[type="radio"]:checked+label:before{background:url(../img/checked.png) no-repeat;}



input{
    padding: 7px 8px;
    height: 30px;
    box-sizing: border-box;

}

input[type="text"],select{
    border-radius: 2px;
    border: 1px solid #dbdbdb;
    /* box-shadow: 1px 1px 2px #ebebeb; */
    height: 40px;
    font-size:14px;
    width:100%;
}








/*설정메뉴*/

.l_menu_sub{
    position: fixed;
    left: 71px;
    /* width:260px; */
    top:80px;
    height: 100%;
    background: #f8f8f8;
    z-index: 300;
    border-right: 1px solid #9f9f9f;
    display: none;
}

.l_menu_sub .menu_con{
    position: relative;
	width:266px;
}
.l_menu_sub .menu_con#send_section{
	width:auto;
}
.l_menu_sub .menu_con>div{
    padding: 15px;
    border-bottom:1px solid #9f9f9f;
    box-sizing: border-box;

}
.l_menu_sub .menu_con>div.sec1{
     height: 97px;

}
.l_menu_sub .menu_con>div.sec2{
     height: 172px;
}
.l_menu_sub .menu_con >div>p{
    font-size: 15px;
    color:black;
     margin-bottom: 15px;
}

.l_menu_sub .menu_con >div input,
.l_menu_sub .menu_con >div select{
    box-sizing: border-box;
    width:100%;

}
.l_menu_sub .menu_con >div select{
    margin-bottom: 5px;
}

.btn3 {
    padding: 10px 35px;
    background-color: #e82c23;
    border: 2px solid #b5322b;
    color: white;
    border-radius: 40px;
    height: auto;
    margin-top: 20px;
    margin-left: 170px;
    font-weight: bold;
}

.btn3.gray{
    background-color:#636363;
    border: 2px solid black;
}


.l_menu_sub .menu_con .sec3 dl{
    /* margin-top: 20px; */
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #dddddd;
    flex:1;
    display: flex;
    flex-direction: column;
    margin-bottom: 10px;
}
.l_menu_sub .menu_con .sec3 > p{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.l_menu_sub .menu_con {
    display: flex;
    flex-direction: column;
    height: 100%;
    display: none;
    box-sizing: border-box;
    flex-wrap: nowrap;
}

.l_menu_sub .menu_con .sec3{
    display: flex;
    flex-direction: column;
    flex: 1;
    box-sizing: border-box;
    padding-bottom: 100px;

	width:266px;
}
.l_menu_sub .menu_con .sec3 dl dt{
    padding: 7px;
    background: white;
    border-bottom: 1px solid #dddddd;
}

.l_menu_sub .menu_con .sec3 dl dd{
    background: #f3f3f3;
    padding: 7px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    overflow-y: auto;
    flex:1;

}

.l_menu_sub .menu_con .sec3 dl dd ul li{
    padding: 5px 0;
    white-space: nowrap;
}

.l_menu_sub .menu_con .check_form label{
    font-size: 13px;

}

.l_menu_sub .menu_con dd .check_form label{
    font-weight: 600;
}

.l_menu_sub .menu_con .btn_close{
    position: absolute;
    width:15px;
    right:10px;
    top:10px;
}


.l_menu_sub .menu_con#send_section{
     display: flex;
     flex-direction: row;
}
.l_menu_sub .menu_con#send_section > .depth2_menu{
     height:100%;
     width:210px;
     border-right: 1px solid #c9c9c9;
     padding:0px;
}

.l_menu_sub .menu_con#circle_section .ico_info,.l_menu_sub .menu_con#rectan_section .ico_info{
	position: absolute;
	top: 30px;
    right: 15px;
}
.l_menu_sub .menu_con#circle_section >div>p, .l_menu_sub .menu_con#rectan_section >div>p{
	margin-bottom: 10px;
	margin-top: 16px;
}
.depth2_menu ul li{
    height: 32px;
    border-bottom:1px solid #c9c9c9;
    box-sizing:border-box;
    padding-left: 5px;
    background-color: #f7f7f7;
    padding-left: 15px;
}

div.all_select{
    height:40px;
    min-height:40px;
    background:white;
    border-bottom:1px solid #c9c9c9;
    padding-left: 5px;
    padding-left: 15px;

}
#etc div.all_select{
	padding-top: 0px;
}
.l_menu_sub .menu_con div.all_select label{
	font-size: 14px;
	font-weight: 800;
}

.l_menu_sub .menu_con#send_section .check_form input[type="checkbox"]+label:before{background:url(../img/check2.png) no-repeat; background-size: contain; width:13px; height: 13px;}
.l_menu_sub .menu_con#send_section .check_form input[type="checkbox"]:checked+label:before{background:url(../img/checked2.png) no-repeat;}

.depth2_menu li.on{

   font-weight: 900;
}
.depth2_menu.left li.on{
   background-color: rgba(235, 82, 38, 0.5);
}
.depth2_menu.right li.on{
background-color: rgba(248, 189, 1, 0.48);
}

.paging_num{
     display: flex;
}
.paging_num li.num{
     display: inline-block;
     width:30px;
     height: 30px;
     display: flex;
     border: 1px solid #ddd;
     justify-content: center;
     align-items: center;
     color:#777;
     margin: 0 3px;
     font-weight: 500;
}
.paging_num li.num.on{
     background-color: #e82c23;
     color:white;
     border:0px;
     font-weight: 800;
}
.paging_num li .arrow{
     font-size: 25px; color:#777;
     margin: 0 10px;
}

#wrap{
	position: relative;
}
#license{
	position: relative;
	width:100%;
	text-align:center;
	color:#dedede;
	margin-top:50px;
}
body.detail01 #license{
	position: absolute;
	text-align: left;
	padding-left: 160px;
	bottom: 5px;
	margin-top: 0;
}
body.quick02 #license{

}

body.quick02 .check_form {
	display: inline-block;
}

body.step03 #license{

	padding-bottom: 10px;
}
body.step04 #license{
	margin-top: 20px;
	margin-bottom: 20px;
}


#ico_info{

}
#ico_info.on{
	border:2px solid #F8BD01;
	color:#F8BD01;
}
.btn3 {
    padding: 10px 35px;
    background-color: #e82c23;
    border: 2px solid #b5322b;
    color: white;
    border-radius: 40px;
    height: auto;
    margin-top: 20px;
    margin-left: 170px;
    font-weight: bold;
}


/*
#left_box dt:after {
    content: '';
    width: 3px;
    height: 18px;
    background: #ee2e24;
    display: inline-block;
    position: relative;
    top: 3px;
    margin-left: 10px;
}


#left_box ul li{
	margin-bottom: 10px;
}*/

.check_form label{
	margin-left: 0;
}

.section1 select{
	margin-top: 5px;
}


/*테이블 레이아웃*/

.t_layout1{ width:100%; margin-top: 7px; border-collapse:collapse; display:block;}
.t_layout1 th{height:40px; border-top: solid 2px #ee2e24; border-bottom:  solid 1px #cccccc;}
.t_layout1 td{height:35px; border-bottom: 1px solid #cccc;}


.t_layout1 td.check_form{padding-left: 15px;}
.t_layout1 tbody{overflow-y:auto; overflow-x:hidden; width:100%; float:left;}



.t_layout1 thead{float:left; width: 100%;}
.t_layout1 thead tr{display:inline-table; width: 100%; float: left;}
.t_layout1 tbody tr{display:table; width: 100%;}

.t_layout1 thead tr th:nth-child(1){width:8%}
.t_layout1 tbody tr td:nth-child(1){width:8%; padding-left: 10px; box-sizing: border-box}

.t_layout1 thead tr th:nth-child(2){width:22%; text-align: center;}
.t_layout1 tbody tr td:nth-child(2){width:22%; box-sizing: border-box;
text-align: center;}

.t_layout1 thead tr th:nth-child(3){width: 54%; text-align: center;}
.t_layout1 tbody tr td:nth-child(3){width: 54%; box-sizing: border-box;
text-align: left;}

.t_layout1 thead tr th:nth-child(4){width: 20%; text-align: right;box-sizing: border-box;padding-right: 35px;}
.t_layout1 tbody tr td:nth-child(4){width: 20%; box-sizing: border-box;
text-align: right; box-sizing: border-box; padding-right: 32px;}









.t_layout2 td{height:26px; border-bottom: 1px solid #cccc; font-size: 12px; border-bottom: 1px solid #dddddd;}


.t_layout2 td.check_form{
    padding-left: 15px;
}

.t_layout2{border-collapse:collapse; width:100%; -webkit-box-sizing: border-box; box-sizing: border-box; margin-top: 7px;  border: 1px solid #dddddd;  border-radius: 20px  20px 0 0;}

.t_layout2 thead{float:left; width:640px; -webkit-box-sizing: border-box; box-sizing: border-box;
    width:100%;
}

.t_layout2 tbody{overflow-y:auto; overflow-x:hidden; float:left; width:100%; -webkit-box-sizing: border-box; box-sizing: border-box; height: 130px;  overflow-y: auto;}

.t_layout2 tbody tr{display:table; width:640px;}

.t_layout2 th{height:27px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+50,f3f4f6+50,f3f4f6+50 */
background: #ffffff; /* Old browsers */ /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */
background: -webkit-gradient(linear,  left top, left bottom,  color-stop(50%, #ffffff),color-stop(50%, #f3f4f6),color-stop(50%, #f3f4f6));
background: linear-gradient(to bottom,  #ffffff 50%,#f3f4f6 50%,#f3f4f6 50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f3f4f6',GradientType=0 ); /* IE6-9 */
    font-size: 12px;
}

.t_layout2 thead tr th:nth-child(1){width:370px; -webkit-box-sizing: border-box; box-sizing: border-box; padding-left: 14px; }
.t_layout2 tbody tr td:nth-child(1){width:370px; padding-left: 10px; -webkit-box-sizing: border-box; box-sizing: border-box; padding-left: 14px;}

.t_layout2 thead tr th:nth-child(2){width:90px; text-align: center;}
.t_layout2 tbody tr td:nth-child(2){width:90px; -webkit-box-sizing: border-box; box-sizing: border-box;
text-align: center;}

.t_layout2 thead tr th:nth-child(3){width:100px; text-align: center; text-align: center;}
.t_layout2 tbody tr td:nth-child(3){width:100px; -webkit-box-sizing: border-box; box-sizing: border-box;
text-align: left; text-align: center;}

.t_layout2 thead tr th:nth-child(4){width:97px; text-align: right;  -webkit-box-sizing: border-box;  box-sizing: border-box; padding-right: 51px;}
.t_layout2 tbody tr td:nth-child(4){width:85px; -webkit-box-sizing: border-box; box-sizing: border-box;
text-align: right; box-sizing: border-box; padding-right: 40px;}


.t_layout2 tbody tr td:nth-child(4) a,.t_layout2 tbody tr td:nth-child(3) a{position:relative; top:2px;}








.btn2{
	position:relative;
}
.btn2:before {
    content: '';
    position: absolute;
    display: inline-block;
    left: 10px;
    top: 8px;
    width: 12px;
    height: 11px;
    background-size: contain;
	background-position: center center;
}

.btn2.add:before {
    background: url(../img/icon_file.png) no-repeat;
}
.btn2.file:before {
    background: url(../img/icon_add.png) no-repeat;
}


/*팝업*/
/*팝업/마스크작업*/
#mask{
position:fixed; width:100%; height: 100%; background:rgba(0,0,0,.23);
left: 0; top:0; z-index: 400;}

#mask .popup{
     background-color: white;
     padding:25px;
     border:2px solid black;
     -webkit-box-sizing: border-box;
             box-sizing: border-box;
	position: absolute;
	left: 50%;
	top:50%;
	transform: translate(-50%,-50%);
}

#mask .popup h3{
     font-weight: 800;
     font-size: 17px;
     padding-bottom: 15px;
     border-bottom: 2px solid black;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: justify;
         -ms-flex-pack: justify;
             justify-content: space-between;
     -webkit-box-align: center;
         -ms-flex-align: center;
             align-items: center;
}
#mask .popup h3 a{
     width:18px;
     height: 18px;
}

#mask .popup_cont{

     margin-top: 30px;
}




.t_layout3{
    border-top: 3px solid #e61a0f;
    width:100%;

}
.t_layout3  tr{
    border-bottom: 1px solid #e5e5e5;

}

.t_layout3 th{
    padding-left: 30px;
    position: relative;
}

.t_layout3 th.nec:before{
    content:'*';
    color:#ee2e24;
    font-size: 23px;
    position: absolute;
    left: 10px;
    top:15px;
}





.t_layout4 td{height: 55px;}
.t_layout4{ width:100%;}
.t_layout4 th{height:40px; border-bottom:  solid 1px #cccccc;}
.t_layout4 td{height:35px; border-bottom: 1px solid #cccc;}
.t_layout4 tbody{

    width:650px;
	max-height: 380px;
	height: 380px;
	overflow-y: auto;
	box-sizing: border-box;
}

.t_layout4{border-collapse:collapse; width:550px;}
.t_layout4 thead{float:left; width:550px;}
.t_layout4 thead tr{ width:550px;}

.t_layout4 tbody{overflow-y:auto; overflow-x:hidden; float:left; width:550px; height:250px; border-bottom: 1px solid #ddd;}
.t_layout4 tbody tr{display:table; width:550px;}

.t_layout4 thead tr th:nth-child(1){width:85px; text-align: center;}
.t_layout4 tbody tr td:nth-child(1){width:85px; padding-left: 10px; box-sizing: border-box; text-align: center;}

.t_layout4 thead tr th:nth-child(2){width:475px; text-align: center;}
.t_layout4 tbody tr td:nth-child(2){width:475px; box-sizing: border-box;
}
