/* Common */
.area {max-width: 1760px; margin: 0 auto; padding: 0 0 60px 0;}

@media all and (max-width: 1760px) {
    .area {padding: 0 30px 60px 30px;}
}

/* Subject */
.subject {text-align: center;}
.subject h2 {position: relative; display: inline-block; margin: 105px 0 75px 0; font-weight: 500; font-size: 40px; line-height:1.2; color: #111;}
.subject h2:after {content: ''; position: absolute; left: 50%; top: -25px; width: 27px; height: 10px; margin-left: -13px; background: url('../../images/guide/ic_subject.png') no-repeat center center;}

@media all and (max-width: 900px) {
  .subject h2 {margin: 70px 0 50px 0; font-size: 32px;}
}

@media all and (max-width: 500px) {
  .subject h2 {margin: 55px 0 41px 0;}
}

/* Tab */
.tab_div .mobile-tab {display: none;}
.tab_div {margin-bottom: 50px;}
.tab_div.div_4 {margin-top: -30px;}

.tab_div .ul_4 {overflow: hidden; position: relative; border-top: 1px solid #dbdbdb; display: flex; flex-flow: row wrap;}
.tab_div .ul_4::before {content: ""; position: absolute; width: 1px; height: 100%; background: #fff; left: 0; top: 0; z-index: 1;}
.tab_div .ul_4::after {content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: #dbdbdb;}

.tab_div .ul_4 > li {position: relative; width: 25%; border-bottom: 1px solid #dbdbdb;}
.tab_div .ul_4 > li::before {content: ''; position: absolute; left: 0; top: 50%; margin-top: -10px; width: 1px; height: 20px; background: #ccc; transition: opacity 0.3s;}
.tab_div .ul_4 > li > a {position: relative; z-index: 3; display: block; padding: 16px 20px; font-weight: 400; font-size: 17px; text-align: center; color: #666; display: flex; justify-content: center; align-items: center; height: 100%;}
.tab_div .ul_4 > li > a[target=_blank]::after {content: ''; position: relative; top: 3px; display: inline-block; width: 16px; height: 16px; margin: 0 0 0 10px; background:  url('../../images/guide/ic_tab_blank.png') no-repeat 93% center; }

.tab_div .ul_4 > li._active,
.tab_div .ul_4 > li:hover,
.tab_div .ul_4 > li._active > a,
.tab_div .ul_4 > li:hover > a {background: #A90057; color: #fff;}
.tab_div .ul_4 > li:hover::before {opacity: 0;}
.tab_div .ul_4 > li:hover + li::before {opacity: 0;}
.tab_div .ul_4 > li._active > a::before,
.tab_div .ul_4 > li:hover > a::before {opacity: 1;}
.tab_div .ul_4 > li._active > a[target=_blank]::after ,
.tab_div .ul_4 > li:hover > a[target=_blank]::after {background: url('../../images/guide/ic_tab_blank_on.png');}

@media all and (min-width: 861px){
  .tab_div .ul_4 > li > a._active {padding-left: 40px;}
  .tab_div .ul_4 > li > a._active::before {content: ''; position: absolute; left: 20px; top: 50%; width: 18px; height: 18px; margin: -9px 5px 0 0; background: url('../../images/guide/ic_tab_on.png') no-repeat center center; vertical-align: middle;}

  .div_4 .ul_5 {position: relative; overflow: hidden; background: url("../../images/guide/ul_5_bg.png");}
  .div_4 .ul_5 > li {position: relative; float: left; padding: 3px 0; padding-right: 5px;}
  /* .div_4 .ul_5 > li::before {content: ""; position: absolute; width: 100%; height: 1px; background: #DBDBDB; left: 0; top: 50%; z-index: -1;} */
  .div_4 .ul_5 > li > a {display: block; padding: 10px; min-width: 150px; border: 1px solid #F39100; border-radius: 0 25px 25px 25px; text-align: center; background: #fff; font-size: 16px; color: #f39100; transition: all 0.3s;}
  .div_4 .ul_5 > li._active > a, .div_4 .ul_5 > li:hover > a {background: #f39100; color: #fff;}
}

@media all and (max-width:860px) {
    .tab_div {position: relative;}
    .tab_div .ul_4,
    .tab_div .ul_5
    .tab_div .ul_5 {position: relative;}
    .tab_div .ul_4,
    .tab_div .ul_5,
    .tab_div .ul_5 {overflow: hidden; position: absolute; top: 100%; z-index: -1; width: 100%; max-height: 0; margin-bottom: 30px; border: 1px solid #fff; transition: all 0.5s ease;}
    .tab_div ul.on {z-index: 10; max-height: 600px; border-left: 1px solid #d1d1d1; border-right: 1px solid #d1d1d1; border-top: 1px solid #d1d1d1;}
    .tab_div ul li {display: block; width: 100% !important; padding: 0; border: 0}
    .tab_div ul li a {display: block; height: auto; padding: 13px 40px; background: #FAFAFA; border-bottom: 1px solid #d1d1d1; font-size: 16px; text-align: left; line-height: normal;}
    .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; display: block; width: 100%; padding: 16px 20px; background: #A90057 url('../../images/guide/ic_tab_sel_rever.png') no-repeat 97% center; text-align: left; font-weight: 400; font-size: 16px; color: #fff; border: 1px solid #A90057;}
    .tab_div .mobile-tab.depth5 {background: #fff url('../../images/guide/ic_tab4_arrow.png') no-repeat 97% center; border: 1px solid #f39100; color: #f39100;}


    .tab_div .ul_4 > li {border: 0;}
    .tab_div .ul_4 > li > a {display: block; font-size: 15px; text-align: left; color: #464646; width: 100%;}
    .tab_div .ul_4 > li > a::before {display: none;}
    .tab_div .ul_4 > li._active > a,
    .tab_div .ul_4 > li:hover > a {background: #FFDFEF; color: #a90057;}

    .tab_div .ul_5 > li {margin: 0;}
    .tab_div .ul_5 > li > a::before {height: 0;}
    .tab_div .ul_5 > li > a {padding: 16px 20px; border-bottom: 0; font-size: 15px; text-align: left; color: #464646;}
    .tab_div .ul_5 > li._active > a,
    .tab_div .ul_5 > li:hover > a {background: #F39100; color: #fff;}
}

/* Category */
.category {padding: 6px; background: url('../../images/guide/ic_cate_bg.png');}
.category ul {padding: 16px 0; background: #fff;}
.category li {float: left; width: 16.666%; padding: 10px 0;}
.category li a {margin-left: 25px; font-weight: 400; font-size: 16px; color: #666;}
.category li.on a,
.category li:hover a {font-weight: 500; color: #0068b8;}
.category li a::before {content: ''; position: relative; top: -2px; display: inline-block; margin: 0 10px 0 0; width: 22px; height: 20px; background: url('../../images/guide/ic_cate_arrow.png') no-repeat center bottom; vertical-align: middle; transition: .4s;}
.category li.on a::before,
.category li:hover a::before {background-position: center top;}
.category li a span {position: relative;}
.category li a span::after {content: ''; position: absolute; left: 0; bottom: 0; width: 0; height: 1px; background: #0068b8; transition: 0s;}
.category li.on a span::after,
.category li:hover a span::after {width: 100%; transition: .4s;}

@media all and (max-width: 1200px) {
    .category li {width: 25%;}
}

@media all and (max-width: 900px) {
    .category li {width: 33.333%;}
}

@media all and (max-width: 700px) {
    .category li {width: 50%;}
}

@media all and (max-width: 500px) {
    .category li {width: 100%;}
}

/* Heading */
.objHeading_h2 {position: relative; display: block; margin-top: 65px; padding-left: 30px; font-weight: 500; font-size: 23px; letter-spacing: -0.5px; line-height :1.5; color: #222; }
.objHeading_h2::before {content: ''; position: absolute; left: 0; top: 4px; width: 21px; height: 23px; background: url('../../images/guide/ic_h2.png') no-repeat center center; }
.objHeading_h3 {position: relative; display: block; margin-top: 20px; padding-left: 30px; font-weight: 500; font-size: 19px; line-height: 1.5; letter-spacing: -0.5px; color: #a90057;}
.objHeading_h3::before {content: ''; position: absolute; left: 0; top: 1px; width: 20px; height: 21px; background: url('../../images/guide/ic_h3.png') no-repeat center center; }
.objHeading_h4 {position: relative; display: block; margin-top: 15px; padding-left: 15px; font-weight: 400; font-size: 17px; line-height: 1.5; letter-spacing: -0.5px; color: #670461;}
.objHeading_h4::before {content: ''; position: absolute; left: 0; top: 5px; width: 3px; height: 13px; background: #670461;}
.objHeading_h5 {position: relative; display: block; margin-top: 30px; padding-left: 19px; font-weight: 400; font-size: 18px; line-height: 1.5; letter-spacing: -0.5px; color: #333;}
.objHeading_h5::before {content: ''; position: absolute; left: 0; top: 9px; width: 10px; height: 10px; border: 2px solid #139cb4; border-radius: 100%; }

@media all and (max-width: 768px){
  .objHeading_h2 {font-size: 20px; margin-top: 35px;}
  .objHeading_h2::before {top: 3px;}
  .objHeading_h3 {font-size: 17px;}
  .objHeading_h3::before {top: 0;}
}


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

._objHtml.no-margin {margin-top: 0px !important;}
._objHtml.no-margin > div {margin-top: 0px !important;}

/* Description */
.con-desc {font-size: 17px; line-height: 26px; letter-spacing: 0px; color: #666;}
.con-desc strong {font-weight: 500;}
.con-desc.small {font-size: 15px;}

.text-color1 {color: #a90056; font-weight: 500;}
.text-color2 {color: #ff8400; font-weight: 500;}
.text-color3 {color: #0087d5; font-weight: 500;}

/* List Type */
.con-list1 > ul > li {position: relative; margin: 9px 0 0 0; padding-left: 20px; font-size: 15px; line-height: 1.6; letter-spacing: 0px; font-weight: 400; color: #666;}
.con-list1 > ul > li::before {content: ''; position: absolute; left: 0; top: 8px; width: 8px; height: 7px; background: url('../../images/guide/ic_list1.png') no-repeat center center}
.con-list1 > ul > li strong {font-weight: 400; color: #1c1c1c;}

.con-list2 > ul > li {position: relative; margin: 5px 0 0 0; padding-left: 13px; font-size: 14px; line-height: 1.6; letter-spacing: 0px; font-weight: 400; color: #919191;}
.con-list2 > ul > li::before {content: ''; position: absolute; left: 0; top: 8px; width: 4px; height: 4px; background: #A8A9AD}
.con-list2 > ul > li strong {font-weight: 400; color: #1c1c1c;}

.num-list > ul > li {position: relative; padding-left: 25px; font-size: 15px; line-height: 25px; color: #666666; font-weight: 400;}
.num-list > ul > li .num {position: absolute; width: 15px; height: 15px; text-align: center; border-radius: 50%; left: 0; top: 6px; font-family: "Mont Medium"; font-size: 10px; color: #fff; font-weight: 500; background: #7A7A7A; line-height: 15px;}

.arrow-list > ul > li {position: relative; margin: 5px 0 0 0; padding-left: 20px; font-size: 14px; line-height: 1.6; letter-spacing: 0px; font-weight: 400; color: #919191;}
.arrow-list > ul > li::before {content: ''; position: absolute; left: 0; top: 6px; width: 9px; height: 7px; background: url("../../images/guide/ic_arrow.png") no-repeat center;}
.arrow-list > ul > li strong {font-weight: 400; color: #1c1c1c;}


/* Notify Text */
.point-txt {padding-left: 26px; font-size: 13px; line-height: 2; letter-spacing: 0px;}
.point-txt.point-txt1 {background: url('../../images/guide/ic_noti1.png') no-repeat left 3px; color: #43505d;}
.point-txt.point-txt2 {background: url('../../images/guide/ic_noti2.png') no-repeat left 3px; color: #d90000;}
.point-txt.point-txt3 {background: url('../../images/guide/ic_noti3.png') no-repeat left 3px; color: #ff8400;}

@media all and (max-width: 768px){
  .con-desc {font-size: 14px; line-height: 22px;}
  .con-list1 > ul > li {font-size: 13px;}
  .con-list1 > ul > li::before {top: 5px;}
  .con-list2 > ul > li {font-size: 12px;}
  .con-list2 > ul > li::before {top: 6px;}
  .arrow-list > ul > li {font-size: 12px;}
  .num-list > ul > li {font-size: 13px;}
  .num-list > ul > li .num {top: 4px;}
  .point-txt {font-size: 11px; line-height: 18px; padding-top: 3px; min-height: 22px;}
  .point-txt.point-txt1 {background: url('../../images/guide/ic_noti1.png') no-repeat left 1px; color: #43505d;}
  .point-txt.point-txt2 {background: url('../../images/guide/ic_noti2.png') no-repeat left 1px; color: #d90000;}
  .point-txt.point-txt3 {background: url('../../images/guide/ic_noti3.png') no-repeat left 1px;color: #ff8400;}
}

/* Table */
.table-caption {text-align: right; font-size: 13px; line-height: 34px; color: #7e7e7e; font-weight: 400;}
.con-table-wrap {position: relative; line-height: 1.6;}
.con-table:before {content: ''; position: absolute; right: -2px; top: 0px; width: 3px; height: 100%; background: #FFF; z-index: 2;}
.con-table {position: relative; line-height: 1.6; overflow: hidden;}
.con-table:after {content: ''; position: absolute; right: 0px; top: 0px; width: 1px; height: 100%; background: #fff;}
.con-table table {position: relative; overflow: hidden;}
.con-table table:before {content: ''; position: absolute; right: 0px; top: 0px; width: 1px; height: 100%; background: #FFF; z-index: 2;}
.con-table table:after {content: ''; position: absolute; left: 0px; top: 0px; width: 100%; height: 2px; background: #104650}
.con-table thead th {padding: 14px 10px; background: #f4f4f4; border-right: 1px solid #dddee0; border-bottom: 1px solid #dddee0; font-weight: 400; font-size: 16px; color: #111;}
.con-table tbody {display: table-header-group;}
.con-table tbody th {padding: 13px 20px; background:#fbfbfb; border-right: 1px solid #dddee0; border-bottom: 1px solid #dddee0; font-weight: 400; color: #000; font-size: 15px;}
.con-table tbody td {padding: 13px 20px; background:#fff; border-right: 1px solid #dddee0; border-bottom: 1px solid #dddee0; font-weight: 400; text-align: left; color: #666; font-size: 15px;}
.con-table tbody td .link {position: relative; color: #666;}
.con-table tbody td .link::after {content: ''; position: relative; top: -2px; display: inline-block; width: 15px; height: 15px; background: url('../../images/guide/ic_tbl_link.png') no-repeat center center; margin-left: 10px; vertical-align: middle;}
.con-table .list > li {position: relative; padding-left: 10px;}
.con-table .list > li:after {content: ''; position: absolute; left: 0; top: 11px; width: 4px; height: 4px; background: #A8A9AD; border-radius: 100%;}
.con-table .align-l {text-align: left;}
.con-table .align-c {text-align: center;}
.con-table .align-r {text-align: right;}
.con-table strong {font-weight: 400; color: #000;}
.con-table tbody td a {color: #666;}
.con-table tbody td a:hover {color: #A90057; }
.con-table .btn-style.round-ico.type1:hover {color: #fff;}

.con-table .homepage {position: relative; display: inline-block; padding: 5px 15px; padding-right: 40px; font-size: 13px; color: #505050; border-radius: 20px; border: 1px solid #B2B2B2;}
.con-table .homepage::after {content: ''; position: absolute; top: 7px; right: 20px; display: inline-block; width: 15px; height: 15px; background: url('../../images/guide/ic_tbl_link.png') no-repeat center center; vertical-align: middle;}

.con-table table table::before {right: -1px; left: auto;}
.con-table table table thead th {padding: 14px 10px; background: #f4f4f4; border-right: 1px solid #dddee0; border-bottom: 1px solid #dddee0; font-weight: 400; font-size: 16px; font-weight: normal; color: #111;}
.con-table table table::after {content: ''; position: absolute; left: 0px; top: 0px; width: 100%; height: 2px; background: #5b5b5b}

.con-table.ver-t tbody td {vertical-align: top;}

@media all and (max-width:960px) {
  .con-table-wrap {overflow-x: hidden;}
  .con-table-wrap:after {content: ''; position: absolute; right: 0px; top: 0px; width: 100%; height: 100%; background: url('../../images/guide/mobile-tbl.png') no-repeat center 40px;}
  .con-table-wrap.on:after {display: none;}
  .con-table {width: 1300px; margin-bottom: 20px;}
}

/* Button Style */
.btn-style.round-ico {position: relative; display: inline-block; padding: 14px 28px; padding-right: 50px; border-radius: 30px; font-weight: 400; font-size: 15px; color: #fff; cursor: pointer; margin: 2px 0;}
.btn-style.round-ico.type1 {background: #FF8400;}
.btn-style.round-ico.type1:hover {background: url("../../images/guide/type1_overbg.jpg");}
.btn-style.round-ico.type1:after {content: ''; position: absolute; top: 50%; margin: 0px 0 0 10px; margin-top: -9px; display: inline-block; width: 18px; height: 18px;  background: url('../../images/guide/ic_btn1.png') no-repeat center right; vertical-align: middle; right: 20px;}
.btn-style.round-ico.type2 {background: #A90057;}
.btn-style.round-ico.type2:hover {background: url("../../images/guide/type2_overbg.jpg");}
.btn-style.round-ico.type2:after {content: ''; position: absolute; top: 50%; margin: 0px 0 0 10px; margin-top: -9px; display: inline-block; width: 18px; height: 18px;   background: url('../../images/guide/ic_btn2.png') no-repeat center right; vertical-align: middle; right: 20px;}
.btn-style.round-ico.type3 {background: #670461;}
.btn-style.round-ico.type3:hover {background: url("../../images/guide/type3_overbg.jpg");}
.btn-style.round-ico.type3:after {content: ''; position: absolute; top: 50%; margin: 0px 0 0 10px; margin-top: -11.5px; display: inline-block; width: 21px; height: 21px;  background: url('../../images/guide/ic_view.png') no-repeat center right; vertical-align: middle; right: 20px;}


.btn-style.round {display: inline-block; padding: 14px 42px; background: #fff; border-radius: 30px; font-weight: 400; font-size: 15px; margin: 2px 0;}
.btn-style.round.type1 {border: 1px solid #0067c3; color: #0067c3;}
.btn-style.round.type1:hover {background: #0067C3; color: #fff;}
.btn-style.round.type2 {border: 1px solid #ce2856; color: #ce2856;}
.btn-style.round.type2:hover {background: #ce2856; color: #fff;}
.btn-style.round.type3 {border: 1px solid #ff8400; color: #ff8400;}
.btn-style.round.type3:hover {background: #ff8400; color: #fff;}
.btn-style.round.type4 {background: #8c8c8c; border: 1px solid #8c8c8c; color: #fff;}
.btn-style.round.type4:hover {background: #4E4E4E; border-color: #4E4E4E;}

.btn-style.round.type5 {border: 1px solid #1C3C8F; color: #1C3C8F;}
.btn-style.round.type5:hover {background: #1C3C8F; border-color: #1C3C8F; color: #fff;}
.btn-style.round.type6 {background: #CE2856; border: 1px solid #CE2856; color: #fff;}
.btn-style.round.type6:hover {background: #8C0027; border-color: #8C0027;}

.btn-style.round-ico-small {display: inline-block; padding: 5px 15px; border: 1px solid #b2b2b2; border-radius: 30px; font-weight: 400; font-size: 14px; color: #505050; margin: 2px 0;}
.btn-style.round-ico-small.type1:hover {border-color: #0067C3; color: #0067C3;}
.btn-style.round-ico-small.type1:after {content: ''; display: inline-block; width: 15px; height: 13px; margin: -4px 0 0 7px;  background: url('../../images/guide/ic_download.png') no-repeat center top; vertical-align: middle;}
.btn-style.round-ico-small.type1::before {content: ""; display: inline-block; width: 22px; height: 22px; background: url("../../images/guide/ic_hwp.jpg") no-repeat; vertical-align: middle; margin-right: 10px;}
.btn-style.round-ico-small.type1:hover::after {background: url('../../images/guide/ic_download_cl1.png') no-repeat center top;}

.btn-style.round-ico-small.type2:hover {border-color: #8c0027; color: #8c0027;}
.btn-style.round-ico-small.type2:after {content: ''; display: inline-block; width: 15px; height: 13px; margin: -4px 0 0 7px;  background: url('../../images/guide/ic_download.png') no-repeat center top; vertical-align: middle;}
.btn-style.round-ico-small.type2::before {content: ""; display: inline-block; width: 22px; height: 22px; background: url("../../images/guide/ic_pdf.jpg") no-repeat; vertical-align: middle; margin-right: 10px;}
.btn-style.round-ico-small.type2:hover::after {background: url('../../images/guide/ic_download_cl2.png') no-repeat center top; }

.btn-style.round-ico-small.type3:hover {border-color: #005326; color: #005326;}
.btn-style.round-ico-small.type3:after {content: ''; display: inline-block; width: 15px; height: 13px; margin: -4px 0 0 7px;  background: url('../../images/guide/ic_download.png') no-repeat center top; vertical-align: middle;}
.btn-style.round-ico-small.type3::before {content: ""; display: inline-block; width: 22px; height: 22px; background: url("../../images/guide/ic_excel.jpg") no-repeat; vertical-align: middle; margin-right: 10px;}
.btn-style.round-ico-small.type3:hover::after {background: url('../../images/guide/ic_download_cl3.png') no-repeat center top; }

.btn-style.rect {display: inline-block; padding: 6px 22px; font-weight: 400; font-size: 13px; margin: 2px 0;}
.btn-style.rect.type1 {background: #00baff; border: 1px solid #00baff; color: #fff;}
.btn-style.rect.type1:hover {background: #0079AC; border-color: #0079AC;}
.btn-style.rect.type2 {background: #fff; border: 1px solid #ce2856; color: #ce2856;}
.btn-style.rect.type2:hover {background: #ce2856; color: #fff;}

@media all and (max-width: 768px){
  .btn-style.round-ico {font-size: 13px; padding: 12px 50px 12px 20px;}
  .btn-style.round {font-size: 13px; padding: 12px 20px;}
  .btn-style.round-ico-small {font-size: 12px; padding: 5px 10px;}
}

/* PDF Viewer */
.pdf-viewer .info {padding: 5px; background: url('../../images/guide/ic_cate_bg.png');}
.pdf-viewer .box {padding: 30px 0 30px 310px; background: #fff url('../../images/guide/ic_pdf.png') no-repeat 60px 40px;}
.pdf-viewer .text li {display: table; table-layout: fixed; margin-bottom: 6px; font-weight: 400; font-size: 14px; color: #666;}
.pdf-viewer .text li .num {display: table-cell; vertical-align: top;}
.pdf-viewer .text li .num i {display: inline-block; width: 26px; height: 26px; background: #55555b; border-radius: 100%; font-family: 'Titil SemiBold'; text-align: center; line-height: 26px; color: #fff; font-size: 16px;}
.pdf-viewer .text li .text {display: table-cell; padding-left: 10px; vertical-align: middle;}
.pdf-viewer .buttons a {position: relative; display: inline-block; margin-top: 10px; margin-right: 15px; padding: 15px 80px 15px 20px; background: #AF0055; border-radius: 5px; font-size: 14px; color: #fff;}
.pdf-viewer .buttons a:hover {background: #8C0027;}
.pdf-viewer .buttons a::after {content: ''; position: absolute; right: 0; top: 0; width: 55px; height: 100%; border-radius: 0 5px 5px 0;}
.pdf-viewer .buttons a.btn1::after {background: #BB266E url('../../images/guide/ic_pdf_btn1.png') no-repeat center center;}
.pdf-viewer .buttons a.btn2::after,
.pdf-viewer .buttons a.btn3::after {background: #BB266E url('../../images/guide/ic_pdf_btn2.png') no-repeat center center;}
.pdf-viewer .viewer {margin-top: 50px; padding: 60px; background: #ececec; border: 1px solid #daddde; text-align: center;}
.pdf-viewer .viewer .drop-shadow {display: inline-block; box-shadow: 0px 0px 7px -1px rgba(0,0,0,0.79);}
.pdf-viewer .viewer .drop-shadow img {width: 100%;}

@media all and (max-width: 850px) {
    .pdf-viewer .box {padding: 220px 25px 25px 25px; background-position: center 40px;}
}

@media all and (max-width: 660px) {
    .pdf-viewer .buttons a {width: 100%;}
}

/* Ready */
.wrap-ready {padding: 5px; background: url('../../images/guide/ic_cate_bg.png'); text-align: center;}
.wrap-ready .box {padding: 55px 20px 60px 20px; background: #fff url('../../images/guide/bg-ready.jpg') no-repeat center top; background-size: cover;}
.wrap-ready strong {position: relative; display: inline-block; padding: 300px 0 0 0; background: url('../../images/guide/ic_ready.png') no-repeat center top; font-weight: 500; font-size: 35px; color: #222;}
.wrap-ready strong::before {content: ''; position: absolute; left: -35px; bottom: 45px; width: 26px; height: 22px; background: url('../../images/guide/ico-deco-ready1.png') no-repeat center center;}
.wrap-ready strong::after {content: ''; position: absolute; right: -35px; bottom: 45px; width: 26px; height: 22px; background: url('../../images/guide/ico-deco-ready2.png') no-repeat center center;}
.wrap-ready em {color: #a90057;}
.wrap-ready p {font-weight: 500; font-size: 18px; color: #555;}

@media all and (max-width: 768px) {
	.wrap-ready .box {padding: 40px 20px;}
	.wrap-ready strong::before {content: ''; position: absolute; left: 0; bottom: 25px; width: 16px; height: 22px; background: url('../../images/guide/ico-deco-ready1.png') no-repeat center center; background-size: 16px auto;}
	.wrap-ready strong::after {content: ''; position: absolute; right: 0; bottom: 25px; width: 16px; height: 22px; background: url('../../images/guide/ico-deco-ready2.png') no-repeat center center; background-size: 16px auto;}

  .wrap-ready strong {position: relative; background-size: 100% auto; font-size: 22px; padding: 240px 20px 0;}
  .wrap-ready p {font-size: 16px;}
}

.wrap-login {padding: 5px; background: url('../../images/guide/ic_cate_bg.png'); text-align: center;}
.wrap-login .box {padding: 55px 20px 60px 20px; background: #fff url('../../images/guide/bg-ready.jpg') no-repeat center top; background-size: cover;}
.wrap-login p {position: relative; display: inline-block; padding: 300px 0 0 0; font-size: 18px; line-height: 28px; color: #555555; font-weight: 500;}
.wrap-login p::before {content: ""; position: absolute; width: 100%; height: 274px; left: 0; top: 0; background: url("../../images/guide/login_bg.png") no-repeat center; background-size: contain;}
.wrap-login p span {color: #a90057;}

@media all and (max-width: 768px) {
	.wrap-login .box {padding: 40px 20px;}
  .wrap-login p {font-size: 16px;}
}


.sub-txt-bx {position: relative; text-align: center; padding: 25px 4%;}
.sub-txt-bx::before {content: ""; position: absolute; width: 100%; height: 6px; background: url("../../images/guide/txt_bg_1.jpg"); left: 0; top: 0;}
.sub-txt-bx::after {content: ""; position: absolute; width: 100%; height: 6px; background: url("../../images/guide/txt_bg_2.jpg"); left: 0; bottom: 0;}
.sub-txt-inner::before {content: ""; position: absolute; width: 6px; height: 50%; left: 0; top: 0; background: url("../../images/guide/txt_bg_1.jpg");}
.sub-txt-inner::after {content: ""; position: absolute; width: 6px; height: 50%; right: 0; top: 0; background: url("../../images/guide/txt_bg_1.jpg");}
.sub-txt-inner p::before {content: ""; position: absolute; width: 6px; height: 50%; left: 0; bottom: 0; background: url("../../images/guide/txt_bg_2.jpg");}
.sub-txt-inner p::after {content: ""; position: absolute; width: 6px; height: 50%; right: 0; bottom: 0; background: url("../../images/guide/txt_bg_2.jpg");}
.sub-txt-inner p {font-size: 16px; color: #666666;}

@media all and (max-width: 768px){
  .sub-txt-inner p {font-size: 14px;}
}

.top-title-bx {padding: 5px; background: url('../../images/guide/ic_cate_bg.png');}
.top-title-inner {background: #fff; padding: 15px 2% 25px; overflow: hidden;}
.top-title-icon {float: left; width: 250px; text-align: center; vertical-align: top;}
.top-title-icon span {position: relative; display: inline-block;}
.top-title-icon.icon1 span::after {content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url("../../images/guide/toptitle_icon1.png") no-repeat center; }
.top-title-icon.icon2 span::after {content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url("../../images/guide/toptitle_icon2.png") no-repeat center; }
.top-title-icon.icon3 span::after {content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url("../../images/guide/toptitle_icon3.png") no-repeat center; }
.top-title-icon.icon4 span::after {content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url("../../images/guide/toptitle_icon4.png") no-repeat center; }
.top-title-icon.icon5 span::after {content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url("../../images/guide/toptitle_icon5.png") no-repeat center; }
.top-title-icon.icon6 span::after {content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url("../../images/guide/toptitle_icon6.png") no-repeat center; }
.top-title-icon.icon7 span::after {content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url("../../images/guide/toptitle_icon7.png") no-repeat center; }
.top-title-icon.icon8 span::after {content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url("../../images/guide/toptitle_icon8.png") no-repeat center; }
.top-title-icon.icon9 span::after {content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url("../../images/guide/toptitle_icon9.png") no-repeat center; }
.top-title-icon.icon10 span::after {content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url("../../images/guide/toptitle_icon10.png") no-repeat center; }
.top-title-icon.icon11 span::after {content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url("../../images/guide/toptitle_icon11.png") no-repeat center; }
.top-title-info {float: left;  vertical-align: top; width: calc(100% - 250px); padding-left: 2%; padding-top: 22px;}
.top-title-info > strong {font-size: 20px; line-height: 35px; color: #222222; font-weight: 500;}
.top-title-info > p {font-size: 16px; line-height: 30px; color: #666666; font-weight: 400; padding: 10px 0 20px;}

.top-title-bx.one-line-bx {}
.top-title-bx.one-line-bx .top-title-inner {display: table; width: 100%; height: 100%;}
.top-title-bx.one-line-bx .top-title-icon {float: none; display: table-cell; vertical-align: top;}
.top-title-bx.one-line-bx .top-title-info {float: none; display: table-cell; vertical-align: middle; padding-top: 0;}

.icon-bx {background: #A90057; padding: 10px;}
.icon-bx li {display: inline-block; vertical-align: top;}


@media all and (max-width: 768px){
  .top-title-inner {padding: 0 2% 25px;}
  .top-title-icon {float: none; margin: 0 auto; margin-bottom: 20px;}
  .top-title-info {float: none; width: 100%; text-align: center; padding-top: 0;}
  .top-title-info ul {text-align: left;}
  .top-title-info > p {font-size: 14px; line-height: 25px; padding-bottom: 0;}

  .top-title-bx.one-line-bx .top-title-inner {display: block; width: 100%; height: 100%;}
  .top-title-bx.one-line-bx .top-title-icon {float: none; display: block; vertical-align: top;}
  .top-title-bx.one-line-bx .top-title-info {float: none; display: block; vertical-align: middle; padding-top: 0;}
}

.manage-bx {border-top: 1px solid #1F303E; border-bottom: 1px solid #1F303E;}
.manage-bx-inner {display: table; width: 100%;}
.manage-bx-inner > div {display: table-cell;vertical-align: middle;}
.manage-title {width: 215px; text-align: center; padding: 0 30px; height: 75px;}
.manage-title p {padding: 20px 0; padding-left: 50px; background: url("../../images/guide/ic_manage.png") no-repeat left center; font-size: 14px; color: 000000; font-weight: 500;}
.manage-info p {font-size: 14px; line-height: 30px; color: #333333;}
.manage-date {width: 235px; text-align: center;}
.manage-date p {font-size: 14px; color: #333333;}

@media all and (max-width: 768px){
  .manage-bx-inner {display: block; overflow: hidden; text-align: left; padding: 15px 20px;}
  .manage-bx-inner > div {display: block;}
  .manage-title {width: 100%; height: auto; margin-bottom: 0px; text-align: left; padding: 0;}
  .manage-title p {display: inline-block; padding: 0; padding-left: 50px; height: 30px; line-height: 30px;}
  .manage-info {padding-left: 50px;}
  .manage-date {width: 100%; text-align: left; padding-left: 50px;}
}


.align-c {text-align: center;}
.align-r {text-align: right;}
.align-l {text-align: left;}