@CHARSET "utf-8";

@import url('../css/layout.css?ver=20221208_001');
@import url('../css/contents.css?ver=202221227_001');

@import url('https://fonts.googleapis.com/css?family=Roboto:400,500,700');
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:600');

@font-face {
	font-family : 'Noto Sans KR';
	font-style: normal;
	font-weight: 400;
	src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype');
			}

@font-face {
	font-family : 'Noto Sans KR';
	font-style: normal;
	font-weight: 500;
	src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');
			}

@font-face {
	font-family : 'Noto Sans KR';
	font-style: normal;
	font-weight: 700;
	src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');
			}

html, body{width:100%;font-family:'Roboto', 'Noto Sans KR', Tahoma, Geneva, sans-serif;font-size:13px;line-height:1.7;color:#282828;}

/** 2022.07.15  haena  [대마도 쾌속선 신규 구축] 수정내용 */
body {
    position: relative;
}

/* margin */
html,body,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,big,cite,code,del,dfn,em,font,img,ins,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,ul,ol,li,dl,dt,dd,table,caption,tbody,tfoot,thead,tr,th,td,fieldset,form,label,legend,input,button,textarea,select{margin:0}

/* padding */
html,body,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,big,cite,code,del,dfn,em,font,img,ins,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,ul,ol,li,dl,dt,dd,table,caption,tbody,tfoot,thead,tr,th,td,fieldset,form,label,legend,input,button,textarea,select{padding:0}

/* display */
/* header,footer,section,article,aside,nav, */hgroup,details,menu,figure,figcaption{display:block;margin:0;padding:0}
/* strong,em,span,wbr{display:inline-block} */

/* hidden */
legend{display:block;overflow:hidden;position:absolute;width:1px;height:1px;font-size:1px;line-height:0;text-indent:-999em;white-space:nowrap}

/* reset border */
fieldset,img,table,caption,tbody,tfoot,thead,tr,th,td,button,hr{border:0 none}

/* font type */
address,caption,cite,code,dfn,em,th,var{font-style:normal}
blockquote,q{quotes:none}
ins{text-decoration:none}
del{text-decoration:line-through}

/* align */
img{vertical-align:middle;width:100%;}
.clear:after{content:"";display:block;clear:both}
.fl{float:left !important}
.fr{float:right !important}
.fn{float:none !important}
.cb{clear:both !important}
.tl{text-align:left !important}
.tc{text-align:center !important}
.tr{text-align:right !important}
.db{display:block !important}
.dib{display:inline-block !important}
.di{display:inline !important}
.vat{vertical-align:top !important}

/* Etc */
wbr:after{content:'\00200B'}
wbr{display:block\9;width:0;height:0;margin:0;padding:0}

/* ol{padding:0;margin-left:25px} */
*+html body li{vertical-align:top}

/* list Style */
ul li{list-style:none}

/* table */
table{border-collapse:collapse;}
caption{visibility:hidden;overflow:hidden;width:0;height:0;font-size:0;line-height:0;}
caption.safari{display:none}

/* blind */
.blind{overflow:hidden;position:absolute;left:0;top:0;z-index:-1;width:0;height:0;font-size:0;line-height:0;text-indent:-999em}

a{color:#111;text-decoration:none;}

/* form (input/select) */
select{overflow:visible;height:34px;padding:5px 25px 5px 3px;border:1px solid #dbdcde;font-family:'Roboto','Noto Sans KR';font-size:13px;color:#4e4e4e;border-radius:0px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#fff url(../../images/icon/icon_selectbox_arrow.png) no-repeat 90% 50%;background-size: 8px}
select::-ms-expand {display:none;}

.item{position:relative;}
.item input[type="radio"],
.item input[type="checkbox"]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}
.item input[type="radio"] + label{display:inline-block;position:relative;height:34px;line-height:34px;padding-left:30px;font-size:15px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;}
.item input[type="checkbox"] + label{display:inline-block;position:relative;height:34px;line-height:34px;padding-left:38px;font-size:15px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;}
.item input[type="radio"] + label:before{content:'';position:absolute;left:0;top:8px;width:16px;height:16px;text-align:center;background:#fff;border:1px solid #e4e5e6;border-radius:100%;}
.item input[type="checkbox"] + label:before{content:'';position:absolute;left:0;top:1px;width:28px;height:28px;line-height:14px;text-align:center;background:#fff;border:2px solid #e2e2e2;}
.item input[type="radio"] + label:active:before,
.item input[type="radio"]:checked + label:before{content:"●";font-size:11px;line-height:17px;vertical-align:middle;color:#f99d1c;background:#fff;border-color: #f99d1c;}
.item input[type="checkbox"] + label:active:before,
.item input[type="checkbox"]:checked + label:before{content:'\2714';font-size:28px;line-height:28px;font-weight:300;color:#f99d1c;background:#fff;}



.item input[type="file"]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}
.item label.fileLabel{display:inline-block;height:38px;margin-left:3px;padding:0 18px;line-height:38px;color:#323232;background:#fff;border:2px solid #323232;cursor:pointer;vertical-align:middle;}
.item .uploadName{display:inline-block;width:368px;height:20px;padding:10px;font-size:14px;font-family:inherit;line-height:normal;vertical-align:middle;color:#282828;background:#f4f5f6;border:1px solid #cfd1d6;-webkit-appearance:none;-moz-appearance:none;appearance:none;}
.item span{display:inline-block;margin-left:10px;color:#b4b4b4}
input[type="text"],input[type="tel"],input[type="number"],input[type="email"],
input[type="password"]{width:201px;height:34px;padding:2px 0 0 5px;border:1px solid #dbdcde; font-family: inherit;-moz-border-radius: 0; -webkit--border-radius: 0;border-radius: 0;}  /** 2022.08.08 haena [대마도 쾌속선 신규 구축] 버튼에 맞춰 height 수정 border-raidus 제거*/
input[type="text"]::placeholder{color:#a5a5a5;font-size:13px}

textarea{font-family:inherit;}
/* label{cursor:pointer;font-size:15px} 
input[type="radio"], input[type="checkbox"]{display:inline-block;width:20px;height:20px;vertical-align:middle;-webkit-appearance:none;border-radius:0;border:0;margin:0 4px 0 0;padding:0;cursor:pointer;background:url(../../images/common/bg_input.png) no-repeat 0 0;}
input[type="checkbox"]{background-position:0 0;}
input[type="checkbox"]:checked{background-position:0 -20px;}
input[type="radio"]{background-position:-20px 0;}
input[type="radio"]:checked{background-position:-20px -20px;}
 */
/* input[type="checkbox"]:disabled, input[type="radio"]:disabled{background-position:0 -50px;}
input[type="checkbox"]:disabled:checked, input[type="radio"]:disabled:checked{background-position:0 -75px;}
 */ 
 
/* color */
.colGray{color:#b4b4b4 !important}
.colGray02{color:#8a8a8a !important}
.colGray03{color:#adadad !important}
.colOrange{color:#f99d1c !important}
.colNavy{color:#292c6b !important}
.colPink{color:#ff7373 !important}

/* width */
.w50{width:50px !important}
.w60{width:60px !important}
.w70{width:70px !important}
.w80{width:80px !important}
.w85{width:85px !important}
.w95{width:95px !important}
.w105{width:105px !important}
.w119{width:119px !important}
.w120{width:120px !important}
.w130{width:130px !important}
.w140{width:140px !important}
.w180{width:180px !important}
.w204{width:204px !important}
.w208{width:208px !important}
.w210{width:210px !important}
.w220{width:220px !important}
.w240{width:240px !important}
.w260{width:260px !important}
.w280{width:280px !important}
.w293{width:293px !important}
.w485{width:485px !important}
.w775{width:775px !important}
.w100{width: 100% !important;}

/* margin */
.mg0{margin:0 !important}
.mgt0{margin-top:0 !important}
.mgt5{margin-top:5px !important}
.mgt10{margin-top:10px !important}
.mgt15{margin-top:15px !important}
.mgt20{margin-top:20px !important}
.mgt25{margin-top:25px !important}
.mgt30{margin-top:30px !important}
.mgt35{margin-top:35px !important}
.mgt40{margin-top:40px !important}
.mgt45{margin-top:45px !important}
.mgt50{margin-top:50px !important}
.mgt55{margin-top:55px !important}
.mgt60{margin-top:60px !important}
.mgt65{margin-top:65px !important}
.mgt70{margin-top:70px !important}
.mgt75{margin-top:75px !important}
.mgt80{margin-top:80px !important}
.mgt85{margin-top:85px !important}
.mgt90{margin-top:90px !important}
.mgt95{margin-top:95px !important}
.mgt100{margin-top:100px !important}
.mgb0{margin-bottom:0 !important}
.mgb5{margin-bottom:5px !important}
.mgb10{margin-bottom:10px !important}
.mgb15{margin-bottom:15px !important}
.mgb20{margin-bottom:20px !important}
.mgb25{margin-bottom:25px !important}
.mgb30{margin-bottom:30px !important}
.mgb35{margin-bottom:35px !important}
.mgb40{margin-bottom:40px !important}
.mgb45{margin-bottom:45px !important}
.mgb50{margin-bottom:50px !important}
.mgb55{margin-bottom:55px !important}
.mgb60{margin-bottom:60px !important}
.mgb65{margin-bottom:65px !important}
.mgb70{margin-bottom:70px !important}
.mgb75{margin-bottom:75px !important}
.mgb80{margin-bottom:80px !important}
.mgb85{margin-bottom:85px !important}
.mgb90{margin-bottom:90px !important}
.mgb95{margin-bottom:95px !important}
.mgb100{margin-bottom:100px !important}
.mgr0{margin-right:0 !important}
.mgr5{margin-right:5px !important}
.mgr10{margin-right:10px !important}
.mgr15{margin-right:15px !important}
.mgr20{margin-right:20px !important}
.mgr25{margin-right:25px !important}
.mgr30{margin-right:30px !important}
.mgr35{margin-right:35px !important}
.mgr40{margin-right:40px !important}
.mgr45{margin-right:45px !important}
.mgr50{margin-right:50px !important}
.mgr55{margin-right:55px !important}
.mgr60{margin-right:60px !important}
.mgr65{margin-right:65px !important}
.mgr70{margin-right:70px !important}
.mgr75{margin-right:75px !important}
.mgr80{margin-right:80px !important}
.mgr85{margin-right:85px !important}
.mgr90{margin-right:90px !important}
.mgr95{margin-right:95px !important}
.mgr100{margin-right:100px !important}
.mgl0{margin-left:0 !important}
.mgl5{margin-left:5px !important}
.mgl8{margin-left:8px !important}
.mgl10{margin-left:10px !important}
.mgl15{margin-left:15px !important}
.mgl20{margin-left:20px !important}
.mgl25{margin-left:25px !important}
.mgl30{margin-left:30px !important}
.mgl35{margin-left:35px !important}
.mgl40{margin-left:40px !important}
.mgl45{margin-left:45px !important}
.mgl50{margin-left:50px !important}
.mgl55{margin-left:55px !important}
.mgl60{margin-left:60px !important}
.mgl65{margin-left:65px !important}
.mgl70{margin-left:70px !important}
.mgl75{margin-left:75px !important}
.mgl80{margin-left:80px !important}
.mgl85{margin-left:85px !important}
.mgl90{margin-left:90px !important}
.mgl95{margin-left:95px !important}
.mgl100{margin-left:100px !important}

/* padding */
.pd0{padding:0 !important}
.pd10{padding:10px !important}
.pd30{padding:30px !important}
.pdtb0{padding-top:0 !important;padding-bottom:0 !important}
.pdrl0{padding-right:0 !important;padding-left:0 !important}
.pdt0{padding-top:0 !important}
.pdt5{padding-top:5px !important}
.pdt10{padding-top:10px !important}
.pdt15{padding-top:15px !important}
.pdt20{padding-top:20px !important}
.pdt25{padding-top:25px !important}
.pdt30{padding-top:30px !important}
.pdt35{padding-top:35px !important}
.pdt40{padding-top:40px !important}
.pdt45{padding-top:45px !important}
.pdt50{padding-top:50px !important}
.pdt55{padding-top:55px !important}
.pdt60{padding-top:60px !important}
.pdt65{padding-top:65px !important}
.pdt70{padding-top:70px !important}
.pdt75{padding-top:75px !important}
.pdt80{padding-top:80px !important}
.pdt85{padding-top:85px !important}
.pdt90{padding-top:90px !important}
.pdt95{padding-top:95px !important}
.pdt100{padding-top:100px !important}
.pdb0{padding-bottom:0 !important}
.pdb5{padding-bottom:5px !important}
.pdb10{padding-bottom:10px !important}
.pdb15{padding-bottom:15px !important}
.pdb20{padding-bottom:20px !important}
.pdb25{padding-bottom:25px !important}
.pdb30{padding-bottom:30px !important}
.pdb35{padding-bottom:35px !important}
.pdb40{padding-bottom:40px !important}
.pdb45{padding-bottom:45px !important}
.pdb50{padding-bottom:50px !important}
.pdb55{padding-bottom:55px !important}
.pdb60{padding-bottom:60px !important}
.pdb65{padding-bottom:65px !important}
.pdb70{padding-bottom:70px !important}
.pdb75{padding-bottom:75px !important}
.pdb80{padding-bottom:80px !important}
.pdb85{padding-bottom:85px !important}
.pdb90{padding-bottom:90px !important}
.pdb95{padding-bottom:95px !important}
.pdb100{padding-bottom:100px !important}
.pdr0{padding-right:0 !important}
.pdr5{padding-right:5px !important}
.pdr10{padding-right:10px !important}
.pdr15{padding-right:15px !important}
.pdr20{padding-right:20px !important}
.pdr25{padding-right:25px !important}
.pdr30{padding-right:30px !important}
.pdr35{padding-right:35px !important}
.pdr40{padding-right:40px !important}
.pdr45{padding-right:45px !important}
.pdr50{padding-right:50px !important}
.pdr55{padding-right:55px !important}
.pdr60{padding-right:60px !important}
.pdr65{padding-right:65px !important}
.pdr70{padding-right:70px !important}
.pdr75{padding-right:75px !important}
.pdr80{padding-right:80px !important}
.pdr85{padding-right:85px !important}
.pdr90{padding-right:90px !important}
.pdr95{padding-right:95px !important}
.pdr100{padding-right:100px !important}
.pdl0{padding-left:0 !important}
.pdl5{padding-left:5px !important}
.pdl10{padding-left:10px !important}
.pdl15{padding-left:15px !important}
.pdl20{padding-left:20px !important}
.pdl25{padding-left:25px !important}
.pdl30{padding-left:30px !important}
.pdl35{padding-left:35px !important}
.pdl40{padding-left:40px !important}
.pdl45{padding-left:45px !important}
.pdl50{padding-left:50px !important}
.pdl55{padding-left:55px !important}
.pdl60{padding-left:60px !important}
.pdl65{padding-left:65px !important}
.pdl70{padding-left:70px !important}
.pdl75{padding-left:75px !important}
.pdl80{padding-left:80px !important}
.pdl85{padding-left:85px !important}
.pdl90{padding-left:90px !important}
.pdl95{padding-left:95px !important}
.pdl100{padding-left:100px !important}

/* jsjeon add */
.hand {
    cursor: pointer;
}

input[readonly], select[readonly] {
    background-color : #f6f6f6
}
/* end jsjeon add */

/*//////////////////////////////////////////////////////////////////// 
//  Media Queries
////////////////////////////////////////////////////////////////////*/

/* iPad Landscape */
@media only screen and (max-width:980px){
}
@media only screen and (max-width:768px){
}
@media only screen and (max-width:650px){
}

@media only screen and (max-width:480px){
}

/**
  개인정보 수집 동의서 관련 CSS
*/

/* 테이블 */
.table-box{font-size: 12px;width: 100%;letter-spacing: -0.5px;text-align: center;}
.table-box th {padding: 8px 4px;background: #7a7a7a;color: white;border-right: 1px dashed #868686;}
.table-box td{padding: 8px 4px;border-right: 1px dashed #d8d8d8;border-bottom: 1px solid #7a7a7a;background: #fff;}
.table-box th:last-child{border: none;}
.table-box td:last-child{border-right: none;}
.table-list li{position: static !important;}

.smallTxt{font-size: 12px;letter-spacing: -1px;color: #888;}
i.i-list {font-style: normal;font-size: 4px;color: #FA9D18;padding: 3px;}

/* 동의박스 */
.agree-box {
    display: flex;
    font-size: 14px;
    border: 1px solid #EEEEEE;
    align-items: center;
    padding: 17px;
    background: #fff;
    box-shadow: 0px 2px 10px 0px #f5f5f5;
}
.agree-box>p>strong {color: #FA9D18;padding: 10px;font-size: 15px;}
.agree-box>.bxAgreeChk {margin: 0;margin-left: auto;}

/* 라디오버튼 */
.item2{position:relative;}
.item2 input[type="radio"],.item2 input[type="checkbox"]{
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    border:0;
}

.item2 input[type="radio"] + label{
    display:inline-block;
    position:relative;
    height:34px;
    line-height:34px;
    padding-left:34px;
    margin-left: 12px;
    font-size:15px;
    cursor:pointer;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
}

.item2 input[type="radio"] + label:before{
    content:'';
    position:absolute;
    left:0;
    top:1px;
    width:24px;
    height:24px;
    line-height:14px;
    text-align:center;
    background:#fff;
    border:2px solid #e2e2e2;
}

.item2 input[type="radio"] + label:active:before,.item2 input[type="radio"]:checked + label:before{
    content:'\2714';
    font-size:24px;
    line-height:24px;
    font-weight:300;
    color:#f99d1c;
    background:#fff;
    border-color: #f99d1c;
}

.desc2{text-align: center;color: #222;font-size: 15px;}

/* 모달,캔버스 */
.signature-sign {display: inline-flex;align-items: center;}
.modal-openBtn {
    font-family: inherit;
    padding: 8px;
    margin-left: 8px;
    border: 1px solid #CECECE;
    cursor: pointer;
}
.modal-closeBtn{cursor: pointer;}
.modal-header {
    position: absolute;
    top: -41px;
    width: 100%;
    display: flex;
    background: #FA9D18;
    padding: 8px;
    text-align: left;
    color: #fff;
    font-size: 15px;
    font-weight: bold;
    box-sizing: border-box;
}
.modal-header p {padding: 0 8px;}
.modal-closeBtn {
    margin-left: auto;
    background: none;
    color: #fff;
    padding: 0 8px;
    font-size: 18px;
}
.modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
 }
.modal .bg {width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.6);}
.modalBox {position: absolute;background-color: #fff;}
.hidden {display: none;}
 canvas#drawCanvas {border: 1px solid #BDBDBD;}
.canvas-button {text-align: center;padding: 10px;}
.canvas-button a {
    display: inline-block;
    height: 24px;
    padding: 1px 15px;
    font-size: 14px;
    text-align: center;
    color: #a6a6a6;
    background: #fff;
    border: 1px solid #b7b7b7;
    border-radius: 2px;
}
a.canvas-save {background: #fa9d18;color: #fff;border-color: #fa9d18;}

@media all and (max-width:650px){
    .agree-box{padding: 10px;}
    .agree-box>.bxAgreeChk{display: inline-grid;text-align: left;}
    .agree-box p{display: inline-grid;text-align: left;}
    .agree-box>p>strong {padding: 0px;}
    .smallTxt{text-align: left;}
}