@charset "UTF-8";

.ally {position:absolute; left:0; width:0; height:0; overflow:hidden; clip:rect(1px, 1px, 1px, 1px)}

.skip-navigation {position:relative; top:0; left:0; height:0; font-size:0; z-index:999999}
.skip-navigation a {left:-30000%; position:absolute; font-size:12px}
.skip-navigation a:hover, .skip-navigation a:active, .skip-navigation a:focus {display:block; left:0}

/* 폼(공통?) */
.ui-group-radio {display:inline-block; overflow:hidden; border-bottom-left-radius:10px; background-color:#fff;}
.ui-group-radio:after {content:''; display:block; clear:both;}
.ui-group-radio .radio {float:left; position:relative}
.ui-group-radio .radio label {float:left; padding:0 45px; line-height:40px; font-size:1.5rem; color:#717171}
.ui-group-radio .radio input {position:absolute; left:0; top:0; width:100%; height:100%; cursor:pointer; opacity:0}
.ui-group-radio .radio input:checked + label {background:#e1141c; color:#fff}
.ui-group-radio .radio ~ .radio label {border-bottom-left-radius:10px}
.ui-input-text {display:block; width:100%; height:36px; padding:0 10px; font-size:1.5rem; color:#717171; border:1px solid #eee; background-color:#fff; border-radius:3px;}
.ui-input-text:read-only {background:#e5e5e5}
textarea.ui-input-text {height:auto; min-height:160px; padding:8px 10px; line-height:25px}
.ui-select-basic {display:inline-block; border:1px solid #eee; background-color:#fff; border-radius:3px}
.ui-select-basic select {display:block; width:100%; height:34px; padding:0 30px 0 10px; font-size:1.5rem; color:#717171; border:0; -webkit-appearance:none; appearance: none; background: url(../../pc-eng/images/common/bg-select.png) calc(100% - 10px) 50% no-repeat; background-size:12px auto;}
.ui-input-radio {display:inline-block; position:relative;}
.ui-input-radio label {display:block; padding-left:30px; line-height:20px; font-size:1.5rem; font-weight:normal;}
.ui-input-radio input {position:absolute; left:0; top:0; width:100%; height:100%; cursor:pointer; opacity:0}
.ui-input-radio label:before {content:''; position:absolute; left:0; top:0; width:18px; height:18px; border:1px solid #dedede; background-color:#fff; border-radius:100%;}
.ui-input-radio label:after {content:''; display:none; position:absolute; left:5px; top:5px; width:10px; height:10px; background-color:#e1141c; border-radius:100%;}
.ui-input-radio input:checked + label:after {display:block}
.ui-input-checkbox {position:relative}
.ui-input-checkbox input {position:absolute; left:-9999px}
.ui-input-checkbox input + label {padding-left:20px; line-height:20px; font-size:20px; font-weight:400}
.ui-input-checkbox input + label:after {content:""; position:absolute; top:2px; left:0; width:15px; height:15px;  border:1px solid #ddd}
.ui-input-checkbox input:checked + label {}
.ui-input-checkbox input:checked + label:after {background:#0b4da2 url(../../pc-eng/images/common/btn-ckeck-on.png) center center no-repeat; background-size:10px auto; }
.ui-input-checkbox + a {display:inline-block; margin-left:30px; color:#717171; font-size:14px; font-weight:400; line-height:1.8em}

@media (max-width:640px) {
    .ui-input-text {height:40px; border-radius:4px;}
    textarea.ui-input-text {height:auto}
    .ui-select-basic {border-radius:4px;}
    .ui-select-basic select {height:38px; font-size:1.3rem}
}


.wrap-address {position:relative; width:100%}
.wrap-address:after {content:''; display:block; clear:both;}
.wrap-address .ui-address-btn {float:left; width:100px}
.wrap-address .ui-address-btn .input {position: absolute; left:0; top:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.wrap-address .ui-address-btn .label {display:block; line-height:36px; text-align:center; font-size:1.5rem; color:#fff; border-bottom-left-radius:8px; background-color:#555}

.wrap-address .addressed {float:right; width:calc(100% - 110px)}
.wrap-address .addressed .list:after {content:""; display:block; clear:both}
.wrap-address .addressed .list li {position:relative; float:left; border-radius:3px; background-color:#e5e5e5;}
.wrap-address .addressed .list li:nth-of-type(1) {width:180px}
.wrap-address .addressed .list li:nth-of-type(2) {margin-left:10px; width:calc(100% - 190px)}
.wrap-address .addressed .list li:nth-of-type(3) {margin-top:10px; width:100%}

.wrap-attach {position:relative; width:100%; padding-bottom:55px}
.wrap-attach:after {content:''; display:block; clear:both;}
.wrap-attach .ui-attach-btn {float:left; width:100px}
.wrap-attach .ui-attach-btn .input {position: absolute; left:0; top:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.wrap-attach .ui-attach-btn .label {display:block; line-height:36px; text-align:center; font-size:1.5rem; color:#fff; border-bottom-left-radius:8px; background-color:#555}
.wrap-attach .attatched {float:right; width:calc(100% - 110px)}
.wrap-attach .attatched .list li {position:relative; padding-right:46px; border-radius:3px; background-color:#e5e5e5;}
.wrap-attach .attatched .list li ~ li {margin-top:8px}
.wrap-attach .attatched .list li:last-child {margin-bottom:15px;}
.wrap-attach .attatched .list li .del {position: absolute; right:0; top:0; width:36px; height:36px; border:0; background:url(../../pc-eng/images/common/ico-delete.png) 50% 50% no-repeat; background-size:8px 8px;}
.wrap-attach .attatched .list li span {display:block; height:36px; padding:0 0 0 14px; line-height:36px; font-size:1.3rem; color:#e1141c; overflow:hidden;}
.wrap-attach .attatched .note {font-size:1.3rem; line-height:18px; color:#717171; text-align: left; padding-left:1em; text-indent:-1em;}
/* .wrap-attach > a {display:inline-block; margin-top:15px; margin-left:110px; min-width:210px; color:#fff; font-size:15px; line-height:40px; text-align:center; background:#e1141c; border-bottom-left-radius:10px} */
.wrap-attach > a {display:inline-block; position:absolute; bottom:0; left:110px; min-width:210px; color:#fff; font-size:15px; line-height:40px; text-align:center; background:#e1141c; border-bottom-left-radius:10px}
.wrap-form .note-req {margin-top:-11px; margin-bottom:14px; text-align:center}
.wrap-form .note-req .note {display:inline-block; padding:0 32px; line-height:22px; font-size:1.3rem; font-weight:normal; color:#fff; background-color:#e1141c;}
.wrap-form .group-form {padding:54px 0}
.wrap-form .group-form ~ .group-form {border-top:1px dashed #ddd}
.wrap-form .group-form:after {content:''; display:block; clear:both;}
.wrap-form .group-form h3 {float:left; width:200px; padding:5px 0; line-height:36px; text-align:left; font-size:2rem; font-weight:500;}
.wrap-form .ui-button-submit {display:block; width:300px; margin:20px auto 0; border:0; border-bottom-left-radius:10px; background-color:#e1141c; color:#fff; font-size:2rem; line-height:50px; cursor:pointer}
.group-form .tbl-form {float:left; width:calc(100% - 200px);}
.group-form .tbl-form tr th {width:160px; padding:5px 0; line-height:36px; font-size:1.6rem; color:#717171; font-weight:normal; text-align:left;}
.group-form .tbl-form tr th .req {padding-left:.6rem; font-size:1.6rem; color:#e1141c; font-weight:normal;}
.group-form .tbl-form tr td {padding:5px 0; vertical-align:middle; font-size:1.5rem; color:#717171}
.group-form .tbl-form tr td .ui-input-radio ~ .ui-input-radio {margin-left:36px;}
.group-form .tbl-form tr td .unit {display:inline-block; padding:0 10px; line-height:36px; font-size:1.5rem; font-weight:normal; text-align:center;}
.group-form .tbl-form tr td.row-email > * {float:left}
.group-form .tbl-form tr td.row-email .ui-input-text {width:30%}
.group-form .tbl-form tr td.row-email .unit.email {width:36px; padding:0}
.group-form .tbl-form tr td.row-email .ui-select-basic {float:right; width:calc(40% - 47px)}
.group-form .tbl-form tr td.row-phone > * {float:left; width:135px}
.group-form .tbl-form tr td.row-phone > * ~ * {margin-left:10px}
.group-form .tbl-form tr td.row-address > span,
.group-form .tbl-form tr td.row-address > input {float:left; width:calc((100% - 10px) / 2)}
.group-form .tbl-form tr td.row-address > * ~ * {margin-left:10px}
.group-form .tbl-form tr td.row-disabled > * {float:left}
.group-form .tbl-form tr td.row-disabled .ui-select-basic {width:38%}
.group-form .tbl-form tr td.row-disabled .ui-select-basic:nth-of-type(1) {margin-right:10px; width:22%}
.group-form .tbl-form tr td.row-disabled .ui-input-text {width:calc(40% - 44px)}
.group-form .tbl-form tr td.row-num > * {float:left}
.group-form .tbl-form tr td.row-num > input {width:135px}
.group-form .tbl-form tr td.row-type span:last-child {display:inline-block; margin-left:15px; width:calc(100% - 338px)}
.group-form .tbl-form tr td.row-type span:last-child input {width:100%}
.group-form.agree .tbl-form tr td {padding:10px 0}

@media (max-width:845px) {
    .group-form .tbl-form tr td.row-phone > * {width:calc((100% - 20px) / 3)}
}
@media (max-width:800px) {
    .ui-input-checkbox + a {float:right; line-height:20px}
    .wrap-form .group-form {padding:35px 0}
    .wrap-form .group-form h3 {float:none; margin-bottom:10px;}
    .group-form .tbl-form {float:none; width:100%}
}

@media (max-width:640px) {
    .ui-input-text,
    .ui-input-radio label {font-size:1.3rem;}
    .ui-group-radio .radio label {padding:0 30px}
    .ui-input-checkbox input + label {font-size:15px}
	.ui-input-checkbox + a {margin-left:0px}
    .group-form .tbl-form tr.no-reflow td {text-align:right;}
    .group-form .tbl-form tr:not(.no-reflow) th,
    .group-form .tbl-form tr:not(.no-reflow) td {display:block}
    .group-form .tbl-form tr th {width:auto}
    .group-form .tbl-form tr th,
    .group-form .tbl-form tr td {font-size:1.3rem;}
    .group-form .tbl-form tr th .req {font-size:1.3rem;}
    .group-form .tbl-form tr td.row-email .ui-input-text {width:calc(100% - 20px)}
    .group-form .tbl-form tr td.row-email .unit.email {width:20px; text-align:right;}
    .group-form .tbl-form tr td.row-email .ui-input-text ~ .ui-input-text,
    .group-form .tbl-form tr td.row-email .ui-input-text ~ .ui-select-basic {width:calc(50% - 5px); margin-top:10px}
    .group-form .tbl-form tr td.row-phone > * {width:calc(calc(100% - 20px) / 3)}
    .wrap-address .addressed .list li {float:none; width:100%}
    .wrap-address .addressed .list li:nth-of-type(1) {width:100%}
    .wrap-address .addressed .list li:nth-of-type(2) {margin-left:0; margin-top:10px; width:100%}
    .wrap-attach .ui-attach-btn .input {font-size:1.1rem;}
    .wrap-attach .ui-attach-btn .label,
    .wrap-attach .attatched .list li span {font-size:1.3rem;}
	.wrap-attach .attatched .note {font-size:11px}
    .wrap-attach > a {margin-left:0; min-width:170px; line-height:50px}
    .wrap-form .ui-button-submit {width:100%; font-size:18px}
    .wrap-form .group-form {padding:30px 0}
    .wrap-form .group-form h3 {line-height:normal; padding:0}
    .group-form .tbl-form tr td .ui-input-radio {width:130px}
    .group-form .tbl-form tr td .ui-input-radio ~ .ui-input-radio {margin-left:0}
    .group-form .tbl-form tr td .ui-input-radio {margin-bottom:30px}
	.group-form .tbl-form tr td.row-disabled .ui-select-basic {width:100%}
	.group-form .tbl-form tr td.row-disabled .ui-select-basic:nth-of-type(1) {margin-bottom:10px; width:48%}
	.group-form .tbl-form tr td.row-disabled .ui-input-text {width:calc(52% - 44px)}
	.group-form .tbl-form tr td.row-num > input {width:calc(100% - 47px)}
	.group-form .tbl-form tr td.row-type span:last-child {margin-left:0; width:calc(100% - 133px)}

}

@media (max-width:360px) {
    .ui-input-checkbox + a {float:left; margin-left:35px; margin-top:10px}
}

.ui-popup {display:none; position:fixed; left:0; top:0; width:100%; height:100%; z-index:1000; background-color:rgba(0,0,0,.6); /* text-align:center */}
.ui-popup.active {display:block}
.ui-popup:after {content:""; display:inline-block; width:0; height:100%; vertical-align:middle;}
.ui-popup .ui-popup-container {display:inline-block; position:relative; height:calc(100vh - 169px); width:1000px; padding-top:80px; vertical-align:middle; text-align:left; background-color:#fff;}
.ui-popup .ui-popup-header {position:absolute; top:0; left:0; width:100%; height:80px; padding-left:30px; padding-top:25px}
.ui-popup .ui-popup-header .ui-popup-title {color:#000; font-size:3rem; font-weight:500;}
.ui-popup .ui-popup-content {height:100%; overflow-x:hidden; overflow-y:auto; font-size:1.5rem; line-height:1.666em; color:#717171}
.ui-popup .ui-popup-close {position:absolute; right:30px; top:26px; width:30px; height:30px; border:0; background:url(../../pc-eng/images/common/btn-close-black.png) 50% 50% no-repeat; background-size:cover;}

/* @media (max-width:1200px) {
    .ui-popup .ui-popup-container {width:calc(100% - 100px)}
}
@media (max-width:1024px) {
    .ui-popup .ui-popup-container {width:calc(100% - 60px)}
}
@media (max-width:800px) {
    .ui-popup .ui-popup-container {width:calc(100% - 40px); padding-top:65px}
    .ui-popup .ui-popup-header {height:65px; padding:21px 20px}
    .ui-popup .ui-popup-header .ui-popup-title  {font-size:1.8rem;}
    .ui-popup .ui-popup-content-inner {padding:21px 20px}
    .ui-popup .ui-popup-close {top:12px; right:10px; width:38px; height:38px;}

} */