@charset "utf-8";

/* Copy Code */
.copyBtn {position: absolute; right: 100%; top: 0; padding-right: 10px;}
.copyBtn span {display: inline-block; background: #fff; padding: 7px 15px; border: 1px solid #d1d1d1; border-radius: 10px; white-space: nowrap; opacity: 0; transition: opacity .45s;}
.copyBtn.on span {opacity: 1;}
.copyBtn:hover span {background: #ed8a00; border: 1px solid #ed8a00; color: #fff;}

/* Heading */
.objHeading_h2 {position: relative; display: block; margin-top: 50px; font-family: pb; font-size: 30px; line-height: 1.2; color: #323232;}
.objHeading_h3 {position: relative; display: block; margin-top: 30px; font-family: pm; line-height: 1.2; font-size: 24px; color: #08407a;}
.objHeading_h4 {position: relative; display: block; margin-top: 30px; font-family: pm; font-size: 20px; line-height: 1.2; color: #303030;}
.objHeading_h5 {position: relative; display: block; margin-top: 30px; font-family: pm; font-size: 18px; line-height: 1.2; color: #336579;}

.objHeading_h2.no-margin,
.objHeading_h3.no-margin,
.objHeading_h4.no-margin,
.objHeading_h5.no-margin {margin-top: 0;}

.no-margin .objHeading_h2,
.no-margin .objHeading_h3,
.no-margin .objHeading_h4,
.no-margin .objHeading_h5 {margin-top: 0;}

@media screen and (max-width: 1200px) {
  .objHeading_h2 {margin-top: 40px; font-size: 25px;}
  .objHeading_h3 {margin-top: 20px; font-size: 22px;}
  .objHeading_h4 {margin-top: 20px; font-size: 20px;}
}

@media screen and (max-width: 700px) {
  .objHeading_h2 {margin-top: 30px; font-size: 20px;}
  .objHeading_h3 {margin-top: 15px; font-size: 18px;}
  .objHeading_h4 {margin-top: 15px; font-size: 17px;}
}

/* Description */
.con-desc {font-family: pr; font-size: 17px; line-height: 1.7; color: #333;}
.con-desc strong {font-family: pb;}
._objHtml.no-margin {margin-top: 0px !important;}
._objHtml.no-margin > div {margin-top: 0px !important;}


@media screen and (max-width: 1200px) {
  .con-desc {font-size: 16px;}
}

@media screen and (max-width: 700px) {
  .con-desc {font-size: 15px;}
}

/* Align */
.align-r {text-align: right !important;}
.align-c {text-align: center !important;}
.align-l {text-align: left !important;}

/* Point Color */
.c1 {color: #1473e6 !important;}
.c2 {color: #ed8a00 !important;}
.c3 {color: #00abb3 !important;}
.c4 {color: #152e6e !important;}
.c5 {color: #111111 !important;}
.c6 {color:#EA5539 !important;} 
.c7 {color:#004AA4 !important;} 
.b1 {font-family: pb !important;}
.b2 {font-family: plb !important;}
.b3 {font-family:psb;}

/* Link Line */
.link-line {position: relative; color: #666;}
.link-line:hover {color: #004a8f;}
.link-line::after {content: ''; display: inline-block; width: 10px; height: 10px; margin-left: 5px; margin-right: 5px; margin-top: -3px; background: url('../../images/guide/ico-table-link.png') no-repeat center center; vertical-align: middle;}

/* Table */
.con-table {position: relative; line-height: 1.6;}
.con-table:after {content: ''; position: absolute; right: 0px; top: 0px; width: 1px; height: 100%; background: #fff;}
.con-table table {position: relative;}
.con-table thead {position: relative;}
.con-table thead::before {content: ''; position: absolute; left: 0; top: 0; z-index: -1; width: 100%; height: 100%; background: #d4edfb; border-radius: 10px;}
.con-table thead::after {content: ''; position: absolute; left: 0; bottom: 0; z-index: 1; width: 100%; height: 1px; background: #fff;}
.con-table thead th {padding: 11px 10px; border-right: 1px solid #c5c5c5; border-bottom: 1px solid #c5c5c5; font-family: psb; font-size: 17px; font-weight: 400; color: #000000;}
.con-table tbody {display: table-header-group;}
.con-table tbody::after {content:''; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: #000;}
.con-table tbody th {padding: 16px 15px; background:#fff; border-right: 1px solid #c5c5c5; border-bottom: 1px solid #c5c5c5; font-family: pm; font-size: 17px; font-weight: 400; color: #000;}
.con-table tbody td {padding: 16px 15px; background:#fff; border-right: 1px solid #c5c5c5; border-bottom: 1px solid #c5c5c5; font-family: pm; font-size: 17px; text-align: left; color: #333333;}
.con-table.center tbody td {text-align: center;}
.con-table.mini thead th,
.con-table.mini tbody th,
.con-table.mini tbody td {padding: 7px; font-size: 15px;}
.con-table.links tbody td {vertical-align: middle;}
.con-table.links tbody td > div {display: flex; align-items: center;}
.con-table.links tbody td p {flex: 1; float: left;}
.con-table.links tbody td p span {font-size: 14px;}
.con-table.links tbody td a {float: right;}
.con-table tbody td a {color: #333;}
.con-table .list > li {position: relative; padding-left: 15px;}
.con-table .list > li:after {content: ''; position: absolute; left: 0; top: 11px; width: 3px; height: 3px; background: #111; border-radius: 100%;}
.con-table .list2 > li {position: relative; padding-left: 15px;}
.con-table .list2 > li:after {content: ''; position: absolute; left: 0; top: 10px; width: 7px; height: 2px; background: #777;}
.con-table .align-l {text-align: left !important;}
.con-table .align-c {text-align: center !important;}
.con-table .align-r {text-align: right !important;}
.con-table .align-t {vertical-align: top !important;}
.con-table strong {font-family: pm; color: #000;}

.con-table .link {position: relative; color: #333;}
.con-table .link:hover {color: #014291;}
.con-table .link::after {content: ''; display: inline-block; width: 10px; height: 10px; margin-left: 5px; margin-right: 5px; margin-top: -3px; background: url('../../images/guide/ico-table-link.png') no-repeat center center; vertical-align: middle;}

.con-table .home {position: relative; color: #333;}
.con-table .home:hover {color: #00abb3;}
.con-table .home span {position: relative; background: linear-gradient(to bottom, transparent 96%, #00abb3 0) left center no-repeat; background-size: 0; transition: .4s;}
.con-table .home:hover span {background-size: 100% auto;}
.con-table .home::after {content: ''; display: inline-block; width: 25px; height: 25px; margin-left: 5px; margin-right: 5px; margin-top: -3px; background: url('../../images/guide/ic-link-home.png') no-repeat center center; vertical-align: middle;}
.con-table .home:hover::after {background: url('../../images/guide/ic-link-home-hover.png') no-repeat center center;}

.con-table .down {position: relative; color: #666;}
.con-table .down:hover {color: #00abb3;}
.con-table .down span {position: relative; background: linear-gradient(to bottom, transparent 96%, #004a8f 0) left center no-repeat; background-size: 0; transition: .4s;}
.con-table .down:hover span {background-size: 100% auto;}
.con-table .down::after {content: ''; display: inline-block; width: 25px; height: 25px; margin-left: 5px; margin-right: 5px; margin-top: -3px; background: url('../../images/guide/ic-link-down.png') no-repeat center center; vertical-align: middle;}
.con-table .down:hover::after {background: url('../../images/guide/ic-link-down-hover.png') no-repeat center center;}

@media screen and (max-width: 1200px) {
  .con-table thead th,
  .con-table tbody th,
  .con-table tbody td {padding: 10px 8px; font-size: 15px;}
}

@media screen and (max-width: 960px) {
  .con-table {overflow-x: hidden; min-height: 130px;}
  .con-table.on {min-height: auto;}
  .con-table.no-scroll {min-height: auto;}
  .con-table table {width: 1300px;}
  .con-table.no-scroll table {width: 100%;}
  .con-table:after {content: ''; position: absolute; right: 0px; top: 0px; z-index: 1; width: 100%; height: 100%; background: rgba(31,59,101,0.1) url('../../images/guide/img_mobile_text.png') no-repeat center 20px;}
  .con-table.on:after,
  .con-table.no-scroll:after {display: none;}
}

.con-table2 {position: relative; line-height: 1.6;}
.con-table2:after {content: ''; position: absolute; right: 0px; top: 0px; width: 1px; height: 100%; background: #fff;}
.con-table2 table {position: relative;}
.con-table2 table:after {content: ''; position: absolute; left: 0px; top: 0px; width: 100%; height: 2px; background: #1473e6}
.con-table2 thead th {padding: 16px 10px; background: #ecf3fd; border-right: 1px solid #c5c5c5; border-bottom: 1px solid #c5c5c5; font-family: pm; font-size: 17px; font-weight: 400; color: #000;}
.con-table2 tbody {display: table-header-group;}
.con-table2 tbody::after {content:''; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: #000;}
.con-table2 tbody th {padding: 16px 15px; background:#ecf3fd; border-right: 1px solid #c5c5c5; border-bottom: 1px solid #c5c5c5; font-family: pr; font-size: 17px; font-weight: 400; color: #333333;}
.con-table2 tbody td {padding: 16px 15px; background:#fff; border-right: 1px solid #c5c5c5; border-bottom: 1px solid #c5c5c5; font-family: pr; font-size: 17px; text-align: left; color: #333333;}
.con-table2.center tbody td {text-align: center;}
.con-table2.mini thead th,
.con-table2.mini tbody th,
.con-table2.mini tbody td {padding: 7px; font-size: 15px;}
.con-table2.links tbody td {vertical-align: middle;}
.con-table2.links tbody td > div {display: flex; align-items: center;}
.con-table2.links tbody td p {flex: 1; float: left;}
.con-table2.links tbody td p span {font-size: 14px;}
.con-table2.links tbody td a {float: right;}
.con-table2 tbody td a {color: #333;}
.con-table2 .list > li {position: relative; padding-left: 15px;}
.con-table2 .list > li:after {content: ''; position: absolute; left: 0; top: 11px; width: 3px; height: 3px; background: #111; border-radius: 100%;}
.con-table2 .list2 > li {position: relative; padding-left: 15px;}
.con-table2 .list2 > li:after {content: ''; position: absolute; left: 0; top: 10px; width: 7px; height: 2px; background: #777;}
.con-table2 .align-l {text-align: left !important;}
.con-table2 .align-c {text-align: center !important;}
.con-table2 .align-r {text-align: right !important;}
.con-table2 .align-t {vertical-align: top !important;}
.con-table2 strong {font-family: pm; color: #000;}

.con-table2 .link {position: relative; color: #333;}
.con-table2 .link:hover {color: #00abb3;}
.con-table2 .link::after {content: ''; display: inline-block; width: 10px; height: 10px; margin-left: 5px; margin-right: 5px; margin-top: -3px; background: url('../../images/guide/ico-table-link.png') no-repeat center center; vertical-align: middle;}

.con-table2 .home {position: relative; color: #333;}
.con-table2 .home:hover {color: #00abb3;}
.con-table2 .home span {position: relative; background: linear-gradient(to bottom, transparent 96%, #00abb3 0) left center no-repeat; background-size: 0; transition: .4s;}
.con-table2 .home:hover span {background-size: 100% auto;}
.con-table2 .home::after {content: ''; display: inline-block; width: 25px; height: 25px; margin-left: 5px; margin-right: 5px; margin-top: -3px; background: url('../../images/guide/ic-link-home.png') no-repeat center center; vertical-align: middle;}
.con-table2 .home:hover::after {background: url('../../images/guide/ic-link-home-hover.png') no-repeat center center;}

.con-table2 .down {position: relative; color: #333;}
.con-table2 .down:hover {color: #00abb3;}
.con-table2 .down span {position: relative; background: linear-gradient(to bottom, transparent 96%, #004a8f 0) left center no-repeat; background-size: 0; transition: .4s;}
.con-table2 .down:hover span {background-size: 100% auto;}
.con-table2 .down::after {content: ''; display: inline-block; width: 25px; height: 25px; margin-left: 5px; margin-right: 5px; margin-top: -3px; background: url('../../images/guide/ic-link-down.png') no-repeat center center; vertical-align: middle;}
.con-table2 .down:hover::after {background: url('../../images/guide/ic-link-down-hover.png') no-repeat center center;}

@media screen and (max-width: 1200px) {
  .con-table2 thead th,
  .con-table2 tbody th,
  .con-table2 tbody td {padding: 10px 8px; font-size: 15px;}
}

@media screen and (max-width: 960px) {
  .con-table2 {overflow-x: hidden; min-height: 130px;}
  .con-table2.on {min-height: auto;}
  .con-table2.no-scroll {min-height: auto;}
  .con-table2 table {width: 1300px;}
  .con-table2.no-scroll table {width: 100%;}
  .con-table2:after {content: ''; position: absolute; right: 0px; top: 0px; width: 100%; height: 100%; background: rgba(31,59,101,0.1) url('../../images/guide/img_mobile_text.png') no-repeat center 20px;}
  .con-table2.on:after,
  .con-table2.no-scroll:after {display: none;}
}

/* Tab */
.tab_div .mobile-tab {display: none;}

.tab_div.div_4 {display: none; position: relative; z-index: 1; font-size: 0; margin-top: -35px;}
/* .loaded .tab_div.div_4 {display: block;} */
.tab_div .ul_4  {display: flex; align-items: center; height: 60px; border-radius: 100px; background: #242a31;}
.tab_div .ul_4 > li{width: 16.6666%; height: 100%; margin-right: 1px;}
.tab_div .ul_4 > li > a {display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; font-family: 'pm'; font-size: 16px; color: #c5c9d6;}
/* .tab_div .ul_4 > li > a:hover, */
.tab_div .ul_4 > li._active > a {background: #1473e6; border-radius: 100px; color: #fff;}

.tab_div.div_5 {display: none; margin-top: 19px;}
.tab_div .ul_5 {display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
.tab_div .ul_5 > li {padding: 0 5px;}
.tab_div .ul_5 > li > a {position: relative; display: flex; align-items: center; height: 50px; padding: 0 30px; border: 1px solid #bdbdbd; border-radius: 100px; font-family: pm; font-size: 16px; color: #777777;}
.tab_div .ul_5 > li > a:hover,
.tab_div .ul_5 > li._active > a {border: 1px solid #0f2739; color: #0f2739; box-shadow: 0 0 10px rgba(16,79,160,.3);}
.tab_div .ul_5 > li > a:hover:after,
.tab_div .ul_5 > li._active > a:after {content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 1px solid #0f2739; border-radius: 100px;}

@media screen and (max-width: 1200px) {
  .tab_div.div_4 {margin-top: -27px;}
  .tab_div .ul_4 {height: 50px;}
  .tab_div .ul_4 > li > a {font-size: 15px;}
}

@media screen and (max-width: 700px) {
  .tab_div {position: relative;}
  .tab_div .ul_4 {flex-wrap: wrap; overflow: hidden; position: absolute; top: calc(100% - 25px); z-index: -1; width: 100%; height: auto; max-height: 0; margin-bottom: 30px; background: #242a31; border-radius: 0 0 25px 25px; transition: all 0.5s ease;}

  .tab_div.div_4 {margin-top: -27px;}
  .tab_div ul.on {z-index: 10; max-height: 600px; padding: 26px 0 0 0; background: #1042cc;}
  .tab_div .ul_4 > li {display: block; width: 100% !important; padding: 0; border: 0}
  .tab_div ul li a {display: block; height: auto; padding: 13px 40px; font-size: 16px; text-align: left; line-height: normal;}
  .tab_div ul li a:hover {border-bottom: 0}
  .tab_div ul li a:after {display: none;}
  .tab_div ul li a[target=_blank]  {background-position: 97% center !important;}
  .tab_div ul li a span {display: block; padding: 0 20px;}
  .tab_div ul li a span:before {bottom: -11px;}
  .tab_div ul li:after {display: none;}

  .tab_div .mobile-tab {position: relative; z-index: 20; display: block; width: 100%; margin-bottom: 15px; padding: 16px 30px; text-align: center;}
  .tab_div.div_4 .mobile-tab {background: #1473e6 url('../../images/guide/arrow-sel.png') no-repeat right center; border-radius: 100px; font-family: pb; font-size: 16px; color: #fff;}

  .tab_div .ul_4 > li {margin: 0; border: 0;}
  .tab_div .ul_4 > li::before {display: none;}
  .tab_div .ul_4 > li > a {height: 50px; padding: 0 20px; background: #242a31; border: 0; font-family: pm; font-size: 16px; text-align: center; color: #fff;}
  .tab_div .ul_4 > li > a::before {margin-top: 0;}
  .tab_div .ul_4 > li._active > a,
  .tab_div .ul_4 > li:hover > a {border: 0; border-radius: 0; background: #1042cc; font-family: pm; color: #fff;}
  .tab_div .ul_4 > li > a[target=_blank]::after,
  .tab_div .ul_4 > li._active > a[target=_blank]::after {background: url(../../images/guide/tab-link-blank-grey.png) no-repeat center;}
  .tab_div .ul_4 > li:hover > a[target=_blank]::after {background: url(../../images/guide/tab-link-blank.png) no-repeat center;}

  .tab_div .ul_5 > li > a {height: 40px; padding: 0 20px; border: 2px solid #bdbdbd; font-size: 15px;}
  .tab_div .ul_5 > li > a:hover,
  .tab_div .ul_5 > li._active > a {border: 2px solid #0f2739;}
}

/* List Type */
.con-list1 > ul > li {position: relative; margin: 10px 0 0 0; padding-left: 18px; font-family: pr; font-size: 17px; line-height: 1.5; color: #333;}
.con-list1 > ul > li:first-child {margin-top: 0;}
.con-list1 > ul > li::before {content: ''; position: absolute; left: 0; top: 9px; width: 5px; height: 5px; background: #122652; border-radius: 50%;}
.con-list1 > ul > li strong {font-family: pm; color: #111111;}

@media screen and (max-width:700px)  {
  .con-list1 {margin-top:10px !important;}
  .con-list1 > ul > li {margin:5px 0 0 0;}
  .con-list1 > ul > li:first-child {margin-top:0;}
}


.con-list2 > ul > li {position: relative; margin: 10px 0 0 0; padding-left: 18px; font-family: pr; font-size: 17px; line-height: 1.2; color: #666666;}
.con-list2 > ul > li::before {content: ''; position: absolute; left: 0; top: 9px; width: 8px; height: 2px; background: #666666;}
.con-list2 > ul > li strong {font-family: pm; color: #111111;}

.circle-num-title {position: relative; padding-left: 25px; font-family: pm; font-size: 18px; line-height: 20px; color: #222;}
.circle-num-title .num {position: absolute; left: 0; top: 2px; display: inline-block; width: 16px; height: 16px; margin-right: 5px; background: #fcaf17; border-radius: 50%; font-family: pm; font-size: 10px; vertical-align: middle; text-align: center;  line-height: 17px; color: #111;}


.circle-num-list > ul > li {position: relative; margin: 10px 0 0 0; padding-left: 30px; font-family: pr; font-size: 17px; line-height: 1.5; color: #333333;}
.circle-num-list > ul > li .num {position: absolute; left: 0; top: 1px; display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; margin-right: 5px; background: #00a9c8; border-radius: 5px; font-family: plb; font-size: 14px; text-align: center; color: #fff;}
.circle-num-list > ul > li strong {font-family: pm; color: #111111;}



.word-list > ul > li {display: flex; position: relative; width: 100%; margin: 7px 0 0 0; font-family: pm; font-size: 18px; line-height: 1.7; color: #666;}
.word-list > ul > li .word {display: inline-block; margin-right: 5px; font-family: pm; font-size: 18px; vertical-align: top; color: #666;}
.word-list > ul > li strong {font-family: psb; color: #000;}

@media screen and (max-width: 1200px) {
  .con-list1 > ul > li {font-size: 16px;}
  .con-list1 > ul > li::before {top: 8px;}
  .con-list2 > ul > li {font-size: 16px;}
  .con-list2 > ul > li::before {top: 10px;}
  .circle-num-list > ul > li {font-size: 16px;}
  .circle-num-list > ul > li .num {top: 2px; width: 18px; height: 18px; font-size: 11px;}
}

@media screen and (max-width: 700px) {
  .con-list1 > ul > li {font-size: 15px;}
  .con-list1 > ul > li::before {top: 7px;}
  .con-list2 > ul > li {font-size: 15px;}
  .con-list2 > ul > li::before {top: 7px;}
  .circle-num-list > ul > li {font-size: 15px;}
  .circle-num-list > ul > li .num {top: 4px; width: 18px; height: 18px; font-size: 11px;}
}

/* Contents Tab */
.con-tab ul {position: relative; display: flex; align-items: center;}
.con-tab ul::after {content: ''; position: absolute; left: 0; top: 25px; z-index: -1; width: 100%; height: 1px; background: #a5a5a5;}
.con-tab button {display: flex; justify-content: center; align-items: center; height: 50px; margin-right: 10px; padding: 0 50px; background: #3e454d; border-radius: 100px; font-family: pb; font-size: 18px; color: #fff;}
.con-tab button:hover,
.con-tab button.on {background: #1473e6;}
.tab-desc {display: none; margin-top: 20px;}
.tab-desc.on {display: block;}


@media screen and (max-width: 1200px) {
  .con-tab button {height: 45px; padding: 0 30px; font-size: 16px;}
}

@media(max-width: 800px) {
  .con-tab ul {flex-wrap: wrap;}
  .con-tab ul::after {display: none;}
  .con-tab li {width: calc((100% / 3) - 5px);margin-bottom: 10px;margin-right: 7.5px;}
  .con-tab li:nth-child(3n) {margin-right: 0;}
  .con-tab button {width: 100%;padding: 0 15px;}
}

/* Notify Box */
.wrap-noti {padding: 30px 50px; background: #f3f6fd; border-radius: 10px;}
.wrap-noti > ul > li {position: relative; margin-bottom: 10px; padding-left: 15px; font-family: pm; font-size: 17px; color: #011d3f;}
.wrap-noti > ul > li:last-child {margin-bottom: 0;}
.wrap-noti > ul > li::after {content: ''; position: absolute; left: 0; top: 9px; width: 5px; height: 5px; background: #011d3f; border-radius: 100%;}


.mini-noti {position: relative; padding-left:13px;}
.mini-noti span {position: absolute; left:0; top:-1px;}

.ja .mini-noti {padding-left: 20px;}
.ja .mini-noti span {top:0;}

.sub-noti {padding: 20px; background: #f3f6fd; border-radius: 10px;}
.sub-noti > ul > li {position: relative; padding-left: 15px; font-family: pr; font-size: 17px; color: #011d3f;}
.sub-noti > ul > li:last-child {margin-bottom: 0;}
.sub-noti > ul > li::after {content: ''; position: absolute; left: 0; top: 9px; width: 5px; height: 5px; background: #011d3f; border-radius: 100%;}
.sub-noti strong {display: block; font-family: pb; font-size: 20px; color: #000;}

@media screen and (max-width: 1200px) {
  .wrap-noti {padding: 20px 30px;}
  .wrap-noti > ul > li {font-size: 16px;}
}

/* Notify Text */
.noti-text-box {padding: 20px; border: 1px solid #d1d1d1; border-radius: 10px;}
.noti-txt {position: relative; padding: 3px 0 3px 30px; font-family: pb; font-size: 16px;}
.noti-txt.color1 {color: #014291;}
.noti-txt::after {content: ''; position: absolute; left: 0; top: 4px; width: 24px; height: 22px;}
.noti-txt.color1::after {background: url('../../images/guide/ic-noti1.png') no-repeat center center;}
.noti-txt.color2 {color: #EA5539;}
.noti-txt.color2::after {background: url('../../images/guide/ic-noti5.png') no-repeat center; }


@media screen and (max-width: 1200px) {
  .noti-txt {font-size: 16px;}
  .noti-txt::after {top: 3px;}
}

@media screen and (max-width: 700px) {
  .noti-txt {font-size: 15px;}
  .noti-txt::after {top: 4px;}
}

/* Btn Style */
.btn-style1 {display: inline-flex; align-items: center; height: 70px; padding: 0 30px; background-color: #fff;; border: 1px solid #011d3f; border-radius: 7px; font-family: pb; font-size: 18px; color: #011d3f !important; transition: .3s;}
.btn-style1::after {content: ''; display: inline-block; width: 14px; height: 25px; margin-left: 105px; background-color: #011d3f; /* mask: url('../../images/guide/ic-btn1.svg') no-repeat center; */ -webkit-mask: url('../../images/guide/ic-btn1.svg') no-repeat center;}
.btn-style1:hover {border-color: #1473e6; box-shadow: 0 0 10px rgba(0,84,155,0.3); color: #1473e6 !important;}
.btn-style1:hover::after {background-color: #1473e6;}
.btn-style1.invert {background: #007bff; color: #fff !important;}
.btn-style1.invert:hover {background: #4100ff; border-color: #4100ff; box-shadow: 0 0 10px rgb(31 0 155 / 30%);}
.btn-style1.invert::after {background: #fff;}
.btn-style1.small {height: 50px; padding: 0 16px; font-size: 16px;}
.btn-style1.small::after {margin-left: 25px; width: 9px; height: 17px; /* mask: url('../../images/guide/ic-btn1-small.svg') no-repeat center; */ -webkit-mask: url('../../images/guide/ic-btn1-small.svg') no-repeat center;}

.btn-style2 {display: inline-flex; align-items: center; height: 30px; padding: 0 10px; background-color: #fff;; border: 1px solid #1473e6; border-radius: 3px; font-family: pm; font-size: 14px; color: #1473e6 !important; transition: .3s;}
.btn-style2::after {content: ''; display: inline-block; width: 5px; height: 7px; margin-left: 10px; background: url('../../images/guide/ic-btn3.png') no-repeat center top;}
.btn-style2:hover {background-color: #1473e6; color: #fff !important;}
.btn-style2:hover::after {background-position: center bottom;}

.btn-style3 {display: inline-flex; align-items: center; height: 30px; padding: 0 10px; background-color: #fff;; border: 1px solid #1473e6; border-radius: 3px; font-family: pm; font-size: 14px; color: #1473e6 !important; transition: .3s;}
.btn-style3::after {content: ''; display: inline-block; width: 5px; height: 7px; margin-left: 10px; background: url('../../images/guide/ic-btn3.png') no-repeat center top;}
.btn-style3:hover {background-color: #1473e6; color: #fff !important;}
.btn-style3:hover::after {background-position: center bottom;}

@media screen and (max-width: 1200px) {
  .btn-style1 {min-height: 50px; height:auto; padding: 10px 20px; font-size: 16px;}
  .btn-style1::after {margin-left: 50px; mask-size: 8px; -webkit-mask-size: 8px;}
  .btn-style1.small {height: 40px; padding: 0 10px; font-size: 14px;}
}

.line-box {position: relative; border:2px solid #d3d2d2; padding:30px; border-radius:5px; overflow:hidden;}
@media screen and (max-width:700px) {
  .line-box {padding:20px;} 
}
/* Step Banner */
.wrap-step-banner ul {display: flex; justify-content: space-between;}
.wrap-step-banner li {display: flex; flex-direction: column;  align-items: center; width: calc(25% - 30px); height: 320px; padding: 0 30px; border: 1px solid #88adda; border-radius: 5px;}
.wrap-step-banner .ico {display: flex; align-items: flex-end; height: 160px; justify-content:center;}
.wrap-step-banner .desc {text-align: center;}
.wrap-step-banner .desc strong {display: block; margin-top: 20px; font-family: pb; font-size: 18px; color: #1473e6;}
.wrap-step-banner .desc p {margin-top: 10px; font-family: pr; font-size: 16px; color: #2e2e2e;}
.wrap-step-banner .desc i {color: #e63946;}
.wrap-step-banner.length3 li { width: calc(33.3333% - 30px)}

@media screen and (max-width: 1360px) {
  .wrap-step-banner ul {flex-wrap: wrap;}
  .wrap-step-banner li {width: calc(50% - 15px); margin: 15px 0; padding:0 10px;}
  .wrap-step-banner.length3 li {width: calc(50% - 15px);}
}

@media screen and (max-width: 1200px) {
  .wrap-step-banner .desc p {font-size: 15px;}
}

@media screen and (max-width: 800px) {
  .wrap-step-banner li {width: calc(100%); margin: 15px 0;}
  .wrap-step-banner.length3 li {width: calc(100%);}
}

/* Contact */
.wrap-contact {display: flex; align-items: center; justify-content: space-between; height: 100px; margin-top: 70px; padding: 0 50px; border: 4px solid #e4e9f6;}
.wrap-contact .title strong {font-family: pb; font-size: 20px; color: #00275d;}
.wrap-contact .info {display: flex;justify-content: space-between;flex: 1;}
.wrap-contact .info .text {display: flex; align-items: center;margin: 0 0 0 20px;}
.wrap-contact .info .text li {position: relative; padding-left: 15px; font-family: pm; font-size: 16px; color: #333333; margin-right:15px;}
.wrap-contact .info .text li::before {content: ''; position: absolute; left: 0; top: 9px; width: 5px; height: 5px; background: #122652; border-radius: 50%;}

@media screen and (max-width: 1500px) {
  .wrap-contact {height: auto; padding: 30px 50px;}
  .wrap-contact .info {flex-direction: column; align-items: flex-end;}
  .wrap-contact .btn {margin-top: 10px;}
}

@media screen and (max-width: 1200px) {
  .wrap-contact {padding: 30px;}
  .wrap-contact .info .text li {font-size: 15px;}
  .wrap-contact .info .text li::before {top: 8px;}
  .wrap-contact .info .text {flex-direction: column; align-items: flex-end;}
}

@media screen and (max-width: 800px) {
  .wrap-contact {flex-wrap: wrap; justify-content: flex-start}
  .wrap-contact .title {width: 100%; margin-bottom: 10px;}
  .wrap-contact .info {width: 100%; align-items: flex-start;}
  .wrap-contact .info .text {width: 100%; align-items: flex-start;margin: 0;}
  .wrap-contact .info .text li {margin-left: 0;}
  .wrap-contact .btn a {margin: 0 10px 10px 0}
}

/* 준비중 */
.wrap-ready {display: flex; flex-wrap: wrap; justify-content: center; align-items: center; padding: 45px 0 55px 0; background: url('../../images/guide/bg-ready.jpg') no-repeat center top; background-size: cover; border: 5px solid #e5e5e5; text-align: center;}
.wrap-ready .icon {width: 100%; padding: 0 24%;}
.wrap-ready .txt {width: 100%;}
.wrap-ready .big-txt {margin-top: 37px; font-family: pb; font-size: 35px; color: #222;}
.wrap-ready .big-txt strong {position: relative;}
.wrap-ready .big-txt strong::before {content: ''; position: absolute; right: calc(100% + 16px); top: 0; width: 26px; height: 22px; background: url('../../images/guide/deco-ready1.png') no-repeat center;}
.wrap-ready .big-txt strong::after {content: ''; position: absolute; left: calc(100% + 10px); top: 0; width: 26px; height: 22px; background: url('../../images/guide/deco-ready2.png') no-repeat center;}
.wrap-ready .big-txt em {color: #00abb3;}
.wrap-ready .small-txt {margin-top: 18px; font-family: pl; font-size: 18px; line-height: 1.8; color: #555555;}

@media screen and (max-width: 1200px) {
  .wrap-ready .big-txt {font-size: 30px;}
  .wrap-ready .small-txt {font-size: 16px;}
}

@media screen and (max-width: 700px) {
  .wrap-ready .big-txt {font-size: 25px;}
  .wrap-ready .small-txt {font-size: 15px;}
}

.map-head {position: relative; background: #FBF4D4; border-radius:10px; padding:10px 20px 10px 20px; }
.map-head.mini .floor strong {font-size: 25px;}
.map-head .wrap-inner {display:flex; justify-content: space-between; align-items: center;}
.map-head ul {display:flex; flex-wrap:wrap; align-items: center;}
.map-head li {position:relative; margin-right:30px;}
.map-head li .box {display:flex; align-items:center; font-size:18px; font-family:pm; color:#323232; margin:4px 0;}
.map-head li .icon-box {margin-right:10px; display: flex;}
.map-head li .icon-box span {display: inline-block; margin:0 5px;}
.map-head .style1 i {display: inline-block; width:30px; height:30px; border:2px solid #88BAD7; border-radius:3px; background:#E3F3F8;}
.map-head .style2 i {display: inline-block; width:30px; height:30px; border:2px solid #fff; border-radius:3px; background:#f2f2f2;}
.map-head .style3 i {display: inline-block; width:30px; height:30px; border-radius:50%; background:#1473E6; font-size: 18px; color:#fff; font-family: pb; display:flex; align-items:center; justify-content:center; box-shadow: 0px 2px 0px rgba(0,0,0,0.3);}
.map-head .style4 i {display: inline-block; width:30px; height:30px; border-radius:3px; background:#403488; font-size: 18px; color:#FFFC00;  font-family: pb; display:flex; align-items:center; justify-content:center; }
.map-head .style5 i {display: inline-block; width:30px; height:30px; border-radius:3px; background:#00A9C8; font-size: 18px; color:#fff;  font-family: pb; display:flex; align-items:center; justify-content:center; }
.map-head .style5.color2 i {background:#FF7E00;}
.map-head .style6 i {display: inline-block; width:30px; height:30px; background:url('../../images/guide/map-icon1.png') no-repeat center;}
.map-head .style7 i {display: inline-block; width:30px; height:30px; background:url('../../images/guide/map-icon2.png') no-repeat center;}
.map-head .style8 i {display: inline-block; width:30px; height:30px; background:url('../../images/guide/map-icon3.png') no-repeat center;}
.map-head .style9 i {display: inline-block; width:30px; height:30px; background:url('../../images/guide/map-icon9.png') no-repeat center;}
.map-head .style10 i {width: 35px;height:43px;background: url('../../images/guide/ic-map-won.png') no-repeat center}
.map-head .style11 i {width: 35px;height:43px;background: url('../../images/guide/ic-map-bus.png') no-repeat center}
.map-head .style12 i {width: 15px;height:14px;background: url('../../images/guide/ic-triangle-green.png') no-repeat center}
.map-head .style13 i {width: 16px;height:13px;background: url('../../images/guide/ic-triangle-red.png') no-repeat center}
.map-head .style14 i {display: inline-block; width:30px; height:30px; background:url('../../images/guide/map-icon4.png') no-repeat center;}
.map-head .style15 i {display: inline-block; width:30px; height:30px; background:url('../../images/guide/map-icon5.png') no-repeat center;}
.map-head .style16 i {display: inline-block; width:30px; height:30px; background:url('../../images/guide/map-icon6.png') no-repeat center;}
.map-head .style17 i {display: inline-block; width: 30px;height:30px; background: url('../../images/guide/map-icon10.png') no-repeat center;}
.map-head .style18 i {display: inline-block; width: 35px;height:43px; background: url('../../images/guide/map-icon11.png') no-repeat center}
.map-head .style19 i {display: inline-block; width: 35px;height:43px; background: url('../../images/guide/map-icon12.png') no-repeat center}
.map-head .floor {flex-shrink: 0;}
.map-head .floor strong {display: inline-block; font-size: 35px; color:#002D64; font-family: pb; line-height: 1.2;}

.map-head li {margin-right:15px;}
.map-head li .box {font-size: 16px;}

.map-head .style1 i, 
.map-head .style2 i,
.map-head .style3 i,
.map-head .style4 i,
.map-head .style5 i{width:20px; height:20px; background-size:cover; font-size:13px;}

.map-head .style6 i,
.map-head .style7 i,
.map-head .style8 i,
.map-head .style9 i,
.map-head .style10 i,
.map-head .style11 i,
.map-head .style12 i,
.map-head .style13 i,
.map-head .style14 i,
.map-head .style15 i,
.map-head .style16 i,
.map-head .style17 i,
.map-head .style18 i,
.map-head .style19 i {width:20px; height:25px; background-size:contain;}

.map-head li .icon-box {align-items:center;}

.map-head .floor strong {font-size:30px;}

/*
@media screen and (max-width:768px) {
  .map-head li {margin-right:15px;}
  .map-head li .box {font-size: 16px;}
  
  .map-head .style1 i, 
  .map-head .style2 i,
  .map-head .style3 i,
  .map-head .style4 i,
  .map-head .style5 i{width:20px; height:20px; background-size:cover; font-size:13px;}
  
  .map-head .style6 i,
  .map-head .style7 i,
  .map-head .style8 i,
  .map-head .style9 i,
  .map-head .style10 i,
  .map-head .style11 i,
  .map-head .style12 i,
  .map-head .style13 i,
  .map-head .style14 i,
  .map-head .style15 i,
  .map-head .style16 i,
  .map-head .style17 i,
  .map-head .style18 i,
  .map-head .style19 i {width:20px; height:25px; background-size:contain;}
  
  .map-head li .icon-box {align-items:center;}
  
  .map-head .floor strong {font-size:30px;}
}
*/

.map-wrap {border:1px solid #dadada; border-radius:8px; overflow:hidden;}

.img-zoom {text-align: center;}