@charset 'utf-8';

/* Container */
.wrap-contents .container {max-width:1400px;}

@media all and (max-width: 1400px) {
  .wrap-contents .container {padding: 0 20px;}
}

/* Heading */
.objHeading_h2 {position: relative; display: block; margin-top: 31px; font-family: 'Dream Medium'; font-size: 26px; letter-spacing: -0.5px; line-height :1.5; color: #111; }
/* .objHeading_h2::before {content: ''; position: absolute; left: 0; top: 0px; width: 19px; height: 13px; background: url('../../images/guide/bul_h2.png') no-repeat center center; } */
.objHeading_h3 {position: relative; display: inline-block; margin-top: 26px; margin-bottom: 5px; font-family:'Dream Medium'; font-size:22px; letter-spacing: -0.5px; line-height: 1.5; color: #0068b7;}
.objHeading_h3::before {content: ''; position: absolute; left: 100%; top: -7px; width: 8px; height: 8px; background: #0068b7; border-radius: 100%;}
.objHeading_h4 {position: relative; display: block; margin-top: 42px; font-family:'Dream Medium'; line-height: 1.5; font-size: 20px; letter-spacing: -0.5px; color: #336185;}
.objHeading_h4::before {content: ''; position: absolute; left: 0; top: -7px; width: 20px; height: 2px; background: #046478; }
.objHeading_h5 {position: relative; display: block; margin-top: 30px; font-family: 'Dream Medium'; font-size: 18px; line-height: 1.5; letter-spacing: -0.5px; color: #08b2b1;}
/* .objHeading_h5::before {content: ''; position: absolute; left: 0; top: 9px; width: 10px; height: 10px; border: 2px solid #139cb4; border-radius: 100%; } */

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

/* Subject */
.subject {padding-top: 15px; text-align: left;}
.subject h2 {position: relative; display: inline-block; font-family: 'Dream Medium'; font-size: 46px; line-height:1.2;}


/* Description */
.con-desc {font-family: 'Dream Regular'; font-size: 18px; line-height: 1.6; letter-spacing: -0.5px; color: #333;}
.con-desc strong {font-family: 'Dream Regular';}
._objHtml.no-margin {margin-top: 0px !important;}
._objHtml.no-margin > div {margin-top: 0px !important;}
.sub-indent {padding-left: 20px;}
.img-ready {margin-top: 20px; padding: 20px; border:1px solid #d1d1d1; text-align: center;}

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

/* Point Color */
.p-color1 {color: #183d93;}
.p-color2 {color: #018cff;}
.p-color3 {color: #eb8105;}

.txt-color1 {color: #0177ad;}
.txt-color2 {color: #dd0000;}
.txt-color3 {color: #0068b7;}
.txt-color4 {color: #00b622;}

.txt-bold {font-family: 'Dream Regular';}

/* 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 table:after {content: ''; position: absolute; left: 0px; top: 0px; width: 100%; height: 2px; background: #111}
.con-table table:before {content: ''; position: absolute; right: 0px; top: 0px; width: 1px; height: 100%; background: #FFF;}
.con-table thead th {padding: 13px 10px; background: #f7f8f9; border-right: 1px solid #dddee0; border-bottom: 1px solid #dddee0; font-family: 'Dream Regular'; font-size: 18px; font-family: 'Dream Regular'; font-weight: 400; color: #111;}
.con-table tbody {display: table-header-group;}
/* .con-table tbody::after {content:''; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: #8f8f8f;} */
.con-table tbody th {padding: 12px 20px; background:#fbfbfb; border-right: 1px solid #dddee0; border-bottom: 1px solid #ccd0d7; font-family: 'Dream Regular'; font-family: 'Dream Regular'; font-size: 16px; font-weight: 400; color: #000;}
.con-table tbody td {padding: 12px 20px; background:#fff; border-right: 1px solid #dddee0; border-bottom: 1px solid #dddee0; font-family: 'Dream Regular'; font-size: 16px; text-align: left; color: #333;}
.con-table tbody td a {color: #333;}
.con-table .list > li {position: relative; padding-left: 20px;}
.con-table .list > li:after {content: ''; position: absolute; left: 0; top: 9px; width: 8px; height: 8px; background: #b4c1dd; 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-family: 'Dream Regular'; color: #000;}

@media all and (max-width:960px) {
  .con-table {overflow-x: hidden;}
  .con-table table {width: 1300px;}
  .con-table:after {content: ''; position: absolute; right: 0px; top: 0px; width: 100%; height: 100%; background: rgba(60,81,82,0.4) url('../../images/guide/img_mobile_text.png') no-repeat center 40px;}
  .con-table.on:after {display: none;}
  .con-table thead th,
  .con-table tbody th,
  .con-table tbody td {padding: 10px 8px; font-size: 16px;}
}

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

.tab_div .ul_3 {overflow: hidden; position: relative; margin-bottom: 40px; border-top: 2px solid #0068b7; border-left: 1px solid #ccc;}
.tab_div .ul_3 > li {position: relative; float: left; width: 20%; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc;}
.tab_div .ul_3 > li::after {content: ''; position: absolute; left: -1px; top: -1px; width: calc(100% + 2px); height: calc(100% + 2px); background: #0068b7; box-sizing: border-box; opacity: 0; transition: opacity 0.5s;}
.tab_div .ul_3 > li > a {position: relative; z-index: 3; display: block; padding: 15px 20px 16px 20px; font-family: 'Dream Regular'; font-size: 18px; letter-spacing: -0.5px; text-align: center; color: #333;}
.tab_div .ul_3 > li > a[target=_blank]::after {content: ''; position: relative; top: 2px; display: inline-block; width: 16px; height: 16px; margin: 0 0 0 5px; background:  url('../../images/guide/tab-link-blank.png') no-repeat 93% center; }

.tab_div .ul_3 > li._active > a,
.tab_div .ul_3 > li:hover > a {font-family: 'Dream Medium'; color: #fff;}
.tab_div .ul_3 > li:hover::before {opacity: 0;}
.tab_div .ul_3 > li:hover + li::before {opacity: 0;}
.tab_div .ul_3 > li._active::after,
.tab_div .ul_3 > li:hover::after {opacity: 1;}
.tab_div .ul_3 > li._active > a::before,
.tab_div .ul_3 > li:hover > a::before {background: #89cdd9 url('../../images/guide/more_arrow_1_white.png') no-repeat 58% center; border-color: #89cdd9;}
.tab_div .ul_3 > li._active > a[target=_blank]::after ,
.tab_div .ul_3 > li:hover > a[target=_blank]::after {background: url('../../images/guide/tab-link-blank-ov-white.png');}

.tab_div .ul_4 {overflow: hidden; position: relative; margin-bottom: 40px; border-top: 2px solid #0068b7; border-left: 1px solid #ccc;}
.tab_div .ul_4 > li {position: relative; float: left; width: 20%; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc;}
.tab_div .ul_4 > li::after {content: ''; position: absolute; left: -1px; top: -1px; width: calc(100% + 2px); height: calc(100% + 2px); background: #0068b7; box-sizing: border-box; opacity: 0; transition: opacity 0.5s;}
.tab_div .ul_4 > li > a {position: relative; z-index: 3; display: block; padding: 15px 20px 16px 20px; font-family: 'Dream Regular'; font-size: 18px; letter-spacing: -0.5px; text-align: center; color: #333;}
.tab_div .ul_4 > li > a[target=_blank]::after {content: ''; position: relative; top: 2px; display: inline-block; width: 16px; height: 16px; margin: 0 0 0 5px; background:  url('../../images/guide/tab-link-blank.png') no-repeat 93% center; }

.tab_div .ul_4 > li._active > a,
.tab_div .ul_4 > li:hover > a {font-family: 'Dream Medium'; 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::after,
.tab_div .ul_4 > li:hover::after {opacity: 1;}
.tab_div .ul_4 > li._active > a::before,
.tab_div .ul_4 > li:hover > a::before {background: #89cdd9 url('../../images/guide/more_arrow_1_white.png') no-repeat 58% center; border-color: #89cdd9;}
.tab_div .ul_4 > li._active > a[target=_blank]::after ,
.tab_div .ul_4 > li:hover > a[target=_blank]::after {background: url('../../images/guide/tab-link-blank-ov-white.png');}

.tab_div.type2 .ul_4 {border-top: 1px solid #ccc;}
.tab_div.type2 .ul_4 > li > a {padding: 11px 20px 12px 20px; background: #f5f5f5;}
.tab_div.type2 .ul_4 > li._active > a,
.tab_div.type2 .ul_4 > li:hover > a {background: #fff; color: #0068b7;}
.tab_div.type2 .ul_4 > li::after {display: none;}
.tab_div.type2 .ul_4 > li::before {content: ''; position: absolute; left: 0; top: 0; z-index: 10; width: 0%; height: 3px; background: #0068b7; transition: 1s;}
.tab_div.type2 .ul_4 > li._active::before,
.tab_div.type2 .ul_4 > li:hover:before {width: 100%; opacity: 1;}
.tab_div.type2 .ul_4 > li:hover > a[target=_blank]::after {background: url('../../images/guide/tab-link-blank-ov.png');}

.tab_div .ul_5 {position: relative; display: inline-block; width: 100%;}
.tab_div .ul_5::after {content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; background: #d3d3d3;}
.tab_div .ul_5 > li {position: relative; float: left; border-bottom: 1px solid #CBCBCB;}
.tab_div .ul_5 > li::after {content: ''; position: absolute; left: 50%; bottom: -25px; z-index: 10; width: 40px; height: 31px; box-sizing: border-box; background: url('../../images/guide/arrow-tab5.png'); opacity: 0; transform: translate(-50%, 0); transition: opacity 0.5s;}
.tab_div .ul_5 > li > a {position: relative; display: block; padding: 15px 35px 16px 35px; font-size: 16px; font-family: 'Dream Regular'; letter-spacing: -0.5px; color: #333; z-index: 3;}
.tab_div .ul_5 > li > a[target=_blank]::after {content: ''; position: relative; top: 2px; display: inline-block; width: 16px; height: 16px; margin: 0 0 0 5px; background:  url('../../images/guide/tab-link-blank.png') no-repeat 93% center; }

.tab_div .ul_5 > li._active > a,
.tab_div .ul_5 > li:hover > a {font-family: 'Dream Regular'; color: #00a0e9;}
.tab_div .ul_5 > li._active::after,
.tab_div .ul_5 > li:hover::after {opacity: 1;}
.tab_div .ul_5 > li._active > a[target=_blank]::after ,
.tab_div .ul_5 > li:hover > a[target=_blank]::after {background: url('../../images/guide/tab-link-blank-ov.png');}

.tab_div.type2 .ul_5::after {display: none;}
.tab_div.type2 .ul_5 > li {margin-right: 20px;}
.tab_div.type2 .ul_5 > li {border-bottom: 0;}
.tab_div.type2 .ul_5 > li::after {display: none;}
.tab_div.type2 .ul_5 > li > a {padding: 13px 60px 14px 60px; background: #e5f0f8; font-family: 'Dream Regular'; transition: 0s;}
.tab_div.type2 .ul_5 > li._active > a,
.tab_div.type2 .ul_5 > li:hover > a {background: url('../../images/guide/bg-tab5.png') center top; box-shadow: 8px 8px 10px 0px rgba(0,0,0,0.2); color: #fff;}
.tab_div.type2 .ul_5 > li:hover > a[target=_blank]::after {background: url('../../images/guide/tab-link-blank-ov-white.png');}

@media all and (max-width: 1000px) {
  .tab_div .ul_3 > li {width: 33.333% !important;}
  .tab_div .ul_4 > li {width: 33.333% !important;}
}

@media all and (max-width:860px) {
  .tab_div {position: relative;}
  .tab_div .ul_3,
  .tab_div .ul_4,
  .tab_div .ul_5 {overflow: hidden; position: absolute; top: 60px; 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_3 > li,
  .tab_div .ul_4 > li,
  .tab_div .ul_5 > li {display: block; width: 100% !important; padding: 0; border: 0}
  .tab_div ul li a {display: block; height: auto; padding: 13px 40px; background: #fff; border-bottom: 1px solid #d1d1d1; font-size: 16px; text-align: left; line-height: normal;}
  .tab_div ul li a:hover {border-bottom: 1px solid #0146b9;}
  .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%; margin-bottom: 40px; padding: 14px 40px; background: #0146b9 url('../../images/guide/arrow-sel.png') no-repeat 97% center; text-align: center; font-family: 'Dream Medium'; font-size: 16px; color: #fff;}
  .tab_div .mobile-tab.on {background: #002d78 url('../../images/guide/arrow-sel-rever.png') no-repeat 97% center;}
  .tab_div .mobile-tab.on::after {background: url('../../images/guide/dot-sel-rever.png') no-repeat center center;}

  .tab_div.type2 .ul_4 {border-top: 0;}
  .tab_div.type2 .ul_5 > li > a {padding: 15px 20px 16px 20px;}
  .tab_div .ul_3 > li {margin: 0; border: 0;}
  .tab_div .ul_3 > li > a {padding: 13px 20px; font-size: 16px; text-align: left;}
  .tab_div .ul_3 > li > a::before {height: 0;}
  .tab_div .ul_4 > li {margin: 0; border: 0;}
  .tab_div .ul_4 > li > a {padding: 13px 20px; font-size: 16px; text-align: left;}
  .tab_div .ul_4 > li > a::before {height: 0;}
  .tab_div .ul_5 > li {border: 0;}
  .tab_div .ul_5 > li > a {padding: 15px 20px 16px 20px;}
  .tab_div .ul_3 > li._active > a,
  .tab_div .ul_3 > li:hover > a {color: #0068b7;}
  .tab_div .ul_4 > li._active > a,
  .tab_div .ul_4 > li:hover > a {color: #0068b7;}
  .tab_div .ul_5 > li:first-child > a::before {left: 23px;}
}

/* List Type */
.con-list1 > ul > li {position: relative; margin: 7px 0 0 0; padding-left: 27px; font-family: 'Dream Regular'; font-size: 18px; line-height: 1.5; letter-spacing: -0.5px; color: #333;}
.con-list1 > ul > li::before {content: ''; position: absolute; left: 0; top: 7px; width: 15px; height: 15px; background: url('../../images/guide/ico-con-list.png') no-repeat center center;}
.con-list1 > ul > li strong {font-family: 'Dream Regular'; color: #333;}

.con-list2 > ul > li {position: relative; margin: 7px 0 0 0; padding-left: 27px; font-family: 'Dream Regular'; font-size: 16px; line-height: 1.5; letter-spacing: -0.5px; color: #333;}
.con-list2 > ul > li::before {content: ''; position: absolute; left: 0; top: 9px; width: 7px; height: 7px; background: #ccd0d7; border-radius: 100%;}
.con-list2 > ul > li strong {font-family: 'Dream Regular'; color: #333;}

.con-arrow-list > ul > li {position: relative; padding-left: 18px; font-size: 16px; line-height: 30px; letter-spacing: -0.5px; color: #333;}
.con-arrow-list > ul > li::before {content: ''; position: absolute; left: 0; top: 13px; width: 10px; height: 4px; background: url('../../images/guide/ic_list3_arrow.png') no-repeat;}

.circle-num-title {position: relative; padding-left: 25px; font-family: 'Dream Regular'; font-size: 18px; line-height: 20px; letter-spacing: -0.5px; color: #333;}
.circle-num-title .num {position: absolute; left: 0; top: 2px; display: inline-block; width: 16px; height: 16px; margin-right: 5px; background: #6c6c6c; border-radius: 50%; font-family: 'Dream Medium'; font-size: 10px; vertical-align: middle; letter-spacing: -0.5px; text-align: center;  line-height: 17px; color: #fff;}

.circle-num-list > ul >li {position: relative; margin: 6px 0 0 0; padding-left: 25px; font-family: 'Dream Regular'; font-size: 18px; line-height: 1.6; letter-spacing: -0.5px; color: #333;}
.circle-num-list > ul > li .num {position: absolute; left: 0; top: 6px; display: inline-block; width: 16px; height: 16px; margin-right: 5px; background: #333; border-radius: 50%; font-family: 'Dream Medium'; font-size: 10px; text-align: center; vertical-align: middle; letter-spacing: -0.5px; line-height: 17px; color: #fff;}

/* Notify Text */
.noti-txt {padding: 28px 40px; background: #f5f6fa; font-family: 'Dream Regular'; font-size: 18px; color: #0068b7;}
.noti-txt2 {position: relative; padding: 25px; font-family: 'Dream Regular'; font-size: 18px; text-align: center; color: #333;}
.noti-txt2 .deco {position: absolute;}
.noti-txt2 .deco1 {left: 0; top: 0; width: 100%; height: 5px; background: #00a0e9 url('../../images/guide/bg-noti-line.png');}
.noti-txt2 .deco1::after {content: ''; position: absolute; left: 0; top: 0; width: 97px; height: 5px; background: url('../../images/guide/deco-noti1.png') no-repeat left top;}
.noti-txt2 .deco2 {right: 0; top: 0; width: 5px; height: 100%; background: #00a0e9 url('../../images/guide/bg-noti-line.png');}
.noti-txt2 .deco3 {left: 0; bottom: 0; width: 100%; height: 5px; background: #004098 url('../../images/guide/bg-noti-line.png');}
.noti-txt2 .deco3::after {content: ''; position: absolute; right: 0; top: 0; width: 97px; height: 5px; background: url('../../images/guide/deco-noti2.png') no-repeat left top;}
.noti-txt2 .deco4 {left: 0; top: 0; width: 5px; height: 100%; background: #004098 url('../../images/guide/bg-noti-line.png');}
.noti-txt3 {position: relative; padding-left: 35px; font-family: 'Dream Regular'; font-size: 18px;}
.noti-txt3::after {content: ''; position: absolute; left: 0; top: 2px; width: 24px; height: 24px;}
.noti-txt3.color1 {color: #b11116;}
.noti-txt3.color1::after {background: url('../../images/guide/ic-noti1.png') no-repeat center center;}
.noti-txt3.color2 {color: #0068b7;}
.noti-txt3.color2::after {background: url('../../images/guide/ic-noti2.png') no-repeat center center;}
.noti-txt3.color3 {color: #0c8d8c;}
.noti-txt3.color3::after {background: url('../../images/guide/ic-noti3.png') no-repeat center center;}

@media all and (max-width: 640px) {
  .noti-txt3 {font-size: 16px;}
}

.point-txt {display: table; width: 100%; border: 1px solid #dbdbdb; table-layout: fixed;}
.point-txt .ico {display: inline-block; width: 50px; height: 50px; margin-right: 7px; background: #0068b7; border-radius: 100%; line-height: 44px; text-align: center; vertical-align: middle;}
.point-txt .ico img {display: inline-block; vertical-align: middle;}
.point-txt .title {display: inline-block; font-family: 'Dream Medium'; font-size: 16px; vertical-align: middle; color: #333;}
.point-txt .thumb {position: relative; display: table-cell; width: 160px; padding: 15px 0 15px 20px; vertical-align: middle;}
.point-txt .thumb::after {content: ''; position: absolute; right: 0; top: 50%; width: 1px; height: 18px; background: #ccc; transform: translate(0, -50%);}
.point-txt .desc {display: table-cell; padding: 20px; font-family: 'Dream Regular'; vertical-align: middle;}
.point-txt.point-ico {background: #0068b7; padding: 20px 30px;}
.point-txt.point-ico img {display: inline-block; margin: 5px 20px 5px 0; vertical-align: middle;}

@media all and (max-width: 640px) {
  .point-txt,
  .point-txt .thumb,
  .point-txt .desc {display: block; width: 100%;}
  .point-txt .thumb::after {display: none;}
  .point-txt .thumb {border-bottom: 1px solid #ccc;}
  .point-txt .desc {padding: 25px 20px;}
}

/* Button Style */
.btn-style.round {display: inline-block; position: relative; margin-right: 3px; margin-bottom: 5px; padding: 11px 35px 12px 35px; background: #0068b7; border:2px solid #0068b7; border-radius: 30px; font-family: 'Dream Regular'; font-size: 16px; color: #fff;}
.btn-style.round:hover {background: #fff; border-color: #0068b7; color:#0068b7; transition:all 0.3s cubic-bezier(0.7, 0, 0.3, 1);}
.btn-style.round::after {content: ''; position: relative; display: inline-block; margin-left: 10px; vertical-align: middle;}
.btn-style.round:hover::after {background-position: center bottom !important;}
.btn-style.round.type1::after {top: -3px; width: 17px; height: 17px; background: url('../../images/guide/ico-btn1.png') no-repeat center top;}
.btn-style.round.type2::after {top: -3px; width: 17px; height: 17px; background: url('../../images/guide/ico-btn2.png') no-repeat center top;}
.btn-style.round.type3::after {top: -2px; width: 16px; height: 16px; background: url('../../images/guide/ico-btn3.png') no-repeat center top;}
.btn-style.round.type4::after {top: -2px; width: 16px; height: 17px; background: url('../../images/guide/ico-btn4.png') no-repeat center top;}
.btn-style.round.type5::after {top: -2px; width: 16px; height: 16px; background: url('../../images/guide/ico-btn5.png') no-repeat center top;}

.btn-style.small {display: inline-block; position: relative; top: -2px; margin-right: 3px; padding: 0px 8px; background: #fff; border:1px solid #0068b7; border-radius: 30px; font-family: 'Dream Regular'; font-size: 14px; color: #0068b7;}
.btn-style.small:hover {background: #0068b7; border-color: #0068b7; color:#fff; transition:all 0.3s cubic-bezier(0.7, 0, 0.3, 1);}
.btn-style.small::after {content: ''; position: relative; display: inline-block; margin-left: 10px; vertical-align: middle;}
.btn-style.small:hover::after {background-position: center bottom !important;}
.btn-style.small.type1::after {top: -2px; width: 6px; height: 10px; background: url('../../images/guide/ico-btn6.png') no-repeat center top;}

/* Rating */
.wrap-rating .container {display: table; width: 100%; padding: 46px 30px; background: #f5f5f5;}
.wrap-rating .title,
.wrap-rating .person,
.wrap-rating .vote {display: table-cell; vertical-align: middle;}
.wrap-rating .vote {text-align: right;}

.wrap-rating .title {width: 300px; font-family: 'Dream Regular'; font-size: 16px; color: #151515;}
.wrap-rating .title p {position: relative; display: inline-block;}
.wrap-rating .title p:after {content: ''; position: absolute; left: 131%; top: 50%; width: 142px; height: 1px; background: #222;  }

.wrap-rating .person .team,
.wrap-rating .person .tel,
.wrap-rating .person .date {display: inline-block; margin-left: 46px; padding:6px 0 6px 50px; background: url('../../images/guide/ico-rating.png') no-repeat; font-family: 'Dream Regular'; font-size: 16px; color: #151515;}
.wrap-rating .person .team {margin-left: 60px; background-position: 0 0;}
.wrap-rating .person .tel {margin-left: 110px; background-position: 0 -36px; letter-spacing: 0;}
.wrap-rating .person .date {background-position: 0 -72px; letter-spacing: 0;}

.wrap-rating .vote .input,
.wrap-rating .vote .btn {display: inline-block; vertical-align: middle;}
.wrap-rating .vote .input ul {font-size: 0;}
.wrap-rating .vote .input li {position: relative; display: inline-block; width: 35px; height: 34px; margin-left: 5px;}
.wrap-rating .vote .input input {position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 100%; margin: 0; padding: 0; opacity: 0; cursor: pointer;}
.wrap-rating .vote .input .radiobtn {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url('../../images/guide/ico-star.png') no-repeat;}
.wrap-rating .vote .input .star5 .radiobtn {background-position: 0 0;}
.wrap-rating .vote .input .star4 .radiobtn {background-position: -35px 0;}
.wrap-rating .vote .input .star3 .radiobtn {background-position: -70px 0;}
.wrap-rating .vote .input .star2 .radiobtn {background-position: -105px 0;}
.wrap-rating .vote .input .star1 .radiobtn {background-position: -140px 0;}
.wrap-rating .vote .input input:checked~.radiobtn:after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url('../../images/guide/ico-star.png') no-repeat;}
.wrap-rating .vote .input input:focus~.radiobtn:before {content:''; position: absolute; left:-5%; top:-5%; width: 110%; height: 110%; border:2px solid #000}
.wrap-rating .vote .input .star5 input:checked~.radiobtn:after {background-position: 0 bottom;}
.wrap-rating .vote .input .star4 input:checked~.radiobtn:after {background-position: -35px bottom;}
.wrap-rating .vote .input .star3 input:checked~.radiobtn:after {background-position: -70px bottom;}
.wrap-rating .vote .input .star2 input:checked~.radiobtn:after {background-position: -105px bottom;}
.wrap-rating .vote .input .star1 input:checked~.radiobtn:after {background-position: -140px bottom;}
.wrap-rating .vote .btn {position: relative; padding: 0 0 0 30px;}
.wrap-rating .vote .btn .btn-vote {position: relative; padding: 0; font-family: 'Dream Medium'; font-size: 15px; text-decoration: underline; color: #2b2b2b; cursor: pointer;}

@media all and (max-width: 1820px) {
  .wrap-rating {padding: 0 20px;}
}

@media all and (max-width: 1400px) {
  .wrap-rating .container {padding: 20px 40px;}
  .wrap-rating .title {width: 160px;}
  .wrap-rating .title p:after {display: none; left: 0; top: 142%; width: 70px;}
  .wrap-rating .person .team,
  .wrap-rating .person .tel,
  .wrap-rating .person .date {margin-left: 0; margin-right: 20px; font-size: 15px;}
  .wrap-rating .person .tel {background-position: 0 -36px;}
  .wrap-rating .person .date {margin-bottom: 0; background-position: 0 -44px;}
  .wrap-rating .vote {width: 200px; text-align: right;}
  .wrap-rating .vote .btn {margin-left: 0; margin-top: 23px; padding-left: 0;}
  .wrap-rating .vote .btn:after {display: none;}
}

@media all and (max-width: 900px) {
  .wrap-rating .container {padding: 28px 30px;}
  .wrap-rating .title,
  .wrap-rating .person,
  .wrap-rating .vote {display: inline-block;}

  .wrap-rating .person {width: calc(100% - 280px)}
  .wrap-rating .vote {width: 280px;}
  .wrap-rating .vote .btn {margin-top: 0; margin-left: 30px;}
  .wrap-rating .title {width: 100%; padding-bottom: 30px;}
  .wrap-rating .title br {display: none;}
}

@media all and (max-width: 780px) {
  .wrap-rating .person {width: 100%; text-align: center;}
  .wrap-rating .vote {width: 100%; margin-top: 30px; text-align: center;}
}

/* Ready */
.wrap-ready {padding: 160px 0; border: 1px solid #e8e8e8; text-align: center;}
.wrap-ready strong {display: inline-block; padding: 140px 0 0 0; background: url('../../images/guide/ico-ready.png') no-repeat center top; font-family: 'Dream Regular'; font-size: 24px; color: #0068b7;}

/* Down Banner */
.down-banner1 {overflow: hidden; padding: 15px 35px; border: 5px solid #e5e5e5;}
.down-banner1 .title {position: relative; float: left; padding: 7px 0; font-family: 'Dream Regular'; font-size: 18px; color: #333;}
.down-banner1 .title::before {content: ''; position: relative; top: -2px; display: inline-block; width: 7px; height: 7px; margin-right: 12px; background: #ccd0d7; border-radius: 100%; vertical-align: middle;}
.down-banner1 .link {float: right; padding: 9px 23px; background: #fff;  border: 1px solid #0068b7; border-radius: 100px; font-family: 'Dream Regular'; font-size: 14px; color: #0068b7;}
.down-banner1 .link::after {content: ''; position: relative; top: -2px; display: inline-block; width: 17px; height: 17px; margin-left: 10px; background: url('../../images/guide/ico-down-banner.png') no-repeat center center;  vertical-align: middle;}
.down-banner1 .link:hover {background: #f3faff;}

@media all and (max-width: 1300px) {
  .down-banner1 .title {width: 100%;}
  .down-banner1 .link {float: left; margin-top: 10px; margin-bottom: 10px;}
}

.down-banner2 ul {overflow: hidden; border-left: 1px solid #ccc;}
.down-banner2 li {float: left; display: table; width: 100%; padding: 10px 15px; border-right: 1px solid #ccc;  table-layout: fixed;}
.down-banner2.row1 li {width: 100%;}
.down-banner2.row2 li {width: 50%;}
.down-banner2.row3 li {width: 33.333%;}
.down-banner2.row4 li {width: 25%;}
.down-banner2.row5 li {width: 20%;}
.down-banner2 .title {display: table-cell; font-family: 'Dream Regular'; font-size: 16px; line-height: 1.3; vertical-align: middle; color: #333;}
.down-banner2 .link {display: table-cell; width: 130px; vertical-align: middle;}
.down-banner2 .link a {float: right; padding: 9px 23px; border: 1px solid #0068b7; border-radius: 100px; font-family: 'Dream Regular'; font-size: 14px; color: #0068b7;}
.down-banner2 .link a::after {content: ''; position: relative; top: -2px; display: inline-block; width: 17px; height: 17px; margin-left: 10px; background: url('../../images/guide/ico-down-banner.png') no-repeat center center;  vertical-align: middle;}
.down-banner2 .link a:hover {background: #f3faff;}

@media all and (max-width: 1400px) {
  .down-banner2.row3 li,
  .down-banner2.row4 li,
  .down-banner2.row5 li {width: 50%; margin: 10px 0;}
  .down-banner2 li:nth-child(even) {border-right: 0;}
}

@media all and (max-width: 900px) {
  .down-banner2 ul {border-left: 0; border-top: 1px solid #333;}
  .down-banner2.row3 li,
  .down-banner2.row4 li,
  .down-banner2.row5 li {width: 100%; margin: 0;}
  .down-banner2 li {padding: 20px; border-right: 0; border-bottom: 1px solid #ccc;}
  .down-banner2 li:nth-child(even) {border-bottom: 1px solid #ccc;}
  .down-banner2 .title br {display: none;}
}

.down-banner3 {padding: 30px 35px; border: 5px solid #e1e6ee;}
.down-banner3 ul {overflow: hidden;}
.down-banner3 li {float: left; display: table; width: 100%; padding: 5px 0;}
.down-banner3.row1 li {width: 100%;}
.down-banner3.row2 li {width: 50%;}
.down-banner3.row2 li:nth-child(odd) {padding-right: 40px; border-right: 1px dashed #ddd;}
.down-banner3.row2 li:nth-child(even) {padding-left: 40px;}
.down-banner3 .text-only {display: table-cell; position: relative; padding-left: 20px; font-family: 'Dream Regular'; font-size: 18px; line-height: 1.3; vertical-align: middle; color: #333;}
.down-banner3 .text-only::after {content: ''; position: absolute; left: 0; top: 9px; width: 7px; height: 7px; background: #ccd0d7; border-radius: 100%;}
.down-banner3 .title {display: table-cell; position: relative; padding-left: 20px; font-family: 'Dream Regular'; font-size: 18px; line-height: 1.3; vertical-align: middle; color: #333;}
.down-banner3 .title::after {content: ''; position: absolute; left: 0; top: 17px; width: 7px; height: 7px; background: #ccd0d7; border-radius: 100%;}
.down-banner3 .link {display: table-cell; width: 130px; vertical-align: middle;}
.down-banner3 .link a {float: right; padding: 9px 23px; border: 1px solid #0068b7; border-radius: 100px; font-family: 'Dream Regular'; font-size: 14px; color: #0068b7;}
.down-banner3 .link a::after {content: ''; position: relative; top: -2px; display: inline-block; width: 17px; height: 17px; margin-left: 10px; background: url('../../images/guide/ico-down-banner.png') no-repeat center center;  vertical-align: middle;}
.down-banner3 .link a:hover {background: #f3faff;}

@media all and (max-width: 1200px) {
  .down-banner3.row2 li {width: 100%;}
  .down-banner3.row2 li:nth-child(odd) {padding-right: 0; border: 0;}
  .down-banner3.row2 li:nth-child(even) {padding-left: 0;}
}

@media all and (max-width: 768px) {
  .down-banner3 {padding: 20px;}
}

/* Icon Banner1 */
.icon-banner1 {padding: 40px 0; background: #f5f6fa; line-height: 1.5;}
.icon-banner1 .icon {display: table-cell; width: 190px; vertical-align: middle; text-align: center;}
.icon-banner1 .icon .cover {display: inline-block; width: 110px; height: 110px; background: #fff; border-radius: 100%; text-align: center; line-height: 110px;  vertical-align: middle;}
.icon-banner1 .icon .cover img {display: inline-block; vertical-align: middle;}
.icon-banner1 .desc {display: table-cell; padding-right: 30px; vertical-align: middle;}
.icon-banner1 .desc strong {font-family: 'Dream Medium'; font-size: 20px; color: #0068b7;}
.icon-banner1 .desc p {margin-top: 5px; font-family: 'Dream Regular'; font-size: 18px; color: #333;}
.icon-banner1 .link a {display: inline-block; margin-top: 18px; margin-right: 10px; padding: 9px 23px; background: #fff; border: 1px solid #0068b7; border-radius: 100px; font-family: 'Dream Regular'; font-size: 14px; color: #0068b7;}
.icon-banner1 .link a.ico1::after {content: ''; position: relative; top: -2px; display: inline-block; width: 17px; height: 17px; margin-left: 10px; background: url('../../images/guide/ico-icon-banner1-1.png') no-repeat center center;  vertical-align: middle;}
.icon-banner1 .link a.ico2::after {content: ''; position: relative; top: -2px; display: inline-block; width: 17px; height: 17px; margin-left: 10px; background: url('../../images/guide/ico-icon-banner1-2.png') no-repeat center center;  vertical-align: middle;}
.icon-banner1 .link a:hover {background: #f3faff;}

.icon-banner-list img {display: inline-block; margin-right: 30px; margin-bottom: 20px; vertical-align: middle;}

@media all and (max-width: 768px) {
  .icon-banner1 {padding: 20px 0;}
  .icon-banner1,
  .icon-banner1 .icon,
  .icon-banner1 .desc {display: block; width: 100%;}
  .icon-banner1 .icon {margin-bottom: 30px;}
  .icon-banner1 .desc {padding: 0 20px;}
}

/* Icon Banner2 */
.icon-banner2 {position: relative; padding: 35px 0; background: #fff; border: 5px solid #f3f3f3; line-height: 1.5;}
.icon-banner2 .deco {position: absolute; left: 0; top: -5px; width: 100%; height: 5px; background: url('../../images/guide/deco-icon-banner2.png');}
.icon-banner2 .deco::before {content: ''; position: absolute; left: -5px; top: 0px; width: 5px; height: 69px; background: url('../../images/guide/deco-icon-banner2-2.png') no-repeat center top;}
.icon-banner2 .deco::after {content: ''; position: absolute; right: -5px; top: 0px; width: 5px; height: 69px; background: url('../../images/guide/deco-icon-banner2-2.png') no-repeat center top;}
.icon-banner2 .icon {display: table-cell; width: 205px; vertical-align: middle; text-align: center;}
.icon-banner2 .icon .cover {display: inline-block; width: 131px; height: 131px; background: url('../../images/guide/bg-icon-banner2.png') no-repeat center center; text-align: center; line-height: 125px;  vertical-align: middle;}
.icon-banner2 .icon .cover img {display: inline-block; vertical-align: middle;}
.icon-banner2 .desc {display: table-cell; padding-right: 30px; vertical-align: middle;}
.icon-banner2 .desc strong {font-family: 'Dream Medium'; font-size: 22px; color: #111;}
.icon-banner2 .desc p {margin-top: 10px; font-family: 'Dream Regular'; font-size: 18px; color: #333;}
.icon-banner2 .desc ul {margin-top: 10px;}
.icon-banner2 .desc li {position: relative; margin-top: 5px; padding-left: 25px; font-family: 'Dream Regular'; font-size: 16px; color: #333;}
.icon-banner2 .desc li::before {content: ''; position: absolute; left: 0; top: 10px; width: 7px; height: 7px; background: #ccd0d7; border-radius: 100%;}
.icon-banner2 .link a {display: inline-block; margin-top: 18px; margin-right: 10px; padding: 12px 30px 14px 30px; background: #0068b7; border: 1px solid #0068b7; border-radius: 100px; font-family: 'Dream Regular'; font-size: 16px; color: #fff;}
.icon-banner2 .link a.ico1::after {content: ''; position: relative; top: -2px; display: inline-block; width: 16px; height: 16px; margin-left: 10px; background: url('../../images/guide/ico-icon-banner2-1.png') no-repeat center center;  vertical-align: middle;}
.icon-banner2 .link a:hover {background: #004a82;}

@media all and (max-width: 768px) {
  .icon-banner2 {padding: 20px 0;}
  .icon-banner2,
  .icon-banner2 .icon,
  .icon-banner2 .desc {display: block; width: 100%;}
  .icon-banner2 .icon {margin-bottom: 30px;}
  .icon-banner2 .desc {padding: 0 20px;}
}

/* Icon Banner2 */
.icon-banner3 {position: relative; border-top: 2px solid #110f0d; border-bottom: 2px solid #110f0d; line-height: 1.5;}
.icon-banner3 .box {padding: 40px 0; border-bottom: 1px solid #c6c6c6;}
.icon-banner3 .box:last-child {border-bottom: 0;}
.icon-banner3 .icon {display: table-cell; width: 210px; vertical-align: top; text-align: center;}
.icon-banner3 .icon .cover {display: inline-block; width: 131px; height: 131px; background: #fff; border: 1px solid #dddee0; border-radius: 100%; text-align: center; line-height: 125px;  vertical-align: middle;}
.icon-banner3 .icon .cover img {display: inline-block; vertical-align: middle;}
.icon-banner3 .desc {display: table-cell; padding-right: 30px; vertical-align: middle;}
.icon-banner3 .desc strong {position: relative; font-family: 'Dream Medium'; font-size: 22px; color: #0068b7;}
.icon-banner3 .desc strong::after {content: ''; position: absolute; right: -13px; top: -4px; width: 8px; height: 8px; background: #0068b7; border-radius: 100%;}
.icon-banner3 .desc ul {margin-top: 10px;}
.icon-banner3 .desc li {position: relative; margin-top: 8px; padding-left: 25px; font-family: 'Dream Regular'; font-size: 16px; color: #333;}
.icon-banner3 .desc li::before {content: ''; position: absolute; left: 0; top: 5px; width: 15px; height: 15px; background: url('../../images/guide/ico-con-list.png') no-repeat center center; border-radius: 100%;}

@media all and (max-width: 768px) {
  .icon-banner3 {padding: 20px 0;}
  .icon-banner3,
  .icon-banner3 .icon,
  .icon-banner3 .desc {display: block; width: 100%;}
  .icon-banner3 .icon {margin-bottom: 30px;}
  .icon-banner3 .desc {padding: 0 20px;}
}

/* Number Banner */
.number-banner {padding: 35px 40px 40px 40px; background: #f7f8f9;}
.number-banner .title {margin-bottom: 20px; padding-bottom: 12px; border-bottom: 1px solid #ccc; font-family: 'Dream Medium'; font-size: 22px; color: #111;}
.number-banner .list li {overflow: hidden; margin-bottom: 20px;}
.number-banner .list li:last-child {margin-bottom: 0;}
.number-banner .list .num {float: left; width: 32px; height: 32px; background: #0068b7; text-align: center; vertical-align: middle; font-family: 'Dream Regular'; font-size: 16px; line-height: 30px; color: #fff;}
.number-banner .list .text {float: left;width: calc(100% - 32px);padding-top: 3px;padding-left: 15px;vertical-align: middle;font-family: 'Dream Regular';font-size: 16px;color: #333;}
.number-banner.multi .title {margin-bottom: 12px;padding-bottom: 0;border: 0;}
.number-banner.multi .list li:last-child {margin-bottom: 25px;}

@media all and (max-width: 768px) {
  .number-banner {padding: 25px;}
}

/* Intro Banner */
.intro-banner {overflow: hidden; position: relative; width: 100%; padding: 62px 0 65px 0; background: #f5f5f5;}
.intro-banner .deco1 {position: absolute; left: 50px; bottom: 0; width: 521px; height: 70px; background: url('../../images/guide/deco-intro-banner.png') no-repeat center top;}
.intro-banner .deco2 {position: absolute; right: 130px; top: 0; width: 521px; height: 80px; background: url('../../images/guide/deco-intro-banner.png') no-repeat center bottom;}
.intro-banner .title {float: left; width: 46%; font-family: 'Dream Medium'; font-size: 42px; line-height: 1.2; letter-spacing: -1px; color: #0068b7;}
.intro-banner .desc {position: relative; float: left; width: calc(100% - 46%); padding-left: 60px; font-family: 'Dream Regular'; font-size: 19px; color: #444;}
.intro-banner .desc::before {content: ''; position: absolute; left: 0; top: 0; width: 1px; height: 70px; background: #0068b7;}
.fullWidth::after {content: ''; position: absolute; left: 50%; top: 0; z-index: -1; width: 2000px; height: 100%; background: #f5f5f5; transform: translate(-50%, 0);}

@media all and (max-width: 900px) {
  .intro-banner .title,
  .intro-banner .desc {width: 100%;}
  .intro-banner .desc {padding-left: 0; padding-top: 20px;}
  .intro-banner .title {font-size: 35px;}
  .intro-banner .desc::before {display: none;}
  .intro-banner .deco1 {left: 0;}
  .intro-banner .deco2 {right: 0;}
}

/* Step Banner */
.step-banner1 > ul {display: table; width: 100%; padding: 0 0; padding-top: 25px; table-layout: fixed;}
.step-banner1 > ul > li {position: relative; display: table-cell; background: #f7f7f7; vertical-align: top;}
.step-banner1 > ul > li.arrow {width: 80px; background: transparent; vertical-align: middle; text-align: center;}
.step-banner1 li .title {margin-top: -25px; text-align: center;}
.step-banner1 li .title strong {display: inline-block; padding: 11px 75px; border-radius: 100px; font-family: 'Dream Medium'; font-size: 18px; color: #fff;}
.step-banner1 li.color1 .title strong {background: #0072bc;}
.step-banner1 li.color2 .title strong {background: #004098;}
.step-banner1 li.color3 .title strong {background: #048fcf;}
.step-banner1 li .desc {padding: 40px; font-family: 'Dream Regular';}
.step-banner1.no-arrow > ul {padding: 0; padding-top: 25px;}
.step-banner1.no-arrow li .desc {padding: 30px 40px;}
.step-banner1.no-arrow li.space {width: 25px; background: transparent; }
.step-banner1.no-arrow .desc strong {display: block; margin-bottom: 10px; font-family: 'Dream Regular'; font-size: 22px; letter-spacing: -1px;  color: #111;}
.step-banner1.no-arrow .desc li {position: relative; padding-left: 20px; font-family: 'Dream Regular'; font-size: 16px; color: #333;}
.step-banner1.no-arrow .desc li::after {content: ''; position: absolute; left: 0; top: 9px; width: 7px; height: 7px; background: #ccd0d7; border-radius: 100%;}

.step-banner2 > ul {display: table; width: 100%; padding-top: 15px; table-layout: fixed;}
.step-banner2 > ul > li {position: relative; display: table-cell; background: #f7f7f7; border: 1px solid #dbdbdb; vertical-align: top;}
.step-banner2 > ul > li.arrow {width: 80px; background: transparent; border: 0; vertical-align: middle; text-align: center;}
.step-banner2 li .title {margin-top: -15px; text-align: center;}
.step-banner2 li .title strong {display: inline-block; width: 30px; height: 30px; background: #0068b7; border-radius: 100%; font-family: 'Dream Medium'; font-size: 16px; text-align: center; line-height: 30px; color: #fff;}
.step-banner2 li .desc strong {display: block; min-height: 110px;  margin-top: -15px;  padding: 25px; background: #e5f0f8; font-family: 'Dream Regular'; font-size: 20px; text-align: center; line-height: 1.3; color: #111;}
.step-banner2 li .desc p {padding: 15px 30px 20px 30px; font-family: 'Dream Regular'; font-size: 16px; text-align: center; color: #888;}

@media all and (max-width: 1400px) {
  .step-banner1 > ul {padding: 0; padding-top: 25px;}

  .step-banner2 > ul,
  .step-banner2 > ul > li {display: block;}
  .step-banner2 > ul > li {margin-bottom: 20px;}
  .step-banner2 > ul > li.arrow {display: none;}
  .step-banner2 li .title {position: absolute; left: 24px; top: 26px; margin-top: 0;}
  .step-banner2 li .desc strong {padding-left: 70px; min-height: auto; margin-top: 0; text-align: left;}
  .step-banner2 li .desc p {padding: 25px; text-align: left;}
}

@media all and (max-width: 1100px) {
  .step-banner1 > ul,
  .step-banner1 > ul > li {display: block;}
  .step-banner1 > ul > li {margin-bottom: 20px;}
  .step-banner1 > ul > li.arrow {display: none;}
  .step-banner1 li .title {margin-top: 0; text-align: left;}
  .step-banner1 li .title strong{width: 100%; padding: 20px 25px; border-radius: 0;}
  .step-banner1 li .desc {padding: 25px;}
  .step-banner1.no-arrow li .desc {padding: 20px 25px 25px 25px;}
}

/* Icon Box */
.icon-box {overflow: hidden; position:relative; line-height:1.6;}
.icon-box .title {display: block; margin-bottom: 10px; font-family: 'Dream Regular'; font-size: 19px; font-family: 'Dream Regular'; color: #1f59ad;}
.icon-box .li-list {display: table; table-layout: fixed; width: calc(100%);}
.icon-box .li-list li {display: table-cell; padding-left: 20px; border-left: 1px solid #ddd;}
.icon-box .li-dot {margin-top: 20px;}
.icon-box .li-dot li {position: relative; padding-left: 15px;}
.icon-box .li-dot li:before {content: ''; position: absolute; left: 0; top: 8px; display: block; width: 7px; height: 7px; border-radius: 100%; background-color: #618e9b}
.icon-box .box-btn {margin-top: 20px;}
.icon-box .box-btn a {display: inline-block; padding: 6px 13px 6px 38px; font-family: 'Dream Regular'; border: 1px solid #afafaf; border-radius: 5px; font-size: 15px;}
.icon-box .box-btn a.down {background:#fff url('../../images/guide/box-btn-down.png') 10px center no-repeat;}
.icon-box .box-btn a.link {background:#fff url('../../images/guide/box-btn-link.png') 10px center no-repeat;}
.icon-list-add {padding: 30px; border: 1px solid #d1d1d1;}
.icon-list-all {padding: 30px; background: #313437; border: 1px solid #000;}
.icon-list-all img {display: inline-block; margin: 6px 10px; padding: 10px; background: #3c4247; border: 1px solid #000; border-radius: 5px; vertical-align: middle;}

@media only screen and (max-width:900px){
  .icon-box .li-list li {display: block; width: 100%; margin-bottom: 20px;}
}

@media only screen and (max-width:520px){
  .icon-box .li-list li {padding-left:0; border-left: none;}
}

/* Icon Box1 */
.icon-box01 {background: #f5f5f5 url('../../images/guide/bg-icon-box.png') no-repeat right top; padding: 30px; border: 1px solid #ddd;}
.icon-box01 .title {margin-top: 20px; font-family: 'Dream Regular'; font-size: 26px; color: #006276;}
.icon-box01 .cont {font-family: 'Dream Regular'; font-size: 18px; color: #333;}
.icon-box01 .inner {overflow: hidden;}
.icon-box01 .icon {overflow: hidden; position:relative; float: left; width:231px; height:231px; margin-right: 40px; background: url('../../images/guide/icon_bg2.png') center center no-repeat;}
.icon-box01 .icon img {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%)}
.icon-box01 .text {display: table-cell; position: relative; vertical-align: top;}

@media only screen and (max-width:680px){
  .icon-box01 .icon {display: block; float: none; margin: 0 auto 30px; text-align: center;}
}

/* Icon Box2 */
.icon-box02 {position: relative; padding: 10px; background: url('../../images/guide/lineBox_bg.png');}
.icon-box02 .box {display: table; width: 100%; padding: 20px; background: #fff; table-layout: fixed;}
.icon-box02 .icon {display: table-cell; width: 80px; vertical-align: top;}
.icon-box02 .desc {display: table-cell; font-family: 'Dream Regular'; font-size: 18px; color: #2e3a84; vertical-align: middle;}
.icon-box02 .link {position: absolute; right: 30px; top: 30px; padding: 10px 40px 10px 15px; background: #006cc7 url('../../images/guide/arrow-icon-box.png') no-repeat right center; font-family: 'Dream Regular'; font-size: 14px; color: #fff; transition: .4s;}
.icon-box02 .link:hover {background-color: #00437b;}

/* Icon Box3 */
.icon-box03 {position: relative; padding:5px; background: url('../../images/guide/lineBox_bg.png');}
.icon-box03 .inner {overflow:hidden; padding: 30px; background-color:#fff;}
.icon-box03 .icon {overflow: hidden; float: left; margin-right: 40px;}
.icon-box03 .text {position: relative; display: table-cell; padding-left: 130px; vertical-align: top;}
.icon-box03 .text .title {position: absolute; left: 0; font-family: 'Dream Regular'; font-size: 19px;}

@media only screen and (max-width:680px){
  .icon-box03 .icon {display: block; float: none; margin-right: 0; margin-bottom: 25px; text-align: center;}
}

@media only screen and (max-width:520px){
  .icon-box03 .text {display: block; padding-left: 0;}
  .icon-box03 .text .title {position: inherit;}
}

/* Icon Box4 */
.icon-box04 {padding: 30px; background-color: #f5f5f5; border: 1px solid #ddd;}
.icon-box04 .inner {overflow: hidden;}
.icon-box04 .icon {overflow: hidden; position: relative; float: left; width: 160px; height: 160px; margin-right: 40px; background: url('../../images/guide/icon_bg.png') center center no-repeat;}
.icon-box04 .icon img {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%)}
.icon-box04 .text {position: relative; display: table-cell; vertical-align: top;}

@media only screen and (max-width:680px){
  .icon-box04 .icon {display: block; float: none; margin: 0 auto 30px; text-align: center;}
}

/* Icon Box5 */
.icon-box05 {background-color: #f5f5f5; border: 1px solid #ddd;}
.icon-box05 .inner {overflow: hidden; background: #f5f5f5 url('../../images/guide/lineBox_bgLine.png') left top no-repeat;}
.icon-box05 .icon {overflow: hidden; float: left; width: 160px; margin-right: 60px;}
.icon-box05 .icon img {margin: 15px 0 15px 30px;}
.icon-box05 .text {position: relative; display: table-cell; padding: 20px; vertical-align: top;}

@media only screen and (max-width:680px){
  .icon-box05 .inner {background: none;}
  .icon-box05 .icon {float: none; display: block; width: 100%; padding: 15px 0 10px 0; background-color: #fff; text-align: center;}
  .icon-box05 .icon img {margin: 0;}
}

/* Icon Box6 */
.icon-box06 {padding: 5px; background: #cee8ef}
.icon-box06 .sub-link-inner {overflow: hidden; display: table; width: 100%; padding: 22px 30px 22px 20px; background: #fff;}
.icon-box06 .sub-link-icon {display: table-cell; width: 70px; vertical-align: middle;}
.icon-box06 .sub-link-info {display: table-cell; width: auto; padding: 0 50px 0 18px; font-family: 'Dream Regular'; font-size: 18px; vertical-align: middle; line-height: 24px; letter-spacing: -0.5px; color: #222;}
.icon-box06 .sub-link-btn {display: table-cell; width: 160px; vertical-align: middle;}

.icon-box06 .sub-btn-group .link-btn {overflow: hidden; position: relative; display: block; border: 1px solid #139cb4; font-family: 'Dream Regular'; font-size: 14px; line-height: 24px; letter-spacing: -0.5px; color: #139cb4; transition: all 0.3s;}
.icon-box06 .sub-btn-group .link-btn::before {content: ''; position: absolute; z-index: 1; width: 0; height: 100%; background: #139cb4; left: -30px; top: 0; transition: all 0.5s; transform: skewX(-45deg);}
.icon-box06 .sub-btn-group .link-btn span {position: relative; z-index: 3; display: block;  padding: 10px 40px 10px 15px; transition: all 0.3s;}
.icon-box06 .sub-btn-group .link-btn span::after {content: ''; position: absolute; right: 0; bottom: 17px; width: 30px; height: 1px; background: #139cb4; transition: .4s;}
.icon-box06 .sub-btn-group .link-btn:hover {color: #fff;}
.icon-box06 .sub-btn-group .link-btn:hover::before {width: 140%;}
.icon-box06 .sub-btn-group .link-btn:hover span::after {background: #fff;}

@media all and (max-width: 768px){
  .icon-box06 .sub-link-inner {display: block; }
  .icon-box06 .sub-link-icon {display: block; width: 100%; text-align: center;}
  .icon-box06 .sub-link-icon  img {display: inline-block;}
  .icon-box06 .sub-link-info {display: block; margin: 20px 0; padding: 0;}
  .icon-box06 .sub-link-btn {display: block;}
}

/* List Box1 */
.list-box01 {display: flex; justify-content: space-between;}
.list-box01 li {display: block; width: 31%; padding: 30px 20px; border: 1px solid #ddd; text-align: center; line-height: 1.6;}
.list-box01 li .thum {position: relative; width: 115px; height: 115px; margin: 0 auto; background-color: #3c75cb; border-radius: 100%;}
.list-box01 li .thum img {position: absolute; left: 50%; top: 50%; max-width: 100%; transform:translate(-50%, -50%);}
.list-box01 li p {margin-bottom: 20px;}
.list-box01 li a {display: inline-block; padding: 5px 50px; background-color: #f0f0f0; font-family: 'Dream Medium'; color: #222; transition: .4s;}
.list-box01 li a:hover {background: #3c75cb; color: #fff;}
.list-box01 li .title {display: block; margin: 20px 0 10px; font-family: 'Dream Regular'; font-size: 20px;}

@media all and (max-width:767px) {
  .list-box01 {display: block;}
  .list-box01 li {width: 100%;}
  .list-box01 li + li {margin-left: 0; margin-top: 25px;}
}

/* List Box2 */
.list-box02 {display: flex; justify-content: space-between;}
.list-box02 > li {position:relative; display: block; width: 31%; padding: 20px 20px 20px 150px; border: 3px solid #a1bad2; line-height: 1.6;}
.list-box02 > li .thum {position: absolute; left:25px; top:25px; width: 100px; height: 100px;  padding:20px; background-color: #006276; border-radius: 100%; box-sizing:border-box;}
.list-box02 > li .thum img {position: absolute; left: 50%; top: 50%; max-width: 100%; transform: translate(-50%, -50%);}
.list-box02 > li p {margin-bottom: 30px;}
.list-box02 > li a {display: inline-block; padding: 5px 50px; background-color: #f0f0f0; font-family: 'Dream Medium'; color: #222;}
.list-box02 > li .title {display: block; margin: 20px 0 10px; font-size: 20px; font-family: 'Dream Regular';}
.list-box02 ul li {position: relative; padding-left: 10px;}
.list-box02 ul li:before {content: ''; position: absolute; left: 0; top: 10px; display: block; width: 3px; height: 3px; background-color:#005faa; border-radius: 100%;}

@media all and (max-width:1300px) {
  .list-box02 {display: block;}
  .list-box02 > li {width: 100%;}
  .list-box02 > li + li {margin-left: 0; margin-top: 25px;}
}

/* List Box3 */
.list-box03 {padding: 20px 50px; padding-bottom: 0; border: 1px solid #c1c1c1; font-size: 0;}
.list-box03 ul {display: inline-block; width: 100%;}
.list-box03 li {float: left; width: 33.333%; margin-bottom: 20px;}
.list-box03 .text {display: inline-block; margin-right: 47px; padding-left: 20px; background: url('../../images/guide/bul-list2.png') no-repeat left 11px; font-family: 'Dream Regular'; font-size: 17px; color: #000;}
.list-box03.row2 li {width: 50%;}

@media all and (max-width: 1400px) {
  .list-box03 li {width: 50%;}
}

@media all and (max-width: 970px) {
  .list-box03 li {width: 100%;}
  .list-box03.row2 li {width: 100%;}
}

@media all and (max-width: 760px) {
  .list-box03 {padding: 20px 20px;}
  .list-box03 .text {display: block; width: 100%;}
  .list-box03 .btn-style.rect {margin: 7px 0 0 19px;}
}

/* Contents Box1 */
.major-intro-inner {position: relative; padding: 45px 30px 40px 0; border-bottom: 1px solid #7a7a7a;}
.major-intro-inner::after {content: ''; display: table; clear: both;}
.major-intro-inner::before {content: ''; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 4px; background: url('../../images/guide/intro_line.png');}
.major-intro-image {float: right; width: 432px;}
.major-intro-text {float: left; width: calc(100% - 457px);}
.major-intro-header {position: relative; padding-bottom: 40px;}
.major-intro-header::before {content: ''; display: block; position: absolute; left: 0; bottom: 0; width: 65px; height: 1px; background-color: #0067d4;}
.major-intro-header::after {content: ''; display: table; clear: both;}
.major-intro-header h1 {float: left; font-family: 'Dream Regular'; font-size: 30px; color: #000;}
.major-intro-header h1 span {color: #1e5ba8;}
.major-intro-header a {position: relative; float: left; margin-left: 20px; border: 1px solid #b2b2b2; border-radius: 25px; font-size: 14px; color: #000; text-decoration: none;}
.major-intro-header a::after {content: ''; display: block; position: absolute; left: 15px; top: 50%; width: 16px; height: 16px; margin-top: -8px; background: url('../../images/guide/home_btn.png');}
.major-intro-header a span {display: block; padding: 10px 14px 11px 40px;}
.major-intro-header a:hover {background-color: #00a6ac; border: 1px solid #00a6ac; color: #fff;}
.major-intro-header a:hover::after {background: url('../../images/guide/home_btn_on.png');}
.major-intro-content {margin-top: 35px;}
.major-intro-content > p {position: relative; padding-bottom: 40px; line-height: 1.7;}
.major-intro-content > p::after {content: ''; position: absolute; left: 0; bottom: 0; display: block; width: 65px; height: 1px; background-color: #0067d4; }
.major-intro-info {margin-top: 35px;}
.major-intro-info ul::after {content: ''; display: table; clear: both;}
.major-intro-info li {float: left; margin-right: 40px;}
.major-intro-info li::after {content: ''; display: table; clear: both;}
.major-intro-info li:last-child {margin-right: 0;}
.major-intro-info li .phone-logo {float: left; width: 35px; height: 35px; background: url('../../images/guide/call_logo.png');}
.major-intro-info li .email-logo {float: left; width: 35px; height: 35px; background: url('../../images/guide/mail_logo.png');}
.major-intro-info li .person-logo {float: left; width: 35px; height: 35px; background: url('../../images/guide/person_logo.png');}
.major-intro-info li .place-logo {float: left; width: 35px; height: 35px; background: url('../../images/guide/place_logo.png');}
.major-intro-info li p {float: left; margin-left: 10px; line-height: 35px;}

@media all and (max-width: 1300px) {
  .major-intro-info li {margin-right: 20px; margin-bottom: 20px;}
  .major-intro-header h1 {margin-top: 5px; font-size: 27px;}
}

@media all and (max-width: 1023px) {
  .major-intro-image {float: none; width: 100%; max-width: 432px; margin: 0 auto;}
  .major-intro-text {float: none; width: 100%; margin-top: 30px;}
}

@media all and (max-width: 768px) {
  .major-intro-inner {padding: 45px 0 40px 0;}
  .major-intro-header h1 {float: none;}
  .major-intro-header {padding-bottom: 20px;}
  .major-intro-header a {float: none; display: inline-block; margin-top: 20px; margin-left: 0;}
}

/* Contents Box2 */
.laboratory-inner {padding: 40px 60px 75px 60px; border-top: 3px solid #006276; border-bottom: 1px solid #cccccc}
.laboratory-header::after {content: ''; display: table; clear: both;}
.laboratory-header h1 {float: left; margin-top: 5.5px; font-family: 'Dream Regular'; font-size: 24px; color: #006276;}
.laboratory-header a {position: relative; float: right; display: block; padding: 8px 18px 9px 40px; border: 1px solid #b2b2b2; border-radius: 25px; text-decoration: none; color: #111;}
.laboratory-header a:hover {background-color: #00baff; border: 1px solid #00baff; color: #fff;}
.laboratory-header a:hover::before {background: url('../../images/guide/sisul_link_on.png')}
.laboratory-header a::before {content: ''; display: block; position: absolute; left: 15px; top: 50%; width: 16px; height: 16px; margin-top: -8px; background: url('../../images/guide/sisul_link.png');}
.laboratory-content {margin-top: 35px;}
.laboratory-content::after {content:''; display: table; clear: both;}
.laboratory-image {float: left; width: 640px; position: relative;}
.laboratory-image::after {content: ''; display: block; position: absolute;  z-index: -1; right: -20px; bottom: -21px; width: 130px; height: 140px; background: url('../../images/guide/sisul_background.png');}
.laboratory-table {float: right; width: calc(100% - 640px);}
.laboratory-table ul {padding-left: 70px;}
.laboratory-table li {padding: 23px 0; border-top: 1px solid #cbcbcb; box-sizing: border-box;}
.laboratory-table li:first-child {border-top: 1px solid #000;}
.laboratory-table li:last-child {border-bottom: 1px solid #000;}
.laboratory-table li::after {content:''; display: table; clear: both;}
.laboratory-table-title {float: left; width: 140px;}
.laboratory-table-title p {position: relative; padding-left: 50px; color: #000;}
.laboratory-table-title p::before {content: ''; display: block; position: absolute; left: 15px; top: 50%; width: 26px; height: 26px; margin-top: -13px;}
.laboratory-table-title p::after {content: ''; display: table; clear: both;}
.laboratory-table-title p.table-place::before {background: url('../../images/guide/sisul_place_logo.png');}
.laboratory-table-title p.table-phone::before {background: url('../../images/guide/sisul_phone_logo.png');}
.laboratory-table-title p.table-fax::before {background: url('../../images/guide/sisul_fax_logo.png');}
.laboratory-table-title p.table-person::before {background: url('../../images/guide/sisul_person_logo.png');}
.laboratory-table-title p.table-mail::before {background: url('../../images/guide/sisul_mail_logo.png');}
.laboratory-table-title p.table-laboratory::before {background: url('../../images/guide/sisul_logo.png');}
.laboratory-table-content {float: right; width: calc(100% - 165px);}
.laboratory-table-content p {color: #333;}
.laboratory-table-content p span {float: left;}
.send-mail {display: inline-block; width: 15px; height: 13px; margin-left: 10px; background: url('../../images/guide/mail.png'); text-indent: -9999px; vertical-align: middle;}

@media all and (max-width: 1250px) {
  .laboratory-image {width: 450px;}
  .laboratory-table {width: calc(100% - 450px);}
  .laboratory-table ul {padding-left: 35px;}
}

@media all and (max-width: 1023px) {
  .laboratory-inner {padding: 40px 20px 75px 20px;}
  .laboratory-image {float: none; width: 100%; max-width: 570px; margin: 0 auto;}
  .laboratory-table {float: none; width: 100%; margin-top: 30px;}
  .laboratory-table ul {padding-left: 0;}
}

@media all and (max-width: 768px) {
  .laboratory-header h1 {float: none;}
  .laboratory-header a {display: inline-block; float: none; margin-top: 20px;}
}

/* Contents Box3 */
.image-line-4  img {width: 100%;}
.image-line-4 ul::after {content:''; display: table; clear: both;}
.image-line-4 li {float: left; width: 24.4375%; margin-right: 0.75%;}
.image-line-4 li:last-child {margin-right: 0;}
.image-line-4 .image-text {position: relative; margin-top: 15px; padding-left: 16px;}
.image-line-4 .image-text::before {content: ''; position: absolute; left: 0; top: 0; display: block; width: 3px; height: 100%; background-color: #006276;}
.image-line-4 .image-text h1 {font-family: 'Dream Regular'; font-size: 20px; color: #006276;}
.image-line-4 .image-text p {margin-top: 13px; font-size: 16px; line-height: 20px; color: #333;}

@media all and (max-width: 1023px) {
  .image-line-4 li {width: 49%; margin-right: 2%;}
  .image-line-4 li:nth-child(even) {margin-right: 0;}
  .image-line-4 li:nth-child(n+3) {margin-top: 20px;}
}

@media all and (max-width: 768px) {
  .image-line-4 li {float: none; width: 100%; margin-right: 0%; margin-top: 20px;}
}

.image-line-3 img {width: 100%;}
.image-line-3 ul::after {content: ''; display: table; clear: both;}
.image-line-3 li {float: left; width: 30%; margin-right: 5%;}
.image-line-3 li:last-child {margin-right: 0;}
.image-line-3 .image-text {position: relative; margin-top: 15px; padding-left: 16px;}
.image-line-3 .image-text::before {content:''; display: block; position: absolute; left: 0; top: 0; width: 3px; height: 100%; background-color: #006276;}
.image-line-3 .image-text h1 {font-family: 'Dream Regular'; font-size: 20px; color: #006276;}
.image-line-3 .image-text p {margin-top: 13px; font-size: 16px; line-height: 20px; color: #333;}

@media all and (max-width: 768px) {
  .image-line-3 li {float: none; width: 100%; margin-right: 0; margin-top: 20px;}
}

/* Contents Box4 */
.area-link-inner {position: relative; padding: 0; background: url('../../images/guide/area.png') no-repeat top center;}
.area-link-box {position: absolute; left: 50%; top: 50%;  width: 340px; height: 340px; margin: 0 auto; background: rgba(0,98,118,0.8); border-radius: 50%; transform: translate(-50%, -50%);}
.area-link-box a {display: block; width: 100%; height: 100%; text-align: center; text-decoration: none; color: #fff;}
.area-link-text h1 {padding-top: 65px; font-family: 'Dream Regular'; font-size: 28px;}
.area-link-text p {position: relative; padding: 30px 30px 125px 30px; font-size: 16px;}
.area-link-text p::after {content: ''; position: absolute; left: 50%; bottom: 0; display: block; width: 40px; height: 40px; margin-left: -20px; background: url('../../images/guide/area_rrow.png');}
.area-img img {position: relative; left: 50%; max-width: none; transform: translate(-50%,0);}

@media all and (max-width: 768px) {
  .area-link-box {width: 250px; height: 250px;}
  .area-link-text h1 {padding-top: 40px; font-size: 20px;}
  .area-link-text p {padding: 15px 15px 100px 15px; font-size: 14px;}
}

/* Contents Box5 */
.major-sub-inner {position: relative;}
.major-sub-image {width: 66%; max-width: 920px;}
.major-sub-text {position: absolute; right: 10px; bottom: 30px; width: 100%; max-width: 630px; background-color: #f5f5f5;}
.major-sub-text::after {content: ''; position: absolute; right: -10px; bottom: -10px; z-index: -1; display: block; width: 100%; height: 100%;  background: url('../../images/guide/text_background.png');}
.major-sub-textbox {padding: 35px 65px 45px 40px;}
.major-sub-text h1 {position: relative; margin-bottom: 30px; padding-bottom: 30px; font-family: 'Dream Medium'; font-size: 24px; color: #006276;}
.major-sub-text h1::after {content: ''; display: block; position: absolute; left: 0; bottom: 0; width: 38px; height: 3px; background-color: #006276;}
.major-sub-text p {font-size: 16px; color: #333;}

@media all and (max-width: 1250px) {
  .major-sub-textbox {padding: 25px 40px 25px 20px;}
}

@media all and (max-width: 1023px) {
  .major-sub-image {width: 100%; max-width: none;}
  .major-sub-text {position: relative; right: 0; bottom: 0; width: calc(100% - 10px); max-width: none; margin-top: 20px;}
}

/* Contents Box6 */
.img-box {position: relative;}
.major-main-inner {position: relative; padding: 0; background: url('../../images/guide/major_background.png') no-repeat top center;}
.major-main-titlebox {position: absolute; left: 50%; top: 43%; text-align: center; transform: translate(-50%, -50%);}
.major-main-titlebox > span {display: inline-block; padding: 11.5px 13.5px; background-color: #006276; font-size: 18px; color: #fff;}
.major-main-title {position: relative; margin-top: 20px; padding: 41.5px 0;}
.major-main-title::before {content: ''; position: absolute; left: 50%; top: 0; display: block; width: 410px; height: 1px; margin-left: -205px; background-color: #fff;}
.major-main-title::after {content: ''; position: absolute; left: 50%; bottom: 0; display: block; width: 410px; height: 1px; margin-left: -205px; background-color: #fff;}
.major-main-title span {font-family: 'Dream Regular'; font-size: 20px; color: #fff;}
.major-main-title h1 {margin-top: 25px; font-family: 'Dream Regular'; font-size: 40px; color: #fff;}
.major-main-content {position: absolute; left: 50%; bottom: 0; width: 750px; margin: 0; background-color: #fff; transform: translate(-50%, 0%);}
.major-main-content p {position: relative; padding: 27px 45px 10px 45px; font-size: 16px; line-height: 25px; text-align: center; color: #333;}
.major-main-content p::before {content: ''; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 4px; background-color: #006276;}
.major-img img {position: relative; left: 50%; transform: translate(-50%,0); max-width: none;}

@media all and (max-width: 1023px) {
  .major-main-content {width: 100%; left: 0; margin-left: 0;}
}

@media all and (max-width: 768px) {
  .major-main-inner {padding-top: 60px;}
  .major-main-title {padding: 25px 0;}
  .major-main-title span {font-size: 16px;}
  .major-main-title h1 {font-size: 25px;}
  .major-main-title::before {width: 300px; margin-left: -150px;}
  .major-main-title::after {width: 300px; margin-left: -150px;}
  .major-main-content p {padding: 15px 20px 10px 20px; font-size: 14px; line-height: 22px;}
}

/* Contents Box7 */
.major-explan-inner {position: relative;}
.major-explan-inner .img {width: 57.2%}
.major-explan-inner .desc {position: absolute; right: 30px; top: 50%; width: 45%; padding: 40px; background: #006276; color: #fff; box-shadow: 5px 5px 12px 4px rgba(0,0,0,0.22); transform: translate(0, -50%);}
.major-explan-inner .desc strong {position: relative; display: block; padding: 0 0 30px 0; margin: 0 0 30px 0; font-family: 'Dream Regular'; font-size: 30px;}
.major-explan-inner .desc strong::after {content: ''; position: absolute; left: 0; bottom: 0; width: 64px; height: 1px; background: #fff;}
.major-explan-inner .desc p {font-family: 'Dream Regular'; font-size: 16px;}

@media all and (max-width: 1215px) {
  .major-explan-inner .desc {width: 60%;}
}

@media all and (max-width: 1024px) {
  .major-explan-inner .img {width: 100%;}
  .major-explan-inner .img img {width: 100%}
  .major-explan-inner .desc {position: static; width: 100%; transform: translate(0,0)}
}

/* Contents Box8 */
.graduate-inner::after {content: ''; display: table; clear: both;}
.graduate-image {float: left; width: 440px;}
.graduate-image-box {position: relative; width: 400px;}
.graduate-image-box::before {content: ''; display: block; position: absolute; left: 1.5%; top: 3.5%; width: 95.5%; height: 92.5%; border: 2px solid rgba(255,255,255,0.4);}
.graduate-image-box::after {content: ''; display: block; position: absolute; right: -37px; bottom: -38px; z-index: -1; width: 100%; height: 110%; background: url('../../images/guide/link_background.png') no-repeat right top;}
.graduate-text {float: right; width: calc(100% - 470px);}
.graduate-text a { position: relative; display: inline-block; padding: 13px 20px; background: url('../../images/guide/link_back.png'); border: 1px solid #ccc; font-family: 'Dream Regular'; font-size: 15px; text-decoration: none; color: #43505d;}
.graduate-text a::before {content: ''; position: absolute; left: 20px; top: 50%; display: block; width: 22px; height: 23px; margin-top: -11.5px; background: url('../../images/guide/link_logo.png');}
.graduate-text a span {padding-left: 32px; line-height: 23px;}
.graduate-text a:hover {background: none; background-color: #006276; color: #fff;}
.graduate-text a:hover::before {background: url('../../images/guide/link_logo_on.png')}
.graduate-text p {margin-top: 30px; font-size: 16px; line-height: 28px; color: #333;}

@media all and (max-width: 1024px) {
  .graduate-image {float: none; width: 100%;}
  .graduate-image-box {width: 95%;}
  .graduate-image-box::after {right: -5%; bottom: -12%; background-size: cover;}
  .graduate-image-box img {width: 100%;}
  .graduate-text {float: none; width: 100%; margin-top: 50px;}
}

/* Greeting Box1 */
.greeting-inner::after {content: ''; display: table; clear: both;}
.greeting-text {float: left; width: calc(100% - 751px); padding-left: 50px; border-left: 1px solid #006276;}
.greeting-title span {font-family: 'Dream Regular'; font-size: 26px; color: #006276; }
.greeting-title h1 {margin-top: 10px; font-family: 'Dream Medium'; font-size: 40px; color: #073862;}
.greeting-text p {margin-top: 30px; font-size: 16px; line-height: 1.8;}
.greeting-image {position: relative; float: right; width: 640px; text-align: right;}
.greeting-image::before {content: ''; display: block; position: absolute; left: 0; bottom: 0; width: 205px; height: 170px; background: url('../../images/guide/major_intro_sub.png');}
.greeting-image-box {display: inline-block; max-width: 560px; width: 87.6%;}

@media all and (max-width: 1250px) {
  .greeting-text {width: calc(100% - 650px);}
  .greeting-image {width: 550px;}
}

@media all and (max-width: 1023px) {
  .greeting-image {float: none; width: 100%;}
  .greeting-text {float: none; width: calc(100% - 1px); margin-top: 50px; padding-left: 0;}
  .greeting-image-box {width: calc(100% - 100px); max-width: none;}
  .greeting-title {padding-left: 30px;}
  .greeting-text p {padding-left: 30px;}
}

@media all and (max-width: 768px) {
  .greeting-title span {font-size: 22px;}
  .greeting-title h1 {font-size: 30px;}
  .greeting-text p {margin-top: 50px; font-size: 18px; line-height: 1.3;}
  .greeting-image::before {width: 150px; height: 124px; background-size: cover;}
}

@media all and (max-width: 420px) {
  .greeting-title span {font-size: 18px;}
  .greeting-title h1 {font-size: 25px;}
  .greeting-title {padding-left: 15px;}
  .greeting-text p {padding-left: 15px; font-size: 16px;}
}

/* Greeting Box2 */
.sub-greeting-inner::after {content: ''; display: table; clear: both;}
.sub-greeting-image {position: relative; float: left; width: 715px;}
.sub-greeting-image::before {content: ''; display: none; position: absolute; right: 68px; bottom: -68px; z-index: 2; width: 100px; height: 103px; background: url('../../images/guide/major_deco_2.png');}
.sub-greeting-image::after {content: ''; display: none; position: absolute; left: 0; bottom: -156px; width: 281px; height: 245px; background: url('../../images/guide/major_deco_1.png');}
.sub-greeting-image-box {position: relative; width: 570px;}
.sub-greeting-image-box::before {content: ''; position: absolute; right: -20px; bottom: -20px; z-index: -2; display: block; width: 100%; height: 100%; background-color: rgba(0,166,172,0.2);}
.sub-greeting-image-box::after {content: ''; display: none; position: absolute; left: 310px; bottom: -80px; z-index: -1; width: 166px; height: 164px; background: url('../../images/guide/major_deco_3.png');}
.sub-greeting-text {float: right; width: calc(100% - 715px);}
.sub-greeting-title h1 {font-family: 'Dream Regular'; font-size: 40px; color: #000;}
.sub-greeting-title span.color-green {color: #006276;}
.sub-greeting-title span.color-gray {display: inline-block; font-family: 'Dream Regular'; color: #9c9c9c;}
.sub-greeting-text p {margin-top: 30px; font-size: 16px; line-height: 1.8; color: #333;}

@media all and (max-width: 1250px) {
  .sub-greeting-image {width: 600px;}
  .sub-greeting-image-box {max-width: 455px;}
  .sub-greeting-image-box::after {left: 230px;}
  .sub-greeting-image::after {bottom: -120px; width: 200px; height: 174px; background-size: cover;}
  .sub-greeting-text {width: calc(100% - 600px);}
  .sub-greeting-title h1 {font-size: 35px;}
}

@media all and (max-width: 1023px) {
  .sub-greeting-image {float: none; width: 100%; }
  .sub-greeting-text {float: none; width: 100%; max-width: none; margin-top: 150px;}
  .sub-greeting-image-box {width: calc(100% - 20px); max-width: none;}
  .sub-greeting-image::before {right: 0;}
}

@media all and (max-width: 768px) {
  .sub-greeting-title h1 {font-size: 30px; line-height: 1.3;}
  .sub-greeting-text p {font-size: 18px; line-height: 1.3;}
  .sub-greeting-image::after {width: 120px; height: 105px; bottom: -40px;}
  .sub-greeting-image-box::after {left: 40%; bottom: -50px; width: 100px; height: 99px; background-size: cover;}
  .sub-greeting-image::before {bottom: -40px; width: 60px; height: 62px; background-size: cover;}
}

/* Type Common */
.link-btn {position: relative; display: inline-block; padding: 12px 55px 12px 35px; background: #0068B7; transition: background 0.3s, color 0.3s; border: 1px solid #0068B7; border-radius: 25px; font-size: 16px; color: #fff !important;}
.link-btn::after {content: ''; position: absolute; right: 27px; top: 14px; width: 17px; height: 16px; background: url('../../images/guide/ic_link.png') no-repeat;}
.link-btn:hover {background: #fff; color: #0068B7 !important;}
.link-btn:hover::after {background: url('../../images/guide/ic_link_on.png') no-repeat;}

/* Type1 */
.txt-type1 {position: relative; padding-top: 50px; }
.txt-type1::before {content: ''; position: absolute; left: 11%; bottom: 0; width: 49px; height: 60px; background: url('../../images/guide/ct1_bg3.png') no-repeat center;}
.txt-type1 .img-bx {float: right; width: 53.5%; padding: 0 0 0 50px;}
.txt-type1 .img-bx::before {content: ''; position: absolute; right: 4%; top: 0px; z-index: -1; width: 50%; height: 420px; background: url('../../images/guide/ct1_bg1.png') no-repeat top left; background-size: contain;}
.txt-type1 .title-bx {position: relative; float: left; width: 46.5%; padding: 50px 4% 0 0;}
.txt-type1 .title-bx::before {content: ''; position: absolute; right: 4%; top: -30px; width: 152px; height: 149px; background: url('../../images/guide/ct1_bg2.png') no-repeat center;}
.txt-type1 .title-bx .title {font-family: 'Dream Medium'; font-size: 28px; line-height: 38px;  color: #0068b7;}
.txt-type1 .title-bx .info {font-family: 'Dream Regular'; margin-top: 15px; font-size: 20px; line-height: 32px; color: #333;}

@media all and (max-width: 900px){
  .txt-type1 {padding-top: 0;}
  .txt-type1 .img-bx {float: none; width: 100%; padding: 50px 0 0 50px;}
  .txt-type1 .img-bx::before {width: 100%; right: auto; left: 0;}
  .txt-type1 .img-bx img {width: 100%;}

  .txt-type1 .title-bx {float: none; width: 100%; padding-top: 20px;}
}

/* Type2 */
.txt-type2 {margin-left: -260px; margin-right: -260px; padding: 0 260px;}
/* .txt-type2 .img-bx::before {content: ''; position: absolute; width: 38.5%; height: 89%; background: #F5F5F5; left: 0; bottom: 0; z-index: -1;} */
.txt-type2 .img-bx {position: relative; float: left; width: 45%; padding-right: 3%; padding-bottom: 45px;}
.txt-type2 .img-bx::before {content: ''; position: absolute; left: -41%; bottom: 0; z-index: -1; width: 117%; height: 90%; background: #F5F5F5;}
.txt-type2 .img-bx-inner {overflow: hidden; border-radius: 0 90px 0 0;}
.txt-type2 .title-bx {position: relative; float: left; width: 55%;}
.txt-type2 .title-bx::before {content: ''; position: absolute; bottom: 1% ; right: 14%; z-index: -1; width: 132px; height: 150px; background: url('../../images/guide/ct2_bg1.png') no-repeat; }
.txt-type2 .title-bx .title {position: relative; margin-bottom: 26px; padding: 19px 0 24px;}
.txt-type2 .title-bx .title::before {content: ''; position: absolute; left: -20%; bottom: 0; width: 51%; height: 3px; background: #0068B7;}
.txt-type2 .title-bx .title p {font-size: 30px; font-family: 'Dream Medium'; color: #111;}
.txt-type2 .title-bx .info > p {font-family: 'Dream Regular'; font-size: 18px; line-height: 28px; color: #333;}
.txt-type2 .title-bx ul {margin: 10px 0 30px 0;}
.txt-type2 .title-bx ul li {margin-bottom: 7px; padding-left: 30px; font-family: 'Dream Regular'; font-size: 16px; line-height: 30px; color: #333;}
.txt-type2 .title-bx ul li.location {background: url('../../images/guide/ic_location.png') no-repeat left 5px;}
.txt-type2 .title-bx ul li.tell {background: url('../../images/guide/ic_call.png') no-repeat left 5px;}

@media all and (max-width: 900px){
  .txt-type2 .img-bx {float: none; width: 100%; padding-right: 0; }
  .txt-type2 .img-bx-inner img {width: 100%;}
  .txt-type2 .title-bx {float: none; width: 100%;}
}

/* Type3 */
.txt-type3 {position: relative; padding: 30px 40px; }
.txt-type3-wrap::before {content: ''; position: absolute; left: 0; bottom: 0; width: 26px; height: 5px; background: #00A0E9;}
.txt-type3-wrap::after {content: ''; position: absolute; left: 0; bottom: 0; width: 5px; height: 93%; background: #00A0E9;}
.txt-type3-inner {overflow: hidden;}
.txt-type3-inner::before {content: ''; position: absolute; right: 0; top: 0; width: 26px; height: 5px; background: #004098;}
.txt-type3-inner::after {content: ''; position: absolute; right: 0; top: 0; width: 5px; height: 93%; background: #004098;}
.txt-type3::before {content: ''; position: absolute; left: 0; top: 0; width: 5px; height: 5px; background: #FF9600; border-radius: 50%;}
.txt-type3::after {content: ''; position: absolute;right: 0; bottom: 0; width: 5px; height: 5px; background: #00E4FF; border-radius: 50%;}
.txt-type3 .img-bx {position: relative; float: left; width: 47.5%;}
.txt-type3 .img-bx::after {content: ''; position: absolute; left: 0; top: 0; width: 15.3%; height: 25.7%; background: url('../../images/guide/img_logo.png') no-repeat; background-size: contain; box-shadow: 20px 20px 14px rgba(0, 0, 0, 0.3);}
.txt-type3 .title-bx {float: right; width: 52.5%; padding-left: 3%;}
.txt-type3 .title {padding: 35px 0 10px;}
.txt-type3 .title p {font-family: 'Dream Medium'; font-size: 22px; line-height: 25px; color: #111;}
.txt-type3 .info > p {font-family: 'Dream Regular'; font-size: 18px; line-height: 28px; color: #333;}
.txt-type3 .info ul {padding: 30px 0 31px;}
.txt-type3 .info ul li {margin-bottom: 5px; padding-left: 30px; font-family: 'Dream Regular'; font-size: 16px; line-height: 30px; color: #333;}
.txt-type3 .info ul li.location {background: url('../../images/guide/ic_location.png') no-repeat left 5px;}
.txt-type3 .info ul li.tell {background: url('../../images/guide/ic_call.png') no-repeat left 5px; }

@media all and (max-width: 900px){
  .txt-type3 .img-bx {float: none; width: 100%;}
  .txt-type3 .img-bx img {width: 100%;}
  .txt-type3 .title-bx {float: none; width: 100%; padding-left: 0;}
}

/* Type4 */
.txt-type4 {overflow: hidden; position: relative; padding: 45px 40px;}
.txt-type4::before {content: ''; position: absolute; right: 0; top: 0; width: 5px; height: 70px; background: url('../../images/guide/line_bg2.jpg');}
.txt-type4::after {content: ''; position: absolute; left: 0; bottom: 0; width: 5px; height: 70px; background: #F3F3F3;}

.txt-type4-wrap::before {content: ''; position: absolute; left: 0; top: 0; width: 5px; height: 70px; background: url('../../images/guide/line_bg2.jpg');}
.txt-type4-wrap::after {content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 5px; background: url('../../images/guide/line_bg2.jpg');}
.txt-type4-inner {overflow: hidden;}
.txt-type4-inner::before {content: ''; position: absolute; right: 0; bottom: 0; width: 5px; height: 70px; background: #F3F3F3;}
.txt-type4-inner::after {content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 5px; background: #F3F3F3;}

.txt-type4 .img-bx {float: left; width: 46.5%;}
.txt-type4 .title-bx {float: left; width: 52.5%; padding-left: 3%;}
.txt-type4 .title {margin-bottom: 10px; padding-top: 45px;}
.txt-type4 .title p {font-family: 'Dream Medium'; font-size: 22px; line-height: 25px; color: #111;}
.txt-type4 .info p {margin-bottom: 35px; font-family: 'Dream Regular'; font-size: 18px; line-height: 28px; color: #333;}
.txt-type4 .info p span {color: #0068b7;}

@media all and (max-width: 900px){
  .txt-type4 .img-bx {float: none; width: 100%;}
  .txt-type4 .img-bx img {width: 100%;}
  .txt-type4 .title-bx {float: none; width: 100%; padding-left: 0;}
}

/* Title Type */
.title-type {position: relative; padding-top: 180px; padding-bottom: 50px;}
.title-type::before {content: ''; position: absolute; right: 40px; top: 40%; width: 3px; height: 50%; background: #0068B7;}
.title-type::after {content: ''; position: absolute; left: 25%; bottom: 0; z-index: -2; width: 50%; height: 100%; background: url('../../images/guide/dot_bg.jpg');}
.title-bg::before {content: ''; position: absolute; left: 0; top: 0; z-index: -1;width: 100%; height: 300px; background: url('../../images/guide/sample_img1.png') no-repeat; background-size: cover;}
.title-type .title {display: inline-block; width: 57%; padding: 44px 3.5%; background: #fff;}
.title-type .title-inner {position: relative; display: table; width: 100%; height: 100%; }
.title-type .title-inner p {display: table-cell; padding-right: 150px; vertical-align: middle; font-family: 'Dream Regular'; font-size: 48px; line-height: 65px; letter-spacing: -1px; color: #000;}
.title-type .title-inner p strong {font-family: 'Dream Medium';}
.title-type .title-inner .img-bx {position: absolute; right: 0; top: 5px; width: 150px; vertical-align: middle;}
.title-type .title-inner .img-bx .table-bx {display: table; width: 100%; height: 100%;}
.title-type .title-inner .img-bx .cell-bx {display: table-cell; width: 100%; height: 100%; vertical-align: middle; text-align: center;}

@media all and (max-width: 900px){
  .title-type .title {width: 100%;}
  .title-type::before {display: none;}
}

@media all and (max-width: 500px){
  .title-type .title-inner {display: block; text-align: center;}
  .title-type .title-inner p {display: block; margin-top: 10px; padding-right: 0; font-size: 35px; line-height: 50px;}
  .title-type .title-inner .img-bx {position: static; display: inline-block;}
}

/* Type5 */
.txt-type5 {padding: 50px 3.5%; background: url('../../images/guide/ct5_bg.jpg') no-repeat; background-size: cover;}
.txt-type5 .title-bx { overflow: hidden; position: relative; padding: 40px 3.5% 60px; background: #fff; border-radius: 0 0 0 110px;}
.txt-type5 .title-bx::after {content: '2007'; position: absolute; right: 3%; bottom: -45px; z-index: 1; font-family: 'Dream Medium'; font-size: 100px; color: #fff; text-shadow: -2px 0 #eeeeee, 0 2px #eeeeee, 2px 0 #eeeeee, 0 -2px #eeeeee; letter-spacing: 5px;}
.txt-type5 .title {float: left; width: 42%; padding-right: 5%;}
.txt-type5 .title p.en-txt {font-family: 'Dream Regular'; font-size: 16px; line-height: 24px; color: #00a0e9;}
.txt-type5 .title p.ko-txt {margin-top: 8px; font-family: 'Dream Medium'; font-size: 34px; line-height: 40px; color: #111;}
.txt-type5 .info {position: relative; float: left; width: 58%; z-index: 2;}
.txt-type5 .info p {font-family: 'Dream Regular'; font-size: 19px; line-height: 30px; color: #333;}

@media all and (max-width: 900px){
  .txt-type5 .title {float: none; width: 100%; margin-bottom: 20px; padding-right: 0;}
  .txt-type5 .info {float: none; width: 100%;}
}

/* Type6 */
.txt-type6 {padding: 50px 3.5%; background: url('../../images/guide/ct5_bg.jpg') no-repeat; background-size: cover; text-align: center;}
.txt-type6 .title-bx {overflow: hidden; position: relative; padding: 40px 3% 60px; background: #fff url('../../images/guide/logo_bg.png') no-repeat right top; border-radius: 0 0 0 110px;}
.txt-type6 .title::after {content: ''; display: block; width: 52px; height: 1px; margin: 25px auto 30px; background: #000;}
.txt-type6 .title p {font-family: 'Dream Medium'; font-size: 34px; line-height: 40px; color: #111; }
.txt-type6 .info p {font-family: 'Dream Regular'; font-size: 18px; line-height: 30px;  line-height: 1.5; color: #333;}

@media all and (max-width: 640px) {
  .txt-type6 .title p {font-size: 27px;}
  .txt-type6 .info p {font-size: 16px;}
}

/* Type7 */
.txt-type7 {position: relative; padding-bottom: 150px; text-align: right;}
.txt-type7 .title-bx {position: absolute; left: 0; bottom: 60px; z-index: 2; width: 39%;}
.txt-type7 .title-inner-bx {position: relative; padding: 40px 8% 40px 0; background: #fff; text-align: left; box-shadow: 40px 40px 26px rgba(0, 0, 0, 0.2);}
.txt-type7 .title-inner-bx::before {content: ''; position: absolute; left: 37%; top: -40px; z-index: -1; width: 26%; height: 100%; background: url('../../images/guide/line_bg.png');}

.txt-type7 .title-inner-bx .title {position: relative; margin-bottom: 17px; padding-left: 10%;}
.txt-type7 .title-inner-bx .title::before {content: ''; position: absolute; left: 0; top: 23px; width: 8%; height: 3px; background: #0068B7;}
.txt-type7 .title-inner-bx .title p {font-family: 'Dream Medium'; font-size: 30px; letter-spacing: -0.75px; color: #111;}
.txt-type7 .title-inner-bx .info {padding-left: 10%;}
.txt-type7 .title-inner-bx .info p {font-family: 'Dream Regular'; font-size: 18px; line-height: 28px; color: #333;}

@media all and (max-width: 1023px){
  .txt-type7 {padding-bottom: 50px;}
  .txt-type7 .title-bx {width: 75%;}
}

@media all and (max-width: 900px){
  .txt-type7 .title-bx {position: static; width: 100%;}
}

/* Type8 */
.txt-type8 {position: relative; min-height: 560px;}
.txt-type8 .img-bx {position: absolute; left: 0; bottom: 0; width: 78.5%; height: 100%;}
.txt-type8 .type8-inner-bx {position: relative; z-index: 2; min-height: 560px; padding-top: 175px; text-align: right;}
.txt-type8 .type8-inner-bx::after {content: ''; position: absolute; right: 0; bottom: 0; z-index: -1; width: 64%; height: calc(100% - 175px); background: url('../../images/guide/ct6_bg1.png');}
.txt-type8 .title-bx {position: relative; padding-top: 15px; text-align: center;}
.txt-type8 .title-bx::after {content: ''; display: block; width: 18%; height: 1px; margin: 40px auto; background: rgba(255, 255, 255, 0.2);}
.txt-type8 .title-bx .title {display: inline-block; max-width: 100%; padding: 90px 90px 0; background: url('../../images/guide/round_txt.png') no-repeat right top;}
.txt-type8 .title-bx .title p {font-family: 'Dream Medium'; font-size: 50px; line-height: 70px; word-break: break-all; color: #fff;}
.txt-type8 .info-bx {display: inline-block; width: 64%; padding: 0 5%; padding-bottom: 38px; text-align: left;}
.txt-type8 .info-bx p {font-family: 'Dream Regular'; font-size: 18px; line-height: 30px; color: rgba(255, 255, 255, 0.5);}

@media all and (max-width: 1023px){
  .txt-type8::after {display: none;}
  .txt-type8 .img-bx {position: static; width: 100%;}
  .txt-type8 .type8-inner-bx {min-height: auto; padding: 40px 4%; background: url('../../images/guide/ct6_bg1.png');}
  .txt-type8 .type8-inner-bx::after {display: none;}
  .txt-type8 .info-bx {width: 100%;}
}

@media all and (max-width: 900px){
  .txt-type8 .type8-inner-bx {padding: 20px 4% 30px;}
  .txt-type8 .title-bx .title {padding: 45px 45px 0; background-size: 95px auto;}
  .txt-type8 .title-bx .title p {font-size: 35px; line-height: 50px;}
}


/* Type9 _수경원때문에 만듬*/
.txt-type9 {position: relative; padding-top: 50px; }
.txt-type9::before {content: ''; position: absolute; left: 11%; bottom: 0; width: 49px; height: 60px; background: url('../../images/guide/ct1_bg3.png') no-repeat center;}
.txt-type9 .img-bx {float: right; width: 53.5%; padding: 0 0 0 50px;}
.txt-type9 .img-bx::before {content: ''; position: absolute; right: 4%; top: 0px; z-index: -1; width: 50%; height: 420px; background: url('../../images/guide/ct1_bg1.png') no-repeat top left; background-size: contain;}
.txt-type9 .title-bx {position: relative; float: left; width: 100%; padding: 50px 4% 0 0;}
.txt-type9 .title-bx::before {content: ''; position: absolute; right: 4%; top: -30px; width: 152px; height: 149px; background: url('../../images/guide/ct1_bg2.png') no-repeat center;}
.txt-type9 .title-bx .title {font-family: 'Dream Medium'; font-size: 28px; line-height: 38px;  color: #0068b7;}
.txt-type9 .title-bx .info {font-family: 'Dream Regular'; margin-top: 15px; font-size: 20px; line-height: 32px; color: #333;}

@media all and (max-width: 900px){
  .txt-type9  {padding-top: 0;}
  .txt-type9 .img-bx {float: none; width: 100%; padding: 50px 0 0 50px;}
  .txt-type9 .img-bx::before {width: 100%; right: auto; left: 0;}
  .txt-type9 .img-bx img {width: 100%;}

  .txt-type9 .title-bx {float: none; width: 100%; padding-top: 20px;}
}

.chart-type {border-top: 2px solid #110F0D; }
.chart-type > p {margin-top: 10px; font-family: 'Dream Regular'; font-size: 16px; color: #888;}
.chart-type .chart-bg {overflow: hidden;}
.chart-type .chart-list {background: url('../../images/guide/chart_line.png'); border-bottom: 1px solid #C6C6C6;}
.chart-type .chart-inner {position: relative; float: left; width: 20%; min-height: 500px; text-align: center;}

.chart-type .chart-percent {position: absolute; left: 50%; top: -40px; display: inline-block; width: 75px; height: 28px; margin-left: -37.5px; background: #EDEDED; border-radius: 15px; font-family: 'Dream Medium'; font-size: 17px; text-align: center; line-height: 28px; color: #5c5c5c;}
.chart-type .chart-line {position: absolute; left: 50%; bottom: 0; height: 0; width: 55px; margin-left: -22.5px; transition: height 0.75s;}
.chart-type.active .chart-line.style1 {height: 71%; background: url('../../images/guide/chart_type1.jpg');}
.chart-type.active .chart-line.style2 {height: 63%; background: url('../../images/guide/chart_type4.jpg');}
.chart-type.active .chart-line.style3 {height: 39%; background: url('../../images/guide/chart_type3.jpg');}
.chart-type.active .chart-line.style4 {height: 31%; background: url('../../images/guide/chart_type2.jpg'); }
.chart-type.active .chart-line.style5 {height: 15%; background: url('../../images/guide/chart_type5.jpg');}

.chart-title p {position: relative; float: left; width: 20%; font-family: 'Dream Regular'; font-size: 16px; line-height: 50px; text-align: center; color: #5c5c5c;}
.chart-title p::after {content: ''; position: absolute; left: 0; top: 0; width: 1px; height: 20px; background: #C6C6C6;}
.chart-title p:first-child::after {display: none;}

@media all and (max-width: 500px){
  .chart-type .chart-percent {top: -30px; width: 50px; height: 20px; margin-left: -25px; font-size: 15px; line-height: 20px;}
  .chart-type .chart-line {width: 30px; margin-left: -15px;}
  .chart-title p {padding: 0 2%; font-size: 14px; line-height: 20px;}
}

.mission-bx .mission-title {float: left; width: 200px; padding-top: 5px; border-top: 1px solid #110F0D;}
.mission-bx .mission-title p {font-family: 'Dream Medium'; font-size: 26px; line-height: 50px; color: #111;}
.mission-bx .mission-info {float: right; width: calc(94% - 200px);}
.mission-bx .mission-info p {padding: 50px 4%; background: url('../../images/guide/mission_bg.jpg') no-repeat; background-size: cover; font-family: 'Dream Medium'; font-size: 30px; text-align: center; line-height: 42px; color: #fff; }

@media all and (max-width: 768px){
  .mission-bx .mission-title {float: none; width: 100%; }
  .mission-bx .mission-info {float: none; width: 100%;}
  .mission-bx .mission-info p {font-size: 22px; line-height: 30px;}
}

.vision-bx .vision-title {float: left; width: 200px; padding-top: 5px; border-top: 1px solid #110F0D;}
.vision-bx .vision-title p {font-family: 'Dream Medium'; font-size: 26px; line-height: 50px; color: #111;}
.vision-bx .vision-info {float: right; width: calc(94% - 200px);}

.vision-list-wrap {max-width: 850px; margin: 0 auto;}
.vision-list {display: table; width: 100%; height: 100%; text-align: center;}
.vision-list .vision-inner {display: table-cell; width: 30%; height: 250px; vertical-align: middle;}
.vision-list .vision-inner.style1 {background: url('../../images/guide/vision_bg1.png') no-repeat center; background-size: contain;}
.vision-list .vision-inner.style2 {background: url('../../images/guide/vision_bg2.png') no-repeat center; background-size: contain;}
.vision-list .vision-inner.style3 {background: url('../../images/guide/vision_bg3.png') no-repeat center; background-size: contain;}
.vision-list .vision-inner p {font-family: 'Dream Regular'; font-size: 20px; margin-top: 12px; color: #fff;}
.vision-list .vision-line {display: table-cell; width: 5%; height: 250px; vertical-align: middle;}
.vision-list .vision-line.line1 {background: url('../../images/guide/vision_line_1.png') no-repeat center;}
.vision-list .vision-line.line2 {background: url('../../images/guide/vision_line_2.png') no-repeat center;}

.vision-arrow {padding: 15px 0; text-align: center;}

.table-bx {display: table; width: 100%; height: 100%; border-radius: 50%;}
.cell-bx {display: table-cell; height: 170px; padding: 0 30px; vertical-align: middle; text-align: center;}

.round-bx {padding: 20px 15px; border: 1px solid #ccc; border-radius: 100px; text-align: center;}
.round-bx-inner {display: inline-block; width: 170px; margin-left: -15px;}
.round-bx-inner.line1 .table-bx {border: 1px solid #002F6C;}
.round-bx-inner.line2 .table-bx {border: 1px solid #0068b7;}
.round-bx-inner.line3 .table-bx {border: 1px solid #004098;}
.round-bx-inner.line4 .table-bx {border: 1px solid #00a0e9;}
.round-bx-inner.line5 .table-bx {border: 1px solid #524fb0;}
.round-bx-inner p {font-family: 'Dream Regular'; font-size: 18px; line-height: 28px;}
.round-bx-inner.line1 p {color: #002f6c;}
.round-bx-inner.line2 p {color: #0068b7;}
.round-bx-inner.line3 p {color: #004098;}
.round-bx-inner.line4 p {color: #0275a9;}
.round-bx-inner.line5 p {color: #524fb0;}

.round-bx.big-round {border-radius: 150px;}
.round-bx.big-round .round-bx-inner {width: 250px; margin-left: -30px;}
.round-bx.big-round .cell-bx {height: 250px;}
.round-bx.big-round p {font-family: 'Dream Medium';}

@media all and (max-width: 1130px){
  .vision-bx .vision-title {float: none; width: 100%;}
  .vision-bx .vision-info {float: none; width: 100%;}
}

@media all and (max-width: 1023px){
  .round-bx.big-round .round-bx-inner {width: 170px;}
  .round-bx.big-round .cell-bx {height: 170px; margin-left: -15px;}
}

@media all and (max-width: 870px){
  .vision-list {display: block;}
  .vision-list .vision-inner {position: relative; display: block; width: 100%; height: auto; padding: 30px 4%;}
  .vision-list .vision-inner.style1 {background: none;}
  .vision-list .vision-inner.style1::before {content: ''; position: absolute; left: 0; top: 0; z-index: -2; width: 100%; height: 100%; background: rgba(0, 104, 183, 0.1);}
  .vision-list .vision-inner.style1::after {content: ''; position: absolute; left: 15px; top: 15px; z-index: -1; width: calc(100% - 30px); height: calc(100% - 30px); background: #0072BC;}

  .vision-list .vision-inner.style2 {background: none;}
  .vision-list .vision-inner.style2::before {content: ''; position: absolute; left: 0; top: 0; z-index: -2; width: 100%; height: 100%; background: rgba(0, 64, 152, 0.1);}
  .vision-list .vision-inner.style2::after {content: ''; position: absolute; left: 15px; top: 15px; z-index: -1; width: calc(100% - 30px); height: calc(100% - 30px); background: #004098;}

  .vision-list .vision-inner.style3 {background: none;}
  .vision-list .vision-inner.style3::before {content: ''; position: absolute; left: 0; top: 0; z-index: -2; width: 100%; height: 100%; background: rgba(10, 200, 250, 0.1);}
  .vision-list .vision-inner.style3::after {content: ''; position: absolute; left: 15px; top: 15px; z-index: -1; width: calc(100% - 30px); height: calc(100% - 30px); background: #00A0E9;}

  .vision-list .vision-line {position: relative; display: block; width: 100%; height: 50px;}
  .vision-list .vision-line.line1 {background: none;}
  .vision-list .vision-line.line1::before {content: ''; position: absolute; left: 50%; top: 50%; width: 28px; height: 28px; margin-left: -14px; margin-top: -14px; background: url('../../images/guide/vision_line_1.png') no-repeat center; transform: rotate(90deg);}

  .vision-list .vision-line.line2 {background: none;}
  .vision-list .vision-line.line2::before {content: ''; position: absolute; left: 50%; top: 50%; width: 28px; height: 28px; margin-left: -14px; margin-top: -14px; background: url('../../images/guide/vision_line_2.png') no-repeat center; transform: rotate(90deg);}

  .round-bx {border-radius: 50px;}
  .round-bx-inner {width: 90%; margin-left: 0;}
  .table-bx {border-radius: 30px;}
  .cell-bx {height: 60px;}

  .round-bx.big-round {border-radius: 50px;}
  .round-bx.big-round .round-bx-inner {width: 90%; margin-left: 0;}
  .round-bx.big-round .cell-bx {height: 60px;}
}

.img-wrap {padding: 5px; background: url('../../images/guide/img_bx_line.png'); text-align: center;}
.img-inner {padding: 30px 4%; background: #fff;}

.bracket-bx {position: relative; max-width: 745px; margin-left: auto; margin-right: auto; padding: 10px 55px;}
.bracket-bx::before {content: ''; position: absolute; left: 0; top: 0; width: 50px; height: 100%;  background: url('../../images/guide/bracket_left.png') no-repeat center;}
.bracket-bx::after {content: ''; position: absolute; right: 0; top: 0; width: 50px; height: 100%;  background: url('../../images/guide/bracket_right.png') no-repeat center;}
.bracket-inner {display: table; width: 100%; height: 100%;}
.bracket-inner .bracket-info {display: table-cell; width: 100%; height: 170px; vertical-align: middle; text-align: center;}
.bracket-inner .bracket-info p {font-family: 'Dream Medium'; font-size: 18px; line-height: 1.6; color: #111; }
.bracket-inner .bracket-info p span {color: #0072BC;}

.diagram-img {position: relative; height: 560px; margin-bottom: 70px; background: url('../../images/guide/diagram_img.png') no-repeat center;}
.diagram-inner {position: absolute;}
.diagram-inner .diagram-img-info > p {position: absolute; width: 240px; font-family: 'Dream Regular'; font-size: 18px; line-height: 24px; text-align: left; color: #333;}
.diagram-inner .diagram-img-info > p span {display: block; margin-bottom: 10px; font-family: 'Dream Medium'; font-size: 20px; line-height: 24px;}
.diagram-inner .diagram-icon p {font-family: 'Dream Medium'; font-size: 20px; color: #fff;}
.diagram-inner .diagram-img-info {position: relative;}

.diagram-inner.type1 {left: 50%; top: 13%; width: 280px; margin-left: -140px; text-align: center;}
.diagram-inner.type1 .diagram-img-info > p {right: -335px; top: 35%; padding-left: 40px; background: #fff;}
.diagram-inner.type1 .diagram-img-info > p::before {content: ''; position: absolute; left: -140px; top: 50%; z-index: -1; width: 100%; height: 2px; margin-top: -1px; background: url('../../images/guide/diagram_line.png');}
.diagram-inner.type1 .diagram-img-info > p::after {content: ''; position: absolute; left: 0; top: 50%; width: 18px; height: 18px; margin-top: -9px; background: url('../../images/guide/diagram_dot_1.png') no-repeat left center;}
.diagram-inner.type1 .diagram-img-info > p span {color: #088989;}

.diagram-inner.type2 {left: 50%; top: 68%; width: 215px; margin-left: -280px; text-align: center;}
.diagram-inner.type2 .diagram-img-info > p {left: -320px; top: 50%; padding-right: 40px; background: #fff; text-align: right;}
.diagram-inner.type2 .diagram-img-info > p::before {content: ''; position: absolute; right: -140px; top: 50%; z-index: -1; width: 100%; height: 2px; margin-top: -1px; background: url('../../images/guide/diagram_line.png');}
.diagram-inner.type2 .diagram-img-info > p::after {content: ''; position: absolute; right: 0; top: 50%; width: 18px; height: 18px; margin-top: -9px; background: url('../../images/guide/diagram_dot_2.png') no-repeat left center;}
.diagram-inner.type2 .diagram-img-info > p span {color: #004098;}

.diagram-inner.type3 {right: 50%; top: 68%; width: 215px; margin-right: -280px; text-align: center;}
.diagram-inner.type3 .diagram-img-info > p {right: -320px; top: 50%; padding-left: 40px; background: #fff ;}
.diagram-inner.type3 .diagram-img-info > p::before {content: ''; position: absolute; width: 100%; height: 2px; left: -140px; top: 50%; z-index: -1; margin-top: -1px; background: url('../../images/guide/diagram_line.png');}
.diagram-inner.type3 .diagram-img-info > p::after {content: ''; position: absolute; left: 0; top: 50%; width: 18px; height: 18px; margin-top: -9px; background: url('../../images/guide/diagram_dot_3.png') no-repeat left center;}
.diagram-inner.type3 .diagram-img-info > p span {color: #0182bd;}

.diagram-list {margin: 0 -1%;}
.diagram-list-inner {float: left; width: 33.33%; padding: 0 1%;}
.diagram-list-inner > p {position: relative; z-index: 1; width: 200px; height: 50px; margin: 0 auto; border-radius: 30px; font-family: 'Dream Medium'; font-size: 18px; text-align: center; line-height: 50px; color: #fff;}
.diagram-list-inner.list1 > p {background: #0072BC;}
.diagram-list-inner.list2 > p {background: #004098;}
.diagram-list-inner.list3 > p {background: #0177ad;}

.diagram-list .list-bx {min-height: 270px; margin-top: -25px; padding: 55px 7% 20px; background: #F7F7F7;}
.diagram-list .list-bx > p {font-family: 'Dream Regular'; font-size: 22px; line-height: 1.45; color: #111;}
.diagram-list .list-bx ul {margin-top: 10px;}
.diagram-list .list-bx ul li {position: relative; margin-top: 7px; padding-left: 20px; font-family: 'Dream Regular'; font-size: 16px; line-height: 25px; color: #333;}
.diagram-list .list-bx ul li::before {content: ''; position: absolute; left: 0; top: 9px; width: 7px; height: 7px; background: #CCD0D7; border-radius: 50%;}

@media all and (max-width: 1200px){
  .diagram-inner .diagram-img-info > p {width: 180px;}
  .diagram-inner.type1 .diagram-img-info > p {right: -230px;}
  .diagram-inner.type2 .diagram-img-info > p {left: -210px; top: 35%;}
  .diagram-inner.type3 .diagram-img-info > p {right: -210px; top: 35%;}
}

@media all and (max-width: 990px){
  .diagram-img {overflow: hidden; background: none; height: auto;}
  .diagram-inner {float: left; position: static; padding: 0 10px; width: 33.33%;}
  .diagram-inner .diagram-img-info {overflow: hidden; display: table; width: 100%;}

  .diagram-inner.type1 {width: 33.33%; margin-left: 0;}
  .diagram-inner.type2 {width: 33.33%; margin-left: 0;}
  .diagram-inner.type3 {width: 33.33%; margin-right: 0;}

  .diagram-inner .diagram-img-info > p {position: relative; right: auto !important; left: auto !important; top: auto !important; width: auto; vertical-align: middle; text-align: center;}
  .diagram-inner.type1 .diagram-img-info > p {padding-left: 0px; padding-top: 55px; background: none;}
  .diagram-inner.type1 .diagram-img-info > p::before {left: auto; top: -15px; width: 45px; transform: rotate(90deg) translate(50%, 22.5px);}
  .diagram-inner.type1 .diagram-img-info > p::after {left: 50%; top: 25px; margin-left: -9px;}
  .diagram-inner.type2 .diagram-img-info > p {padding-right: 0; padding-top: 55px; background: none; text-align: center;}
  .diagram-inner.type2 .diagram-img-info > p::before {left: auto; right: auto; top: -15px; width: 45px; transform: rotate(90deg) translate(50%, 22.5px);}
  .diagram-inner.type2 .diagram-img-info > p::after {left: 50%; right: auto; top: 25px; margin-left: -9px;}
  .diagram-inner.type3 .diagram-img-info > p {padding-left: 0; padding-top: 55px; background: none;}
  .diagram-inner.type3 .diagram-img-info > p::before {left: auto; top: -15px; width: 45px; transform: rotate(90deg) translate(50%, 22.5px);}
  .diagram-inner.type3 .diagram-img-info > p::after {left: 50%; top: 25px; margin-left: -9px;}

  .diagram-icon {position: relative; z-index: 1; width: 100%; margin: 0 auto; padding: 50px 15px; vertical-align: middle;}
  .diagram-icon p {word-break: break-all;}
  .diagram-inner.type1 .diagram-icon::before {content: ''; position: absolute; left: 0; top: 0; z-index: -2; width: 100%; height: 100%; background: rgba(0, 104, 183, 0.1);}
  .diagram-inner.type1 .diagram-icon::after {content: ''; position: absolute; left: 15px; top: 15px; z-index: -1; width: calc(100% - 30px); height: calc(100% - 30px); background: #0072BC;}
  .diagram-inner.type2 .diagram-icon::before {content: ''; position: absolute; left: 0; top: 0; z-index: -2; width: 100%; height: 100%; background: rgba(0, 64, 152, 0.1);}
  .diagram-inner.type2 .diagram-icon::after {content: ''; position: absolute; left: 15px; top: 15px; z-index: -1; width: calc(100% - 30px); height: calc(100% - 30px); background: #004098;}
  .diagram-inner.type3 .diagram-icon::before {content: ''; position: absolute; left: 0; top: 0; z-index: -2; width: 100%; height: 100%; background: rgba(10, 200, 250, 0.1);}
  .diagram-inner.type3 .diagram-icon::after {content: ''; position: absolute; left: 15px; top: 15px; z-index: -1; width: calc(100% - 30px); height: calc(100% - 30px); background: #00A0E9;}
}

@media all and (max-width: 768px){
  .diagram-img {margin-bottom: 30px;}
  .diagram-list {margin: 0;}
  .diagram-list-inner {float: none; width: 100%; margin-bottom: 20px; padding: 0;}
  .diagram-list .list-bx {min-height: auto; padding: 45px 7% 30px;}
}

@media all and (max-width: 500px){
  .diagram-inner {float: none; width: 100%; margin-bottom: 20px;}
  .diagram-inner.type1 {width: 100%;}
  .diagram-inner.type2 {width: 100%;}
  .diagram-inner.type3 {width: 100%;}
}

/*수산경제연구원*/
.con-list-img{overflow:hidden; margin-top:20px;}
.con-list-img .thum{float:right; width:40%; text-align:right;}
.con-list-img > ul{float:left; width:60%;}
.con-list-img > ul > li {position: relative; margin: 7px 0 0 0; padding-left: 20px; font-family: 'Dream Regular'; font-size: 16px; line-height: 1.5; letter-spacing: -0.5px; color: #333;}
.con-list-img > ul > li::before {content: ''; position: absolute; left: 0; top: 9px; width: 7px; height: 7px; background: #ccd0d7; border-radius: 100%;}
.con-list-img > ul > li strong {font-family: 'Dream Medium'; color: #2321a1; padding-right:10px;}
.con-list-img.fei-fis02 .thum{float:left; margin-right:40px; width:calc(40% - 40px)}
.con-list-img.fei-fis02 > ul{float:left;}

@media all and (max-width: 1024px){
	.con-list-img.fei-fis02 .thum{margin:0 0 10px 0; width:100%;}
  .con-list-img .thum{width:100%; margin-top:30px;}
  .con-list-img .thum img{width:100%;}
  .con-list-img > ul{width:100%;}
}