@charset "UTF-8";
* { margin: 0; padding: 0; vertical-align: baseline; box-sizing: border-box; }

::before, ::after { box-sizing: border-box; }

/* HTML5 display-role reset for older browsers */
body { line-height: 1; font-family:"vw-text","Noto","Apple SD Gothic Neo", "Malgun Gothic", "맑은 고딕", Dotum, 돋움, sans-serif; font-weight: 400; font-size: 14px; color: #000000; }

button { line-height: 1; font-family: "vw-text","Noto", "Apple SD Gothic Neo", "Malgun Gothic", "맑은 고딕", Dotum, 돋움, sans-serif; font-weight: 400; font-size: 14px; color: #000000; background: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; display: block; }

h1, h2, h3, h4, h5, h6 { font-size: 0; font-weight: 400; color: #000000; }

strong { font-weight: 700; }

/* 테이블 스타일 초기화 */
table { width: 100%; border-collapse: collapse; border-spacing: 0; empty-cells: show; table-layout: fixed; }

th, td { font-weight: 400; }

td { word-wrap: break-word; word-break: keep-all; }

fieldset { border: 0; margin: 0; padding: 0; }

legend, caption { visibility: hidden; overflow: hidden; width: 0; height: 0; font-size: 0; line-height: 0; }

address, caption, em, var { font-style: normal; font-weight: 400; }

/* 링크 */
a { color: #555; text-decoration: none; }

/* 이미지, 폼관련 요소 */
img { border: 0; max-width: 100%; vertical-align: top; }

label, select, input, textarea { vertical-align: middle; }

input, select, textarea { font-size: 1em; vertical-align: middle; -webkit-appearance: none; -webkit-border-radius: 0; }

input[type="text"], input[type="submit"], input[type="password"], input[type="search"], input[type="number"], input[type="reset"], input[type="email"], input[type="tel"], input[type="search"], input[type="file"], input[type="email"], input[type="tel"], textarea { width: 100%; border: 1px solid #c2cacf; height: 56px; box-sizing: border-box; padding: 0 20px; font-size: 14px; color: #000000; font-weight: 400; font-family: "VWHead","Apple SD Gothic Neo", "Malgun Gothic", "맑은 고딕", Dotum, 돋움, sans-serif; line-height: 56px; outline: none; }

input[type="submit"] { cursor: pointer; }

input[readonly] { background: #fff; color: #000; }

input:disabled { background: #fff; }

input[type="text"], input[type="password"] { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }

input[type="text"]::-ms-clear { width: 0; height: 0; display: none; }

select { border: 1px solid #c2cacf; padding: 0 20px; background: #fff; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; outline: none; font-weight: 400; font-family: "VWHead","Apple SD Gothic Neo", "Malgun Gothic", "맑은 고딕", Dotum, 돋움, sans-serif; color: #000000; width: 100%; height: 56px; line-height: 56px; font-size: 14px; }

select::-ms-expand { display: none; }

option.title { display: none; }

textarea { border: solid 1px #c2cacf; height: auto; box-sizing: border-box; padding: 20px; width: 100%; border-radius: 0; overflow: auto; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

button { border: 0; box-shadow: none; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

button:focus, button:hover { outline: none; }

input[type="radio"], input[type="checkbox"] { position: absolute; top: 0; left: 0; opacity: 0; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; }

input::-webkit-input-placeholder { color: #96a3a8; font-weight: 300; }

input::-moz-placeholder { color: #96a3a8; font-weight: 300; }

input::-ms-input-placeholder { color: #96a3a8; font-weight: 300; }

input::-webkit-input-placeholder { color: #96a3a8; font-weight: 300; }

input:-moz-placeholder { color: #96a3a8; font-weight: 300; }

input:-ms-input-placeholder { color: #96a3a8; font-weight: 300; }

input::-ms-input-placeholder { color: #96a3a8; font-weight: 300; }

input::placeholder { color: #96a3a8; font-weight: 300; }

input::-ms-clear { display: none; }

input::-ms-reveal { display: none; }

textarea::-webkit-input-placeholder { color: #96a3a8; font-weight: 300; }

textarea::-moz-placeholder { color: #96a3a8; font-weight: 300; }

textarea::-ms-input-placeholder { color: #96a3a8; font-weight: 300; }

textarea::-webkit-input-placeholder { color: #96a3a8; font-weight: 300; }

textarea:-moz-placeholder { color: #96a3a8; font-weight: 300; }

textarea:-ms-input-placeholder { color: #96a3a8; font-weight: 300; }

textarea::-ms-input-placeholder { color: #96a3a8; font-weight: 300; }

textarea::placeholder { color: #96a3a8; font-weight: 300; }

input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder, input:focus::-moz-placeholder, textarea:focus::-moz-placeholder, input:focus::-ms-input-placeholder, textarea:focus::-ms-input-placeholder { color: transparent; }

.hidden { position: absolute; width: 0; height: 0; font-size: 0; line-height: 0; overflow: hidden; visibility: hidden; }

.t-l { text-align: left !important; }

.t-r { text-align: right !important; }

.t-c { text-align: center !important; }

[tabindex] { outline: none !important; }

/* Media */
@media (min-width: 960px) { body, button, input, select, textarea { font-size: 16px; } }

body.fixed { overflow: hidden; }

#wrap { position: relative; background: #fff; }

.container { padding-top: 100px; }

.container section { padding-bottom: 100px; }

.pc { display: none; }

.title-wrap { position: relative; margin-bottom: 100px; }

.title-wrap .title-type { font-size: 31px; font-weight: 700; line-height: 1.2; }

.title-wrap .title-type span { display: block; margin-top: 15px; font-size: 16px; font-weight: 400; line-height: 21px; }

.title-wrap.type2 { margin-bottom: 0; padding-bottom: 10px; border-bottom: 2px solid #000000; }

.title-wrap.type2 .title-type { font-size: 24px; }

.title-wrap.type3 { margin-bottom: 44px; }

.title-wrap.type3 .title-type { font-size: 44px; line-height: 52px; }

.title-wrap.type3 .title-type span { font-size: 17px; line-height: 31px; }

.title-wrap.type3 .title-type em { font-weight: 400; }

.title-wrap.type4 { margin-bottom: 0; padding-bottom: 20px; border-bottom: 2px solid #000000; }

.title-wrap.type4 .title-type { font-size: 44px; }

.title-wrap.type5 { margin-bottom: 55px; }

.title-wrap.type5 .title-type { font-size: 31px; }

.title-wrap.type6 { margin-bottom: 45px; }

.title-wrap.type6 .title-type { font-size: 24px; }

.title-wrap.type7 { margin-bottom: 0; padding-bottom: 20px; border-bottom: 2px solid #000000; }

.title-wrap.type7 .title-type { font-size: 20px; }

.title-wrap .side { position: absolute; bottom: 22px; right: 0; font-size: 0; }

.title-wrap .side [class^='btn-'] + [class^='btn-'] { margin-left: 5px; }

.tab-wrap .tab-type { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.tab-wrap .tab-type li { padding-left: 40px; border-bottom: 1px solid #c2cacf; }

.tab-wrap .tab-type li a { position: relative; display: inline-block; padding-bottom: 18px; font-size: 16px; color: #001e50; font-weight: 400; }

.tab-wrap .tab-type li:first-child { padding-left: 0; }

.tab-wrap .tab-type li.active a { font-weight: 700; }

.tab-wrap .tab-type li.active a:after { content: ''; display: block; position: absolute; left: 0; bottom: -1px; width: 100%; height: 2px; background: #001e50; }

.table-wrap { font-family: "Malgun Gothic", "맑은 고딕"; }

.table-wrap table { border-top: 2px solid #000000; border-bottom: 2px solid #cbd2d7; }

.table-wrap table th, .table-wrap table td { padding: 20px 0; font-size: 14px; }

.table-wrap table th { background: #f5f7f8; text-align: center; vertical-align: middle; }

.table-wrap table thead tr th, .table-wrap table tbody tr td { border-left: 1px solid #cbd2d7; border-bottom: 1px solid #cbd2d7; }

.table-wrap table thead tr th:first-child, .table-wrap table tbody tr td:first-child { border-left: none; }

.table-wrap table tbody tr td { padding: 20px 15px; line-height: 24px; }

.table-wrap table tbody tr td span { color: #00b0f0; }

.table-wrap.type2 table tbody tr th { border-bottom: 1px solid #cbd2d7; }

.table-wrap.type3 h4 { margin-bottom: 12px; font-size: 20px; font-weight: 700; }

.table-wrap.type3 table { border-bottom: 1px solid #c2cacf; }

.table-wrap.type3 table th, .table-wrap.type3 table td { padding: 20px 5px; background-color: #ffffff; font-size: 12px; vertical-align: middle; text-align: center; line-height: 17px; word-break: break-all; }

.table-wrap.type3 table thead tr th { border-left: 2px solid #000000; border-bottom: 2px solid #000000; }

.table-wrap.type3 table thead tr:first-child th:first-child { border-left: none; }

.table-wrap.type3 table tbody tr th, .table-wrap.type3 table tbody tr td { border-bottom: 1px solid #c2cacf; }

.table-wrap.type3 table tbody tr th { border-left: 1px solid #c2cacf; }

.table-wrap.type3 table tbody tr td { border-left: 2px solid #000000; }

.table-wrap.type3 table tbody tr:first-child th:first-child { border-left: none; }

.table-wrap.type3 table tbody tr .b-left-none{border-left:none}

.table-wrap.type3:nth-child(n+2) { margin-top: 45px; }

.text-list ul li { position: relative; padding-left: 10px; font-size: 14px; color: #999; line-height: 24px; letter-spacing: -0.3px; }

.text-list ul li:before { content: '-'; display: block; position: absolute; top: 0; left: 0; }

.text-list.type2 ul li { padding-left: 0; font-size: 17px; line-height: 27px; }

.text-list.type2 ul li:before { display: none; }

/* Media */
@media (min-width: 960px) { .container { padding-top: 130px; }
  .container section { padding-bottom: 130px; }
  .container section.type2 { padding-bottom: 160px; }
  .container.type2 { padding-top: 160px; }
  .pc { display: block; }
  .mo { display: none; }
  .title-wrap { margin-bottom: 160px; }
  .title-wrap .title-type { font-size: 48px; }
  .title-wrap .title-type span { margin-top: 24px; font-size: 20px; }
  .title-wrap.type2 { padding-bottom: 24px; }
  .title-wrap.type2 .title-type { font-size: 32px; }
  .title-wrap.type2 .title-type.type2 { font-size: 24px; }
  .title-wrap.type3 { margin-bottom: 68px; }
  .title-wrap.type3 .title-type { font-size: 60px; line-height: 50px; }
  .title-wrap.type3 .title-type span { display: inline-block; margin-top: 0; margin-left: 25px; font-size: 24px; }
  .title-wrap.type4 { margin-bottom: 0; padding-bottom: 24px; border-bottom: 2px solid #000000; }
  .title-wrap.type4 .title-type { font-size: 60px; font-weight: 700; }
  .title-wrap.type5 { margin-bottom: 50px; }
  .title-wrap.type5 .title-type { font-size: 48px; }
  .title-wrap.type6 { margin-bottom: 66px; }
  .title-wrap.type6 .title-type { font-size: 32px; }
  .title-wrap.type7 { padding-bottom: 25px; }
  .title-wrap.type7 .title-type { font-size: 32px; }
  .title-wrap .side { bottom: 24px; }
  .title-wrap .side [class^='btn-'] + [class^='btn-'] { margin-left: 12px; }
  .tab-wrap .tab-type li { padding-left: 70px; }
  .tab-wrap .tab-type li a { padding-bottom: 22px; font-size: 18px; }
  .table-wrap table th, .table-wrap table td { padding: 25px 0; font-size: 16px; }
  .table-wrap table tbody tr td { padding: 25px 50px; }
  .table-wrap.type3 h4 { margin-bottom: 20px; }
  .table-wrap.type3 table th, .table-wrap.type3 table td { padding: 24px 5px; font-size: 16px; line-height: 20px; }
  .table-wrap.type3:nth-child(n+2) { margin-top: 70px; }
  .text-list.type2 ul li { font-size: 24px; line-height: 36px; } }

.pop-layer { display: none; position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 900; }

.pop-layer .dim { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); }

.pop-layer .pop-wrap { position: absolute; top: 50%; left: 50%; z-index: 999; background: #fff; padding: 55px 15px; width: 90%; border-radius: 10px; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.pop-layer .pop-wrap .pop-title-wrap { padding-bottom: 45px; text-align: center; }

.pop-layer .pop-wrap .pop-title-wrap .pop-title { font-size: 16px; line-height: 1.2; }

.pop-layer .pop-wrap .pop-title-wrap .pop-title em { display: block; margin-bottom: 10px; font-size: 24px; font-weight: 700; }

.pop-layer .pop-wrap .pop-content { overflow: auto; overflow-x: hidden; max-height: 55vh; padding-right: 5px; padding-bottom: 1px; }

.pop-layer .pop-wrap .pop-content p { font-size: 14px; line-height: 1.4; }

.pop-layer .pop-wrap .pop-content u { font-size: 16px; }

.pop-layer .pop-wrap .pop-content span { display: block; font-size: 13px; }

.pop-layer .pop-wrap .pop-content::-webkit-scrollbar { width: 2px; background: none; }

.pop-layer .pop-wrap .pop-content::-webkit-scrollbar-thumb { background: #001e50; }

.pop-layer .pop-wrap .pop-content::-webkit-scrollbar-track { background: #dfe4e8; }

.pop-layer .btn-close { display: block; position: absolute; top: -40px; right: 0; width: 25px; height: 25px; font-size: 0; }

.pop-layer .btn-close:after, .pop-layer .btn-close:before { content: ''; display: block; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); background: #fff; }

.pop-layer .btn-close:after { width: 25px; height: 2px; }

.pop-layer .btn-close:before { width: 2px; height: 25px; }

.pop-layer.type2 .dim { background-color: #001e50; background-image: linear-gradient(#00437a, #001e50); }

.pop-layer.type2 .pop-wrap { padding: 0; width:80%}

.pop-layer.type2 .pop-wrap .pop-content { padding: 0; }

.pop-layer.type2 .pop-wrap .pop-content .txt-box { padding: 30px 15px 25px 15px; }

.pop-layer.type2 .pop-wrap .pop-content .txt-box h3 { margin-bottom: 20px; font-size: 24px; font-weight: 700; }

.pop-layer.type2 .pop-wrap .pop-content .txt-box p { font-size: 16px; line-height: 24px; }

.pop-layer.type2 .pop-wrap .pop-content .img-box { overflow: hidden; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; text-align:center}/*20210103 수정*/

/*.pop-layer.type2 .pop-wrap .pop-content .img-box img{width:100%}*/ /*20210103 수정*/

.pop-layer.type3 .dim { background-color: #001e50; background-image: linear-gradient(#00437a, #001e50); }

.pop-layer.type3 .pop-wrap { padding: 0; width: 100%; border-radius: 0; }

.pop-layer.type3 .pop-wrap .pop-content { padding: 0; max-height: none; }

.pop-layer.type3 .pop-wrap .pop-content .img-box img { width: 100%; }

.pop-layer.type3 .btn-wrap { position: absolute; top: 15px; right: 15px; font-size: 0; z-index: 999; }

.pop-layer.type3 .btn-wrap [class^='btn-'] { display: inline-block; }

.pop-layer.type3 .btn-wrap .btn-close { position: relative; top: 0; width: auto; height: auto; }

.pop-layer.type3 .btn-wrap .btn-close:before, .pop-layer.type3 .btn-wrap .btn-close:after { display: none; }

.pop-layer-sm { position: fixed; bottom: 0; right: 8.33333%; height: auto; z-index: 900; }

.pop-layer-sm .pop-wrap .pop-content { padding: 30px 45px; background: #001e50; text-align: center; }

.pop-layer-sm .pop-wrap .pop-content p { font-size: 16px; color: #ffffff; line-height: 50px; }

.pop-layer-sm .pop-wrap .pop-content p em { display: block; font-size: 30px; font-weight: 700; }

.pop-layer-sm .pop-wrap .pop-content .btn-wrap { margin-top: 27px; }

.pop-layer-sm .pop-wrap .btn-close { display: block; position: absolute; top: -40px; right: 0; width: 24px; height: 24px; font-size: 0; }

.pop-layer-sm .pop-wrap .btn-close:after, .pop-layer-sm .pop-wrap .btn-close:before { content: ''; display: block; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); background: #001e50; }

.pop-layer-sm .pop-wrap .btn-close:after { width: 24px; height: 2px; }

.pop-layer-sm .pop-wrap .btn-close:before { width: 2px; height: 24px; }

/* Media */
@media (min-width: 960px) { .pop-layer .pop-wrap { padding: 80px 106px; width: 80%; }
  .pop-layer .pop-wrap .pop-title-wrap { padding-bottom: 70px; }
  .pop-layer .pop-wrap .pop-title-wrap .pop-title { font-size: 18px; }
  .pop-layer .pop-wrap .pop-title-wrap .pop-title em { margin-bottom: 20px; font-size: 32px; }
  .pop-layer .pop-wrap .pop-content p { font-size: 16px; }
  .pop-layer .pop-wrap .pop-content u { font-size: 18px; }
  .pop-layer .pop-wrap .pop-content::-webkit-scrollbar { width: 3px; }
  .pop-layer.type2 .pop-wrap{width:640px}
  .pop-layer.type2 .pop-wrap .pop-content { max-height: 88vh; }
  .pop-layer.type2 .pop-wrap .pop-content .txt-box { padding: 50px 50px 40px 50px; }
  .pop-layer.type2 .pop-wrap .pop-content .txt-box h3 { margin-bottom: 30px; font-size: 32px; }
  .pop-layer.type2 .pop-wrap .pop-content .img-box { /*max-height: 530px;*/ overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}/*20210103 수정*/
  .pop-layer.type3 .btn-wrap { top: 30px; right: 30px; }
  .pop-layer-sm { right: 4.16667%; width: 360px; }
  .pop-layer-sm .pop-wrap .pop-content { padding: 55px 0; }
  .pop-layer-sm .pop-wrap .pop-content .btn-wrap { margin-top: 35px; }
  .pop-layer-sm .pop-wrap .btn-close { top: -52px; width: 22px; height: 22px; }
  .pop-layer-sm .pop-wrap .btn-close:after, .pop-layer-sm .pop-wrap .btn-close:before { content: ''; display: block; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); background: #001e50; }
  .pop-layer-sm .pop-wrap .btn-close:after { width: 22px; height: 2px; }
  .pop-layer-sm .pop-wrap .btn-close:before { width: 2px; height: 22px; } }

[class^='btn-wrap'] { font-size: 0; }

[class^='btn-wrap'] [class^='btn-'] { font-family: "Malgun Gothic", "맑은 고딕"; }

[class^='btn-wrap'] [class^='btn-'] + [class^='btn-'] { margin-left: 10px; }

[class^='btn-wrap'].vertical { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -ms-flex-direction: column; flex-direction: column; }

[class^='btn-wrap'].vertical [class^='btn-'] + [class^='btn-'] { margin-left: 0; margin-top: 10px; }

.btn-type { display: inline-block; width: 100%; height: 44px; line-height: 44px; font-size: 14px; color: #ffffff; background: #001e50; border-radius: 25px; text-align: center; }

.btn-type-sm { display: inline-block; height: 32px; padding: 0 12px; line-height: 32px; font-size: 14px; color: #ffffff; background: #001e50; border-radius: 25px; text-align: center; }

.btn-type-sm-bd { display: inline-block; height: 32px; padding: 0 12px; line-height: 28px; font-size: 14px; color: #001e50; border-radius: 25px; text-align: center; border: 2px solid #001e50; }

.btn-type-bd { display: inline-block; width: 100%; height: 44px; line-height: 40px; font-size: 14px; color: #001e50; border-radius: 25px; text-align: center; border: 2px solid #001e50; }

.btn-type2 { display: inline-block; width: 100%; height: 44px; line-height: 44px; font-size: 14px; color: #6a767d; background: #dfe4e8; border-radius: 25px; text-align: center; }

.btn-type3 { display: inline-block; width: 100%; height: 44px; line-height: 44px; font-size: 14px; color: #001e50; background: #ffffff; border-radius: 25px; text-align: center; }

.btn-type3-bd { display: inline-block; width: 100%; height: 44px; line-height: 40px; font-size: 14px; color: #ffffff; background: transparent; border-radius: 25px; text-align: center; border: 2px solid #ffffff; }

.btn-wrap-apply { position: relative; text-align: center; }

.btn-wrap-apply:before { content: ''; position: absolute; top: 50%; left: 0; width: 100%; height: 2px; margin-top: -1px; background: #001e50; }

.btn-wrap-apply .btn-toggle { position: relative; padding: 0 10px 0 40px; font-size: 14px; color: #001e50; background: #ffffff; }

.btn-wrap-apply .btn-toggle:before { content: ''; position: absolute; top: 3px; left: 15px; display: inline-block; width: 8px; height: 8px; border-style: solid; border-color: transparent #001e50 #001e50 transparent; border-width: 0 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }

.btn-wrap-apply .btn-toggle.active:before { top: 6px; display: inline-block; width: 8px; height: 8px; border-style: solid; border-color: transparent #001e50 #001e50 transparent; border-width: 0 2px 2px 0; -webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); transform: rotate(-135deg); }

.btn-more { display: inline-block; width: 46px; height: 46px; background: url("../../../images/lms/vdl/sp/sp_common_mo.png") -24px -25px no-repeat; background-size: 300px auto; }

@media (min-width: 960px) { .btn-more { background: url("../../../images/lms/vdl/sp/sp_common.png") -24px -25px no-repeat; } }

.btn-more.type2 { background: url("../../../images/lms/vdl/sp/sp_common_mo.png") -72px -25px no-repeat; background-size: 300px auto; }

@media (min-width: 960px) { .btn-more.type2 { background: url("../../../images/lms/vdl/sp/sp_common.png") -72px -25px no-repeat; } }

.btn-check { position: relative; display: inline-block; width: 54px; height: 54px; border: 1px solid #c2cacf; text-align: center; line-height: 54px; }

.btn-check [class^='ico-'] { position: absolute; top: 15px; left: 50%; margin-left: -11px; opacity: 0.25; }

/* Media */
@media (min-width: 960px) { [class^='btn-wrap'].vertical { -webkit-box-orient: horizontal; -ms-flex-direction: row; flex-direction: row; }
  [class^='btn-wrap'].vertical [class^='btn-'] + [class^='btn-'] { margin-left: 16px; margin-top: 0; }
  [class^='btn-wrap'].vertical.center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
  .btn-type { width: auto; padding: 0 40px; }
  .btn-type-sm { height: 28px; line-height: 28px; }
  .btn-type-bd { width: auto; padding: 0 40px; }
  .btn-type2, .btn-type3, .btn-type3-bd { width: auto; padding: 0 40px; }
  .btn-wrap-apply .btn-toggle { padding: 0 40px 0 66px; font-size: 16px; }
  .btn-wrap-apply .btn-toggle:before { top: 4px; left: 40px; display: inline-block; width: 8px; height: 8px; border-style: solid; border-color: transparent #001e50 #001e50 transparent; border-width: 0 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
  .btn-wrap-apply .btn-toggle.active:before { top: 8px; display: inline-block; width: 8px; height: 8px; border-style: solid; border-color: transparent #001e50 #001e50 transparent; border-width: 0 2px 2px 0; -webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); transform: rotate(-135deg); }
  .btn-more { width: 64px; height: 64px; background: url("../../../images/lms/vdl/sp/sp_common_mo.png") -24px -50px no-repeat; background-size: 300px auto; } }

@media (min-width: 960px) and (min-width: 960px) { .btn-more { background: url("../../../images/lms/vdl/sp/sp_common.png") -24px -50px no-repeat; } }

@media (min-width: 960px) { .btn-more.type2 { background: url("../../../images/lms/vdl/sp/sp_common_mo.png") -92px -50px no-repeat; background-size: 300px auto; } }

@media (min-width: 960px) and (min-width: 960px) { .btn-more.type2 { background: url("../../../images/lms/vdl/sp/sp_common.png") -92px -50px no-repeat; } }

@media (min-width: 1280px) { [class^='btn-'] { -webkit-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
  .btn-type:hover, .btn-type-sm:hover { background: #0040C5; }
  .btn-type-bd:hover, .btn-type-sm-bd:hover { border-color: #0040C5; color: #0040C5; }
  .btn-type3:hover { background: #4CC7F4; }
  .btn-type3-bd:hover { border-color: #4CC7F4; color: #4CC7F4; } }

.form { margin-top: 25px; }

.form .form-group .form-item { padding: 20px 0; border-bottom: 1px solid #c2cacf; }

.form .form-group .form-item > label { display: block; font-size: 16px; }

.form .form-group .form-item > label em { color: #00b0f0; font-weight: 700; vertical-align: text-bottom; }

.form .form-group .form-item .input-default { padding-top: 10px; }

.form .form-group .form-item .input-default input[type='text'] { border: 1px solid #c2cacf; }

.form .form-group .form-item .input-default .radio-box label { display: inline-block; }

.form .form-group .form-item .input-default.calendar > label { position: relative; display: block; }

.form .form-group .form-item .input-default.calendar > label input { cursor: pointer; }

.form .form-group .form-item .input-default.calendar > label .ico-calendar { position: absolute; top: 16px; right: 20px; cursor: pointer; }

.form .form-group .form-item .input-default.col2 { font-size: 0; }

.form .form-group .form-item .input-default.col2 input[type='text'] { width: calc(100% - 127px); vertical-align: middle; }

.form .form-group .form-item .input-default.col2 .btn-type, .form .form-group .form-item .input-default.col2 .btn-type2 { margin-left: 10px; width: 117px; height: 56px; line-height: 56px; border-radius: 0; vertical-align: middle; }

.form .form-group:last-child .form-item:last-child { padding-bottom: 0; border-bottom: none; }

.form .form-group .form-item + .form-item label { padding-left: 50px;}

.form-type2 .form-group { padding: 20px 0; border-bottom: 1px solid #c2cacf; }

.form-type2 .form-group .form-item > label { display: block; font-size: 16px; }

.form-type2 .form-group .form-item > label em { color: #00b0f0; font-weight: 700; vertical-align: text-bottom; }

.form-type2 .form-group .form-item:nth-child(n+2) { margin-top: 20px; }

.form-type2 .form-group:last-child { padding-bottom: 0; border-bottom: none; }

.radio-box { display: inline-block; min-width: 140px; text-align: left; line-height: 2; }

.radio-box input[type='radio'] { display: none; }

.radio-box label { cursor: pointer; font-size: 16px; }

.radio-box .checkbox { display: inline-block; position: relative; width: 24px; height: 24px; margin-right: 6px; background: #fff; border: 1px solid #001e50; }

.radio-box input[type="radio"] + .checkbox { border-radius: 100%; }

.radio-box input[type="radio"] + .checkbox:after { content: ""; position: absolute; top: 4px; left: 4px; width: 14px; height: 14px; border: 0; border-radius: 100%; }

.radio-box input[type="radio"]:checked ~ .checkbox:after { border: 7px solid #001e50; }

.radio-box input[type="radio"]:checked + .checkbox { border-color: #001e50; }

.chk-box, .radio-box-type2 { display: inline-block; text-align: left; }

.chk-box input[type='radio'], .radio-box-type2 input[type='radio'] { display: none; }

.chk-box label, .radio-box-type2 label { cursor: pointer; font-size: 16px; }

.chk-box .checkbox, .radio-box-type2 .checkbox { display: inline-block; position: relative; width: 24px; height: 24px; margin-right: 6px; background: #fff; border: 1px solid #001e50; }

.chk-box input[type="checkbox"] + .checkbox:before, .chk-box input[type="checkbox"] + .checkbox:after, .chk-box input[type="radio"] + .checkbox:before, .chk-box input[type="radio"] + .checkbox:after, .radio-box-type2 input[type="checkbox"] + .checkbox:before, .radio-box-type2 input[type="checkbox"] + .checkbox:after, .radio-box-type2 input[type="radio"] + .checkbox:before, .radio-box-type2 input[type="radio"] + .checkbox:after { content: ""; position: absolute; width: 0; height: 1px; background: #001e50; -webkit-transform-origin: left; -ms-transform-origin: left; transform-origin: left; }

.chk-box input[type="checkbox"] + .checkbox:before, .chk-box input[type="radio"] + .checkbox:before, .radio-box-type2 input[type="checkbox"] + .checkbox:before, .radio-box-type2 input[type="radio"] + .checkbox:before { -webkit-transform: translate(5px, 11px) rotate(45deg); -ms-transform: translate(5px, 11px) rotate(45deg); transform: translate(5px, 11px) rotate(45deg); }

.chk-box input[type="checkbox"] + .checkbox:after, .chk-box input[type="radio"] + .checkbox:after, .radio-box-type2 input[type="checkbox"] + .checkbox:after, .radio-box-type2 input[type="radio"] + .checkbox:after { -webkit-transform: translate(7px, 14px) rotate(-45deg); -ms-transform: translate(7px, 14px) rotate(-45deg); transform: translate(7px, 14px) rotate(-45deg); }

.chk-box input[type="checkbox"]:checked ~ .checkbox:before, .chk-box input[type="checkbox"]:checked ~ .checkbox:after, .chk-box input[type="radio"]:checked ~ .checkbox:before, .chk-box input[type="radio"]:checked ~ .checkbox:after, .radio-box-type2 input[type="checkbox"]:checked ~ .checkbox:before, .radio-box-type2 input[type="checkbox"]:checked ~ .checkbox:after, .radio-box-type2 input[type="radio"]:checked ~ .checkbox:before, .radio-box-type2 input[type="radio"]:checked ~ .checkbox:after { background: #001e50; }

.chk-box input[type="checkbox"]:checked ~ .checkbox:before, .chk-box input[type="radio"]:checked ~ .checkbox:before, .radio-box-type2 input[type="checkbox"]:checked ~ .checkbox:before, .radio-box-type2 input[type="radio"]:checked ~ .checkbox:before { width: 4px; }

.chk-box input[type="checkbox"]:checked ~ .checkbox:after, .chk-box input[type="radio"]:checked ~ .checkbox:after, .radio-box-type2 input[type="checkbox"]:checked ~ .checkbox:after, .radio-box-type2 input[type="radio"]:checked ~ .checkbox:after { width: 13px; }

.chk-box:nth-child(n+2), .radio-box-type2:nth-child(n+2) { margin-left: 75px; }

.select-box { position: relative; display: block; }

.select-box select { display: none; }

.select-box .dropdown { width: 100%; height: 56px; padding: 0 20px; font-size: 14px; color: #aaa; line-height: 56px; border: 1px solid #c2cacf; outline: none; cursor: pointer; }

.select-box .dropdown.open .list { display: block; }

.select-box .dropdown:after { content: ''; position: absolute; top: 19px; right: 20px; display: inline-block; width: 10px; height: 10px; border-style: solid; border-color: transparent #001e50 #001e50 transparent; border-width: 0 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }

.select-box .dropdown .list { display: none; position: absolute; background-color: #fff; top: 100%; left: 0; right: 0; z-index: 99; border-left: 1px solid #c2cacf; border-right: 1px solid #c2cacf; border-bottom: 1px solid #c2cacf; }

.select-box .dropdown .list ul { max-height: 140px; overflow-y: auto; }

.select-box .dropdown .list ul::-webkit-scrollbar { width: 2px; height: 10px; }

.select-box .dropdown .list ul::-webkit-scrollbar-track { background: #f1f1f1; }

.select-box .dropdown .list ul::-webkit-scrollbar-thumb { background: #a7a7a7; }

.select-box .dropdown .list ul li { padding: 10px 20px; font-size: 14px; color: #96a3a8; line-height: 1; outline: none; }

.select-box .dropdown .list ul li.selected { color: #ffffff; background: #258ef9; }

.select-box:nth-of-type(n+2) { margin-top: 10px; }
.select-box.select-list10 .dropdown .list ul{max-height:340px}
.select-box.select-box-noscroll .dropdown .list ul{max-height:none}

.ui-widget { font-family: inherit; }

.ui-widget.ui-widget-content { padding: 15px; border: 1px solid #c2cacf; width: calc(100% - 16.66667%); border-radius: 0; }

.ui-widget .ui-datepicker-header { background-color: #fff; border: none; font-size: 18px; color: #000; padding: 0; margin-bottom: 35px; }

.ui-widget .ui-datepicker-title { margin: 5px 0; line-height: 1; }

.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { top: 0; width: 30px; height: 30px; background: #F6F6F6; border-radius: 50%; cursor: pointer; }

.ui-datepicker .ui-datepicker-prev { left: 0; }

.ui-datepicker .ui-datepicker-prev span { display: inline-block; width: 7px; height: 7px; border-style: solid; border-color: transparent #001e50 #001e50 transparent; border-width: 0 2px 2px 0; -webkit-transform: rotate(135deg); -ms-transform: rotate(135deg); transform: rotate(135deg); position: absolute; top: 50%; left: 50%; margin-top: -3.5px; margin-left: -3.5px; }

.ui-datepicker .ui-datepicker-next { right: 0; }

.ui-datepicker .ui-datepicker-next span { display: inline-block; width: 7px; height: 7px; border-style: solid; border-color: transparent #001e50 #001e50 transparent; border-width: 0 2px 2px 0; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); position: absolute; top: 50%; left: 50%; margin-top: -3.5px; margin-left: -3.5px; }

.ui-datepicker table { font-size: 15px; color: #555555; margin: 0; }

.ui-datepicker table th:first-child, .ui-datepicker table th:first-child a, .ui-datepicker table td:first-child, .ui-datepicker table td:first-child a { color: #e9303e; }

.ui-datepicker table th { padding: 10px; font-weight: 400; }

.ui-datepicker table td { position: relative; width: 40px; height: 40px; padding: 0; vertical-align: middle; }

.ui-datepicker table td.ui-datepicker-today a { position: relative; width: 100%; height: 100%; max-width: 40px; max-height: 40px; margin: 0 auto; color: #fff; background: #0082d6; border-radius: 50%; line-height: 40px; }

.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-button:hover, .ui-button:focus { border: none; }

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active { border: none; background: #fff; font-weight: 700; color: #555555; text-align: center; padding: 0; }

/* Media */
@media (min-width: 960px) { .form { margin-top: 64px; }
  .form .form-group { display: table; table-layout: fixed; width: 100%; }
  .form .form-group .form-item { display: table-cell; vertical-align: middle; font-size: 0; }
  .form .form-group .form-item > label { display: inline-block; min-width: 160px; }
  .form .form-group .form-item .input-default { padding-top: 0; display: inline-block; vertical-align: middle; width: calc(100% - 160px); font-size: 0; }
  .form .form-group .form-item .input-default.calendar, .form .form-group .form-item .input-default.sm { width: calc(50% - 160px); padding-right: 65px; }
  .form .form-group .form-item .input-default.col2 { padding-right: 20px; width: calc(50% - 80px); }
  .form .form-group .form-item .input-default.col2:last-child { padding-left: 20px; padding-right: 0; }
  .form .form-group .form-item .input-default.col2 .btn-type, .form .form-group .form-item .input-default.col2 .btn-type2 { padding: 0 10px; }
  .form .form-group .form-item .input-default.col3 .select-box { display: inline-block; vertical-align: middle; margin-left: 5%; width: 30%; }
  .form .form-group .form-item .input-default.col3 .select-box:first-child { margin-left: 0; }
  .form .form-group .form-item.col3 .input-default { width: auto; }
  .form .form-group.col2 .form-item:first-child { padding-right: 65px; }
  .form .form-group.col2 .form-item:last-child { padding-left: 65px; }
  .form-type2 { margin-top: 50px; }
  .form-type2 .form-group { display: table; width: 100%; }
  .form-type2 .form-group .form-item { display: table-cell; vertical-align: middle; }
  .form-type2 .form-group .form-item:nth-child(n+2) { margin-top: 0; }
  .form-type2 .form-group .form-item:nth-child(2) { width: 210px; }
  .form-type2 .form-group .form-item:last-child { padding-left: 40px; width: 195px; }
  .form-type2 .form-group .form-item:last-child .btn-wrap { text-align: right; }
  .radio-box { min-width: auto; }
  .radio-box:nth-child(n+2) { margin-left: 5%; }
  .chk-box:nth-child(n+2), .radio-box-type2:nth-child(n+2) { margin-left: 40px; }
  .select-box:nth-of-type(n+2) { margin-top: 0; }
  .select-box .dropdown .list ul li:hover { color: #ffffff; background: #258ef9; }
  .ui-widget.ui-widget-content { width: auto; max-width: 362px; } }

@media (min-width: 1280px) { .form .form-group .form-item .input-default .btn-type:hover { background: #001e50; } }

[class^='ico-'] { display: inline-block; background: url("../../../images/lms/vdl/sp/sp_common_mo.png") 0 0 no-repeat; background-size: 300px auto; }

@media (min-width: 960px) { [class^='ico-'] { background: url("../../../images/lms/vdl/sp/sp_common.png") 0 0 no-repeat; } }

.ico-wheel { width: 24px; height: 24px; background-position: 0 0; }

.ico-diesel { width: 16.5px; height: 21px; background-position: -26px 0; }

.ico-power { width: 23.5px; height: 14px; background-position: -44.5px 0; }

.ico-fuel { width: 16px; height: 22px; background-position: -70px 0; }

.ico-co2 { width: 23.5px; height: 18px; background-position: -88px 0; }

.ico-city { width: 22px; height: 22px; background-position: -113.5px 0; }

.ico-calendar { width: 22px; height: 22px; background-position: 0 -25px; }

.ico-scroll { position: absolute; left: 50%; bottom: 12px; width: 2px; height: 34px; overflow: hidden; background: none; }

.ico-scroll:before { content: ''; display: block; height: 100%; width: 100%; background: #fff; animation: 3s cubic-bezier(0.14, 1.12, 0.67, 0.99) infinite scrollMotion; }

@keyframes scrollMotion { 0% { -webkit-transform: translateY(-200%);
    -ms-transform: translateY(-200%);
    transform: translateY(-200%); }
  50% { -webkit-transform: translateY(-150%);
    -ms-transform: translateY(-150%);
    transform: translateY(-150%); }
  100% { -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%); } }

.ico-spot { width: 14px; height: 22px; background-position: 0 -73px; }

.ico-call { width: 16.5px; height: 22px; background-position: -16px -73px; }

.ico-check { width: 20px; height: 20px; background-position: -120px -25px; }

.ico-check2 { width: 22px; height: 22px; background-position: -176px -25px; }

.ico-check3 { width: 32px; height: 32px; background-position: -142px -25px; }

.ico-down { width: 47px; height: 47px; background-position: -72px -73px; }

.ico-close { width: 47px; height: 47px; background-position: -121px -73px; }

.ico-car { width: 23.5px; height: 17.5px; background-position: -137.5px 0px; }

/* Media */
@media (min-width: 960px) { .ico-wheel { width: 24px; height: 24px; background-position: 0 -24px; }
  .ico-diesel { width: 16px; height: 21px; background-position: -26px -24px; }
  .ico-power { width: 23px; height: 14px; background-position: -44px -24px; }
  .ico-fuel { width: 16px; height: 22px; background-position: -69px -24px; }
  .ico-co2 { width: 23px; height: 19px; background-position: -87px -24px; }
  .ico-city { width: 22px; height: 22px; background-position: -112px -24px; }
  .ico-calendar { width: 22px; height: 22px; background-position: 0 -50px; }
  .ico-scroll { bottom: 52px; height: 50px; }
  .ico-spot { width: 14px; height: 22px; background-position: 0 -118px; }
  .ico-call { width: 17px; height: 22px; background-position: -18px -118px; }
  .ico-zoomin { width: 21px; height: 21px; background-position: -42px -118px; }
  .ico-zoomout { width: 21px; height: 21px; background-position: -67px -118px; }
  .ico-check { width: 20px; height: 20px; background-position: -160px -50px; }
  .ico-check2 { width: 22px; height: 22px; background-position: -185px -50px; }
  .ico-check3 { width: 32px; height: 32px; background-position: -211px -50px; }
  .ico-down { width: 64px; height: 64px; background-position: -247px 0; }
  .ico-close { width: 64px; height: 64px; background-position: -315px 0; }
  .ico-car { width: 23px; height: 17px; background-position: -138px -24px; } }

/*# sourceMappingURL=common.css.map */

/* 구매혜택 */
.title-wrap.type8{position: relative;text-align: center;padding-bottom:52px;border-bottom:4px solid #000; margin-bottom:0;}
.title-wrap.type8 .promotion-caption{display:flex;align-items:center;position:absolute;right:0;bottom:5px;}
.title-wrap.type8 .promotion-caption > em {display:inline-block;overflow:hidden;position:relative;width: 20px; height: 20px;margin-left:4px;border-radius:20px;background:url(../../../images/lms/vdl/sp/plus-btn.png) 50% 50%;background-size:100% 100%;line-height:18px;color:transparent;text-align:center;}
.benefits .benefits-list-area .benefits-list{border-bottom:2px solid #000;}
.benefits-detail{position:relative;display: block;width:100%;padding:40px 60px 30px; width:100%;text-align: left;color:#000;}
.benefits-detail::before{position: absolute;right:30px;top:50%;transform:translateY(-50%); content:"";display:block;width: 30px;height: 30px; background:url(../../../images/lms/vdl/sp/plus-btn.png) no-repeat center center;background-size:100% 100%;}
.benefits-detail .img-area{display: inline-block;vertical-align: top;}
.benefits-detail .benefits-info-area{position:relative;display:inline-block;width: calc(100% - 290px);margin-left:70px;}
.benefits-detail .open-btn{position:absolute;top:50%;transform:translateY(-50%);right:0;width:30px;height:30px;background:url(../../../images/lms/vdl/sp/open-btn.png) no-repeat center center;text-indent:-9999px;}
.benefits-detail .benefits-info-area strong{font-size:32px;line-height: 0.5;}
.benefits-info-area .benefits-info{margin-top: 45px;}
.benefits-info-area .benefits-info .benefits-info-list{display:flex;width:100%}
.benefits-info-area .benefits-info .benefits-info-list li{width:100%;padding-left:20px;}
.benefits-info-area .benefits-info .benefits-info-list li:first-child{padding-left:0;}
.benefits-info-area .benefits-info .benefits-info-list li span {display: block;white-space:nowrap}
.benefits-info-area .benefits-info .benefits-info-list li span.benefits-txt{margin-top:12px;font-size:20px;}
.bld{font-weight:700;}
.blue-txt{font-weight:700;color:#00b0f0;}
.blue-txt.type2{font-size:20px;}
.benefits-detail-info{display:none;position:relative; padding-bottom:110px;}
.benefits-detail .img-area{width:210px;}
.benefits-detail-info .two-line{height:4px;border-top:1px solid #c2cacf;border-bottom:1px solid #c2cacf;}
.benefits-detail-info .gray-box-info{margin-bottom:30px;padding:30px 40px 35px;background-color:#f3f3f3;}
.benefits-detail-info .gray-box-info.gray-box-info--tiguan{width:600px;margin:0 auto 30px;}
.benefits-detail-info .gray-box-info .car-detail-caption{text-align:right;font-weight:700;}
.benefits-detail-info .gray-box-info table{margin-top:10px;}
/* 231016 ID.4 */
.benefits-detail-info.type2 .gray-box-info.gray-box-info--tiguan{width:100%;}
.benefits-detail-info.type2 .name-tit{font-size:18px;}
.benefits-detail-info.type2 .gray-box-info table tbody tr th{font-size:16px;}
.benefits-detail-info.type2 .gray-box-info table tbody tr td{font-size:18px;}
.benefits-detail-info.type2 .gray-box-info table tbody tr td.lineHeight{line-height: 1.3;}

.benefits-detail-info .gray-box-info table thead tr th, .benefits-detail-info .gray-box-info table tbody .last th, .benefits-detail-info .gray-box-info table tbody .last td{padding:17px 20px 17px 0;border:2px solid #000;border-width:2px 0 1px 0;}
.benefits-detail-info .gray-box-info table thead tr th:first-child, .benefits-detail-info .gray-box-info table tbody .last th:first-child{padding-left:20px;}
.benefits-detail-info .gray-box-info table tbody tr th, .benefits-detail-info .gray-box-info table tbody tr td{padding: 9px 20px 9px 0;}
.benefits-detail-info .gray-box-info table tbody tr:first-child th, .benefits-detail-info .gray-box-info table tbody tr:first-child td{padding-top: 17px;}
.benefits-detail-info .gray-box-info table tbody .last-before th, .benefits-detail-info .gray-box-info table tbody .last-before td{padding-bottom:17px;}
.benefits-detail-info .gray-box-info table tbody tr th {padding-left:20px;font-size:18px;}
.benefits-detail-info .gray-box-info table thead th{font-size:18px;}
.benefits-detail-info .gray-box-info table thead th.big-txt{font-size:22px;font-weight:700;line-height:1.3;}
.benefits-detail-info .gray-box-info table tbody tr td{font-size:20px;font-weight:700;}
.benefits-detail-info .gray-box-info table tbody tr:last-child td{font-size:20px;}

.big-txt{font-size:20px !important;font-weight:700;}
.rt-txt{float:right;}
.gray-box-info .caution-txt{margin-top:22px;}
.gray-box-info .caution-txt ul{padding-left:20px;}
.gray-box-info .caution-txt ul li{margin-top:8px;}
.gray-box-info .caution-txt ul li:first-child{margin-top:0;}

.promotion-detail-info{display: flex;justify-content:space-between;align-items: center;width:100%;padding:20px 30px 20px;}
.promotion-detail-info strong{font-size:22px;}
.promotion-detail-info > ul li{margin-top:14px;text-align:right;font-size:18px;}
.promotion-detail-info > ul li:first-child{margin-top:0;}
.promotion-detail-info > ul li span{display:inline-block;width:260px;}
.promotion-detail-info > ul li .txt-lt{width:auto;}
.promotion-detail-info.up-line{border-top:1px solid #c2cacf;}
.promotion-detail-info.bot-line{border-bottom:1px solid #c2cacf;}
.txt-rt{text-align: right;}
.txt-rt.bld-txt{font-size:20px;}
.promotion-detail-info.type2{padding-bottom:20px;}
.promotion-caution{position: relative;margin-top:20px;}
.promotion-caution .promotion-btn-area{position:absolute;right:0;top:50px;}
.promotion-caution ul li{position:relative;margin-top: 8px;padding-left:10px;font-size:14px;color:#6a767d;}
.promotion-caution ul li::before{position:absolute;content:"*";display:block;top:0;left:0;}
.promotion-caution ul li:first-child{margin-top:0;}

.promotion-btn-area{position:absolute;right:0;bottom:115px;font-size:0;}
.promotion-btn-area a{display:inline-block;margin-left:16px;padding:0 40px;height:44px;line-height:44px;background-color:#001e50;color:#fff;font-size:14px;border-radius: 50px;cursor:pointer;}
.name-tit{display:block;font-size:20px; margin-bottom:5px;line-height:1.2;}
.size-down{font-size: 13px !important;}

.benefits-detail[aria-expanded=true]+.benefits-detail-info {display:block;}
.benefits-detail[aria-expanded=true]::before{background-image:url(../../../images/lms/vdl/sp/minus-btn.png)}

.small-txt {font-size:15px !important;}
.finance-txt{margin:130px 0 163px;}
.big-caption{display:inline-block;width:94px;height: 40px;line-height:38px;background-color:#00b0f0;color:#fff;border-radius:50px;text-align:center;}

.pc-no{display:none;}


@media (max-width: 960px) {
  .benefits-detail {padding:36px 0 30px 16px;}
  .benefits-detail::before{right:0}
  .benefits-detail .benefits-info-area{margin-left:28px;width: calc(100% - 280px);}
  .benefits-detail .benefits-info-area strong{line-height: 0.7;}
  .benefits-info-area .benefits-info .benefits-info-list li{width:100%;padding-left:16px;}

  .benefits-detail-info{padding-bottom:185px;}
  .benefits-detail-info .gray-box-info table thead tr th:first-child, .benefits-detail-info .gray-box-info table tbody tr th,
  .benefits-detail-info .gray-box-info table thead tr th:first-child, .benefits-detail-info .gray-box-info table tbody .last th:first-child{padding-left:10px;}
  .benefits-detail-info .gray-box-info{padding:30px 20px 35px;}
  .benefits-detail-info .gray-box-info.gray-box-info--tiguan{width:100%;margin:0 auto 30px;}
  /* 231016 ID.4 */
  .benefits-detail-info.type2 .gray-box-info.gray-box-info--tiguan{width:100%;}

  .benefits-detail .open-btn{right:-30px;}
  .promotion-detail-info{padding:20px 0 20px 20px;}
  .promotion-detail-info table colgroup col:last-child{width: 29% !important;}
  .promotion-detail-info ul li span{width:215px;}
  .promotion-btn-area{bottom: -85px;}
  .promotion-caution .promotion-btn-area{top:105px;}
  .gray-box-info table colgroup col:first-child {width:33% !important;}
  .benefits-detail-info.type2 .gray-box-info table colgroup col:first-child {width:27% !important;}
  .benefits-detail-info.type2 .gray-box-info table colgroup col:nth-child(2) {width:26% !important;}
  .benefits-detail-info.type2 .gray-box-info table colgroup col:nth-child(3) {width:26% !important;}
  .form .form-group .form-item + .form-item label {padding-left: 0px;}
}

@media (max-width: 750px) {
  .title-wrap.type8 .promotion-caption{font-size:10px;}
  .title-wrap.type8 .promotion-caption > em{width:15px;height:15px;line-height:13px;}
  .benefits-detail{position: relative; padding:22px 0 20px 7px;}
  .benefits-detail::before{top:30px;width:20px;height:20px;}
  .benefits-detail .img-area{position: absolute;top:65px;width:120px;}
  .benefits-detail .benefits-info-area{position: relative;width:100%; margin-left:0;}
  .benefits-detail .benefits-info-area strong{position: relative;display: block;font-size:24px;}
  .benefits-info-area .benefits-info .benefits-info-list{display: block;padding-left: 140px;margin-top:-22px;width: 100%;}
  .benefits-info-area .benefits-info .benefits-info-list li{width: auto; margin-top: 12px;padding-left:0}
  .benefits-info-area .benefits-info .benefits-info-list li span{display: inline-block;}
  .benefits-info-area .benefits-info .benefits-info-list li span.benefits-txt{float: right;font-size:14px;margin-top:0;}
  .benefits-info-area .benefits-info .benefits-info-list li span.benefits-tit{font-size:12px;}
  .benefits-detail .open-btn{right:0;top: 10px;}
  .promotion-detail-info{display: block;overflow:hidden;padding:12px 0 20px;}
  .promotion-detail-info > strong, .promotion-detail-info > span{padding:8px 0 0}
  .promotion-detail-info strong{float:left;font-size:16px;}
  .promotion-detail-info > ul {clear:both;padding-top:20px;}
  .promotion-detail-info > ul li{margin-top:10px;text-align:left;font-size:14px;}
  .promotion-detail-info > ul li span{float:right;text-align:right;width:auto}
  .promotion-detail-info > ul li .txt-lt{float: none;}

  .benefits-detail-info{padding-bottom:100px;}
  .benefits-detail-info .gray-box-info{padding:20px 10px 18px;}
  .benefits-detail-info .gray-box-info .car-detail-caption{font-size:10px;}
  .benefits-detail-info .gray-box-info table thead th {font-size:10px !important;}
  .benefits-detail-info .gray-box-info table thead th.big-txt{font-size:12px !important;}
  .benefits-detail-info .gray-box-info table tbody tr:last-child td{font-size:12px;}
  .benefits-detail-info .gray-box-info table thead tr th, .benefits-detail-info .gray-box-info table tbody .last th, .benefits-detail-info .gray-box-info table tbody .last td{padding: 10px 0 10px 10px;}
  .benefits-detail-info .gray-box-info table thead tr th:first-child {padding-right:0;padding-left: 0;}
  .benefits-detail-info .gray-box-info table thead tr th:first-child, .benefits-detail-info .gray-box-info table tbody .last th:first-child{padding-left:0;}
  .benefits-detail-info .gray-box-info table thead tr th, .benefits-detail-info .gray-box-info table tbody tr th{width:35% !important;}
  .benefits-detail-info .gray-box-info table tbody tr th, .benefits-detail-info .gray-box-info table tbody tr td{padding: 4px 0 4px 10px;font-size:12px;}
  .benefits-detail-info .gray-box-info table tbody tr:first-child th, .benefits-detail-info .gray-box-info table tbody tr:first-child td {padding-top: 9px;}
  .benefits-detail-info .gray-box-info table tbody .last-before th, .benefits-detail-info .gray-box-info table tbody .last-before td {padding-bottom:9px;}
  .benefits-detail-info .gray-box-info table tbody tr th {padding-left:0;}
  .benefits-detail::before{right:0;}

  /* 231016 ID.4 */
  .benefits-detail-info.type2 .name-tit{font-size:12px;}
  .benefits-detail-info.type2 .gray-box-info table tbody tr th{font-size:12px;}
  .benefits-detail-info.type2 .gray-box-info table tbody tr td{padding: 7px 0; font-size:12px;}
  .benefits-detail-info.type2 .gray-box-info table tbody tr th,
  .benefits-detail-info.type2 .gray-box-info table tbody tr th .big-caption {font-size: 10px !important;}
  .benefits-detail-info.type2 .gray-box-info table tbody .last02 th,
  .benefits-detail-info.type2 .gray-box-info table tbody .last02 td {border-bottom: 1px solid #000;}
  .benefits-detail-info.type2 .gray-box-info table tbody .last02:nth-child(9) td {border: 0;}

  .gray-box-info .caution-txt{margin-top:10px}
  .gray-box-info .caution-txt ul{padding-left:0}
  .gray-box-info .caution-txt ul li{margin-top:5px;font-size:10px}

  .promotion-caution{margin:15px 0 0;}
  .promotion-caution ul li{font-size:12px;line-height:1.3;}
  .promotion-btn-area{position: static;margin-top:32px;text-align: center;}
  .promotion-btn-area a{display:block;width: 100%;margin:12px 0 0 0;font-size:15px;}
  .promotion-btn-area a:first-child{margin-top:0;}
  .promotion-caution .promotion-btn-area{position:static;}

  .big-txt{font-size:14px !important;}
  .big-txt.txt-rt{float:right;}
  .name-tit{margin-bottom:3px;font-size:12px !important;}
  .blue-txt{font-size:14px ;}
  .blue-txt.type2{font-size:14px ;}
  .txt-rt.bld-txt{font-size:14px;}
  .small-txt{font-size: 10px !important;}

  .big-caption{width:47px;height: 20px;line-height:19px;}

  .pc-no{display:block;}
  .mo-no{display: none;}
}

@media (max-width: 359px) {
  .benefits-detail .benefits-info-area strong{font-size:22px}
  .benefits-detail .img-area{width:96px}
  .benefits-info-area .benefits-info .benefits-info-list{padding-left:108px}
  .benefits-info-area .benefits-info .benefits-info-list li{margin-top:8px}
  .promotion-detail-info > .txt-rt{margin-left:12px}
}

.dms-loading-mask {
    background-color: rgba(200, 200, 200, 0.5);
}
.dms-loading-mask .k-loading-text{
    display:none;
}
.dms-loading-mask .k-loading-image {
    background: url(/resources/img/loading-image.gif) no-repeat scroll 50% 50%;
    width: 100%;
    height: 100%;
}
