@charset "utf-8";

#subContainer {margin: 0 auto;padding: 4.5rem 0 6rem 0;position: relative;height: 100%;min-height: 35rem}
#content_detail {max-width: 120rem;width: 100%;margin: 0 auto;color: #424242;line-height: 1.92rem}
#right_menu {position: absolute;right: 1rem;top: 3rem;width: 11rem;height: 100%}
#right_menu .right_title {color: #000;font-weight: 400;font-size: 1rem;border-bottom: 4px solid #000;padding-bottom: 1rem;margin-bottom: 1rem}
#right_menu .rgtmenu {border-top: 1px solid #e2e2e2}
#right_menu .rgtmenu>li>a {position: relative;font-size: .85rem;color: #464646;display: block;border-bottom: 1px solid #e2e2e2;padding: 1rem .5rem;transition: all .6s}
#right_menu .rgtmenu>li>a:after {position: absolute;right: .5rem;top: 50%;transform: translateY(-50%);font-family: 'xeicon';content: '\e942'}
#right_menu .rgtmenu>li>a.link:after {display: none}
#right_menu .rgtmenu>li>a:hover,#right_menu .rgtmenu>li>a.on {background: #07386f;color: #fff}
#right_menu .rgtmenu>li>a.on:after {content: '\e945'}
#right_menu .rgtmenu>li>ul {display: none;border-bottom: 1px solid #e2e2e2;border-top: none;background: #f6f7f8;padding: .5rem 1rem}
#right_menu .rgtmenu>li>ul>li>a {position: relative;font-size: 1.4rem;padding: 0 0 0 .5rem;border-bottom: none;line-height: 1.25rem;display: block;transition: .2s}
#right_menu .rgtmenu>li>ul>li>a:before {position: absolute;left: 0;top: 50%;transform: translateY(-50%);height: 1px;width: 5px;background: #464646;content: ''}
#right_menu .rgtmenu>li>ul>li>a:after {display: none}
#right_menu .rgtmenu>li>ul>li>a:hover {color: #000;font-weight: 400}
#right_menu .rgtmenu>li>ul>li>a.on {color: #000;font-weight: 400}
#location {height: 3rem;box-shadow: 0 5px 8px rgba(240, 240, 240, 1)}
#location .lnb {width: 100%;max-width: 120rem;height: 3rem;margin: auto;z-index: 2}
#location .lnb:after {content: '';display: block;clear: both}
#location .lnb>* {float: left}
#location .lnb .home {position: relative;width: 3rem;height: 3rem;line-height: 3rem;border-right: 1px solid #f0f0f0;font-size: 1.1rem;text-align: center}
#location .lnb .home:before {position: absolute;left: 0;top: 0;width: 100%;height: 100%;content: ''}
#location .lnb .home i {position: relative;z-index: 1}
#location .lnb .submenu {border-right: 1px solid #f0f0f0;position: relative;min-width: 12.5rem}
#location .lnb .submenu>button {position: relative;padding: 0 1rem 0 1.2rem;width: 100%;text-align: left;height: 3rem;line-height: 3rem;font-size: 1.8rem;transition: .4s}
#location .lnb .submenu>button:after {position: absolute;right: 1rem;top: 50%;transform: translateY(-50%);font-family: 'xeicon';content: '\e942'}
#location .lnb .submenu>button.on {background: #07386f;color: #fff}
#location .lnb .submenu>button.on:after {content: '\e945'}
#location .lnb .submenu>div {position: absolute;top: 3rem;left: 0;width: 100%;display: none;height: auto}
#location .lnb .submenu>div:before {position: absolute;left: 0;top: 0;width: 100%;height: 100%}
#location .lnb .submenu ul {background: #dee6ef;position: relative;z-index: 10}
#location .lnb .submenu li a {font-weight: 300;color: #222;display: block;padding: 1rem 1rem;border-bottom: 1px solid #fff;transition: .2s}
#location .lnb .submenu li a:hover,
#location .lnb .submenu li a:focus,
#location .lnb .submenu li a:active {color: #000;font-weight: 400;background: #edf2f7}
#subvisual {position: relative;overflow: hidden;min-height: 12.4rem;margin-top: 7rem}
#subvisual:before {content: '';width: 100%;position: absolute;left: 50%;top: 0;bottom: 0;height: 100%;
transform: translateX(-50%);background-size: cover;z-index: -10;background-repeat: no-repeat;background-position: center center;animation-duration: 2s;animation-name: subvisual;animation-timing-function: ease-out}
#subvisual.sub01:before {background-image: url(../images/sub/subimg01.jpg)}
#subvisual.sub02:before {background-image: url(../images/sub/subimg02.jpg)}
#subvisual.sub03:before {background-image: url(../images/sub/subimg03.jpg)}
#subvisual.sub04:before {background-image: url(../images/sub/subimg04.jpg)}
#subvisual.sub05:before {background-image: url(../images/sub/subimg05.jpg)}
#subvisual.sub06:before {background-image: url(../images/sub/subimg06.jpg)}
#subvisual.sub07:before {background-image: url(../images/sub/subimg07.jpg)}
#subvisual .txtwrap {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%)}
#subvisual .txtwrap h2 {position: relative;overflow: hidden;color: #fff;font-size: 2rem;font-weight: 500;animation-name: subtxt;animation-duration: 2s;
animation-iteration-count: 1;word-break: keep-all;text-align: center}
@keyframes subvisual {0% {transform: translateX(-50%) scale(1.15)}100% {transform: translateX(-50%) scale(1)}}
@keyframes subtxt {0% {opacity: 0;transform: translateY(-100px)}50% {opacity: .5;transform: translateY(15px)}100% {opacity: 1;
transform: translateY(0)}}
[class^="title0"] {position: relative;font-weight: 500}
[class^="title0"]:before {position: absolute;left: 0;content: '';background-size: contain;background-repeat: no-repeat}
.title01 {font-size: 2rem;color: #000;margin-bottom: 1.5rem}
.title02 {font-size: 2.1rem;color: #015A98;padding-left: 1.6rem;margin: 1.5rem 0 .6rem}
.title02:before {top: 1rem;width: .9rem;height: .8rem;background-image: url(../images/sub/bull_title02.gif)}
.title02.line {border-bottom: 1px solid #424242;padding-bottom: 1rem}
.title02 .totalnum {font-size: 1.5rem;color: #c00202}
.title03 {font-size: 2rem;color: #000}
.title04 {margin-top: 3rem;font-size: 1.9rem;color: #000;position: relative;padding: 1.25rem 0}
.title04:before {content: '';position: absolute;top: 0;left: 0;width: 20px;height: 2px;background: #000}
.title04.search {margin-top: 0}
.title_info {position: relative;padding-left:2rem;margin-top: 1.5rem}
.title_info:before {content: '\e9a7';position: absolute;top: 0;left: 0;font-family: 'xeicon';font-size: 1.6rem;color: #000;line-height: 2rem}
.marb_10 {margin-bottom: 10px}
.mart_20 {margin-top: 20px}
.introbox {margin: 2rem 0;position: relative;height: 30rem}
.introbox .thum>img {border: 1px solid #d9d9d9}
.introbox .desc {position: absolute;right: 0;bottom: 0;width: 60%;height: 60%;box-shadow: 0 1px 16px rgba(0, 0, 0, .2);background: #fff;padding: 0 2rem}
.introgeo {margin: 2rem 0 2.5rem 0;position: relative}
.introgeo .thum {position: relative;margin-top: -1rem;/*z-index: -1*/}
.introgeo .desc {width: 68rem;max-width: 100%;box-shadow: 0 1px 16px rgba(0, 0, 0, .2);background: #fff;padding: 2rem 3rem 2rem 3rem;margin: 0 0 0 auto}
.introbox .desc li {position: relative;padding-left: 8px}
.introbox .desc li:before {content: '';position: absolute;top: 10px;left: 0;width: 4px;height: 1px;background: #5b5b5b}
.introbox .desc2 {position: absolute;right: 0;top: 35%;width: 60%;height: auto;background: #eff3f6;padding: 0 0;border: 1px solid #d5d5d5;overflow: hidden}
.introbox .desc2 span {display: inline-block;padding-top: 1rem;width: 49%;text-align: center}
.introbox2 {margin: 4rem 0;position: relative;height: 47rem}
.introbox2 .thum>img {border: 1px solid #d9d9d9}
.introbox2 .desc2 {position: absolute;right: 0;top: 35%;width: 60%;height: auto;background: #eff3f6;padding: 0 0;border: 1px solid #d5d5d5;overflow: hidden}
.introbox2 .desc2 span {display: inline-block;padding-top: 1rem;width: 49%;text-align: center}
.introform {margin: 3rem 0;position: relative;height: 63rem;overflow: hidden}
.introform.weather {height: 31rem}
.introform .desc {position: absolute;left: 1rem;top: 1.5rem;width: 54%;box-shadow: 0 1px 16px rgba(0, 0, 0, .2);background: #fff;padding: 2rem}
.introform .thum {float: right;text-align: center}
.introform .thum>img {border: 1px solid #d9d9d9}
.introbox:after {content: '';display: block;clear: both}
.introform .desc2 {position: absolute;right: 1rem;top: 1.5rem;width: 54%;box-shadow: 0 1px 16px rgba(0, 0, 0, .2);background: #fff;padding: 2rem}
.introform .thum2 {float: left}
.introform2 {margin: 2rem 0;position: relative;overflow: hidden}
.introform2 .thum {float: left;width: 80%}
.introform2 .thum>img {border: 1px solid #d9d9d9}
.introform2 .thum .caption {text-align: center;display: inline-block;width: 100%}
.introform2 .desc {float: right;width: 23%;margin: 1.5rem 1rem 0 -7%;/*max-height: 15rem;*/height: 100%;padding: 1.5rem;box-shadow: 0 1px 16px rgba(0, 0, 0, .2);background: #fff}
.introform2 .desc li {font-size: 1.5rem}
.introform2 .desc li span {display: inline-block;width: .65rem;height: .65rem;border-radius: 50%;margin-right: .25rem;vertical-align: middle}
.introform3 {margin: 2rem 0;position: relative;overflow: hidden}
.introform3>div {float: left}
.introform3>div:first-child {margin-right: 1rem}
.introform3>div img {border: 1px solid #d9d9d9;width: 100%}
.introform4 {margin: 2rem 0;position: relative;overflow: hidden}
.introform4 .thum {float: left;width: 75%}
.introform4 .thum>img {max-width: 100%}
.introform4 .thum .caption {text-align: center;display: inline-block;width: 100%}
.introform4 .desc {float: left;width: 17.5rem;margin: 3rem 1rem 0 -7%;max-height: 15rem;height: 100%;padding: 2rem;box-shadow: 0 1px 16px rgba(0, 0, 0, .2);background: #fff}
.introform4 .desc li {font-size: 1.5rem}
.introform4 .desc li span {display: inline-block;width: 5rem;height: 1rem;margin-right: 1rem;vertical-align: middle}
.color01 {background: #6dcff6;border: 1px solid #06b0ef}
.color02 {background: #a8ff00;border: 1px solid #2bd92b}
.color03 {background: #0054a6;border: 1px solid #0606ff}
.color04 {background: #f26522;border: 1px solid #a0410d}
.color05 {background: #d0b5ed;border: 1px solid #a186be}
.color06 {background: #ffc000;border: 1px solid #c2960b}
.color07 {background: #fff8a5;border: 1px solid #e1cc1a}
.color08 {background: #6751d7;border: 1px solid #383296}
.color09 {background: #faebe9;border: 1px solid #baad9e}
.color10 {background: #afcb56}
.color11 {background: #ffd800}
.color12 {background: #116eed}
.txtref {color: #fa4c00}
.txtblue {color: #115caa}
.txtblue2 {color: #015A98;font-weight: 500}
.desc_subinfo {margin-top: 2rem}
.desc_subinfo dt {font-size: 1.8rem;color: #000;margin-top: 1.2rem}
.desc_subinfo dd {color: #424242}
.privacy_box {margin-top: .5rem;border: 3px solid #ececec;padding: 1rem 2rem}
.desc_subinfo .process {margin: 1.5rem 0}
.list_dash li {position: relative;padding-top: .3rem;padding-left: .5rem}
.list_dash li:before {content: '';position: absolute;left: 0;top: .9rem;background: #5b5b5b;width: 4px;height: 1px}
.list_dash li ol li {position: relative;padding-top: .2rem;padding-left: .4rem}
.list_dash li ol li:before {content: '';position: absolute;left: 0;top: .7rem;background: #5b5b5b;width: 2px;height: 2px}
.climate {margin: 1rem 0;overflow: hidden}
.climate .items {float: left;width: 50%}
.climate .items .iconbox {padding: 0 5rem 5rem 13rem;vertical-align: top;margin-top: 1.5rem;position: relative}
.climate .items .iconbox:before {content: '';position: absolute;left: 0}
.climate .items .iconbox.icon01:before {background: url(../images/sub/icon_climate01.png) no-repeat;width: 80px;height: 84px}
.climate .items .iconbox.icon02:before {background: url(../images/sub/icon_climate02.png) no-repeat;width: 97px;height: 81px}
.climate .items .iconbox.icon03:before {background: url(../images/sub/icon_climate03.png) no-repeat;width: 102px;height: 79px}
.climate .items .iconbox.icon04:before {background: url(../images/sub/icon_climate04.png) no-repeat;width: 95px;height: 71px}
.climate .items .iconbox.icon05:before {background:url(../images/sub/icon_climate05.png) no-repeat;width:91px;height:90px}
.climate .items .iconbox.icon06:before {background:url(../images/sub/icon_climate06.png) no-repeat;width:95px;height:86px}
.climate .items .iconbox.icon07:before {background:url(../images/sub/icon_climate07.png) no-repeat;width:92px;height:90px}
.climate .items .iconbox.icon08:before {background:url(../images/sub/icon_climate08.png) no-repeat;width:96px;height:90px}
.list_type01 {overflow: hidden;padding-bottom:2px;}
.list_type01 li {float: left;border: 1px solid #d9d9d9;width: 16%;border-right: 0}
.list_type01 li p {background: #f7f8f9;color: #000;font-size: 1.6rem;padding: .8rem .6rem;text-align: center}
.list_type01 li span {display: block;padding: .66rem;text-align: center;border-top: 1px solid #d9d9d9}
.list_type01 li:nth-child(5) {border-right: 1px solid #d9d9d9}
.list_type01 li:last-child {border-right: 1px solid #d9d9d9;margin-left: 2%}
.list_type02 {overflow: hidden;margin: 1rem auto;width: 99%}
.list_type02 li {float: left;border: 1px solid #d9d9d9;width: 9.8%;border-left: 0;background: #fff}
.list_type02 li p {background: #f7f8f9;color: #000;font-size: 1.6rem;padding: .8rem .2rem;text-align: center;}
.list_type02 li span {display: block;padding: .66rem;text-align: center;border-top: 1px solid #d9d9d9}
.list_type02 li:first-child {width: 11%;border-left: 1px solid #d9d9d9}.landwrap {margin: 1rem 0}
.landwrap .caption {font-size: 1.4rem;color: #646464}
.landwrap .caption span {display: inline-block;padding: 0}
.landwrap .caption span.list1 {width: calc(100% - 11rem);text-align: center}
.landwrap .caption span.list2 {width: 10rem;text-align: right}
.list_land {overflow: hidden;width: 100%;margin: .5rem 0}
.list_land li {float: left;border: 1px solid #d9d9d9;width: 6.5%;border-left: 0;background: #fff}
.list_land li p {background: #f7f8f9;color: #000;font-size: 1.6rem;padding: .8rem .6rem;text-align: center}
.list_land li span {display: block;padding: .66rem;text-align: center;border-top: 1px solid #d9d9d9}
.list_land li:first-child {width: 9%;
border-left: 1px solid #d9d9d9}
/**********************.tablewrap {border: 1px solid #d9d9d9;
overflow: hidden}
.tablewrap table {position: relative;
width: 100%}
.tablewrap thead th {background: #f7f8f9;
border-left: 1px solid #d9d9d9}
.tablewrap th {font-size:1.6rem;
color: #000;
font-weight: 400}
.tablewrap th,
.tablewrap td {text-align: center;
padding: .7rem .75rem}
.tablewrap tbody th,
.tablewrap td {border-top: 1px solid #d9d9d9;
border-left: 1px solid #d9d9d9}
.tablewrap thead tr+tr th {border-top: 1px solid #d9d9d9;
border-left: 0}
.tablewrap thead th:first-child,
.tablewrap tbody th:first-child {border-left: 0}***********************/
.tab_1depth {margin: 2.5rem auto;text-align: center}
.tab_1depth>div {display: inline-block;position: relative;padding: 0 30px}
.tab_1depth ul {display: inline-flex;padding: 3px 3px;border: 1px solid #d5d5d5;border-radius: 55px}
.tab_1depth ul li a {display: block;position: relative;font-size: 2.1rem;color: #000;line-height: 55px;padding: 0 1.5rem;transition: .3s}
.tab_1depth ul li.active a,
.tab_1depth ul li:hover a {background: #015A98;color: #fff;border-radius: 55px}
#tab1,#tab2 {display: none}
.active#tab1,
.active#tab2 {display: block}
.tabmenu { }
.tabmenu .tab_2depth {padding: 10px 50px 10px 0;text-align: right;}
.tabmenu .tab_2depth .selected {display: none}
.tabmenu .tab_2depth .selected span {display: inline-block;color: #fff;padding-right: 18px;width: 100%;background: url(../images/sub/tab_select.png) no-repeat 95% 50%;background-size: 14px auto;font-weight: 300;font-size: 16px}
.tabmenu .tab_2depth ul li {display: inline-block;position: relative;line-height: 3.4rem}
.tabmenu .tab_2depth ul li a {display: inline-block;border: 1px solid #d8d8d8;background: #fff;font-size:1.6rem;
color: #000;padding: 0 1.5rem;border-radius: 1rem;transition: .3s;z-index: 2; }
.tabmenu .tab_2depth ul li a:hover {background: #08235b;color: #fff;border: 1px solid #08235b}
.tabmenu .tab_2depth ul li.on {z-index: 6}
.tabmenu .tab_2depth ul li.on a {background: #08235b;color: #fff;border: 1px solid #08235b}
a.btn {position: relative;display: inline-block;height: 2.5rem;border-radius: 1.75rem;background: #04254b;color: #fff;font-size: 1.8rem;padding: 0 1.25rem;line-height: 2.5rem;transition: .4s}
a.btn:hover {background: #004798}
[class^="ico_"]:before,
[class*="ico_"]:before {font-family: 'xeicon';font-size: inherit;margin-right: .4rem}
.ico_list:before {content: '\e95c'}
.ico_wrt:before {content: '\ea81'}
.ico_edit:before {content: '\e9c3'}
.ico_print:before {content: '\e9bb'}
.ico_del:before {content: '\e921'}
.ico_print:before {content: '\e9bb'}
.ico_srch:before {content: '\e97a'}
.ico_check:before {content: '\e928'}
.ico_cancel:before {content: '\e9d2'}
.ico_logout:before {content: '\e972'}
.ico_refresh:before {content: '\e973'}
.ico_viewmore:before {content: '\e942'}
.ico_link:before {content: '\e980'}
.ico_phone:before {content: '\eaed'}
.btnsm {position: relative;display: inline-block;height: 1.5rem;border-radius: .5rem;background: #a9a1b3;color: #fff;font-size: 1.5rem;padding: 0 .5rem;line-height: 1.5rem;transition: .4s}
.btnsm:hover {background: #6f5b87}
.btnsm.allselect {background: #7b5ca1}
.btnsm.delselect {background: #53589f}
.btnsm.allselect:hover {background: #6b35ab}
.btnsm.delselect:hover {background: #505adc}
.btnsch {position: relative;width: 2.6rem;height: 2.6rem;background: #04254b;border-radius: 50%;font-size: 0;vertical-align: middle;transition: .3s}
.btnsch:before {content: '\e97a';position: absolute;top: 0;left: 50%;font-family: 'xeicon';font-size: 1rem;line-height: 2.6rem;color: #fff;transform: translateX(-50%)}
.btnsch:hover {background: #0550a4}
/* .viewmore {position: relative;display: inline-block;height: 2.5rem;border-radius: 1.75rem;background: #04254b;color: #fff;font-size: 1.6rem;padding: 0 2.5rem 0 1.25rem;line-height: 2.5rem}.viewmore:hover {background: #004798}
.viewmore:before {content: '\e942';position: absolute;top: 50%;right: 1.25rem;font-family: 'xeicon';color: #fff;font-size: 1.6rem;transform: translateY(-50%)} */
.boardinfo {margin-top: 2rem;overflow: hidden}
.boardinfo .pagenum {float: left;line-height: 2.6rem}
.boardinfo .searchbbs {float: right}
.boardinfo .searchbbs>fieldset {padding-bottom: 1rem}
.boardinfo span {display: inline-block;line-height: 2.4rem}
.form_select>select {height: 2.4rem;font-size: 1.6rem;padding: 0 1rem}
/* .form_input>input,.form_date>input {height: 2.4rem;padding-left: .5rem;font-size: 1.6rem;width: 12.25rem} */
.form_date {position: relative}
.form_date>input {padding-right: 2.2rem;width: 8rem}
.icon_date {background: url(../images/sub/icon_calendar.png) no-repeat;width: 22px;height: 22px;position: absolute;right: .7rem;top: 50%;font-size: 0;transform: translateY(-50%)}
.boardinfo.patent {padding-left: 10rem;position: relative;padding-bottom: 1rem}.boardinfo.patent:before {content: '';position: absolute;top: 50%;left: 2rem;background: url(../images/sub/icon_patent.png) no-repeat;width: 80px;height: 71px;transform: translateY(-50%)}
.boardinfo.patent p {margin-bottom: .5rem}
.boardinfo.patent strong {color: #000;display: inline-block;margin-right: .9rem;vertical-align: middle;position: relative;padding-left: .5rem}
.boardinfo.patent strong:before {content: '';position: absolute;top: 50%;left: 0;width: 3px;height: 3px;background: #000;transform: translateY(-50%)}.board_list {border-top: 1px solid #424242}
.board_list li {overflow: hidden;padding: 1rem 1rem;border-bottom: 1px solid #dfdfdf;transition: .5s;position: relative}
.board_list li a {display: block}
.board_list li:hover {background: #f8fafd}
.board_list li a:after {content: '\e93f';font-family: 'xeicon';position: absolute;right: 1rem;top: 1rem;width: 4rem;height: 4rem;border-radius: 50%;border: 1px solid #e3e3e3;background: #fff;text-align: center;font-size: 2rem;color: #000;line-height: 4rem;cursor: pointer}
.board_list li dl {padding-right: 8rem}
.board_list li dt {font-size: 1.6rem}
.board_list li dd {color: #424242;font-size: 1.4rem;font-weight: 300;line-height: .8rem;padding: .3rem 1rem 0 0}
.board_list li .photo {float: left;width: 33rem;height: 25rem}
.board_list li .photo.book {float: left;width: 7rem;height: 9.25rem;border: 1px solid #f2f2f2;text-align: center}
.board_list li .desc {float: right;width: calc(100% - 40rem);padding-right: 8rem}
.board_list li .desc.book {float: right;width: 85%;padding-right: 4rem}
.board_list li .desc.book li {border-bottom: 0;padding: 0}
.board_list li .desc.book li:after {display: none}
.board_list li .desc .heading {color: #000000;font-size: 2rem}
.board_list li .desc .text {margin: 1rem 0}
.board_list li .desc .date {font-size: 1.5rem}
.board_list li .desc .category {font-size: 1.6rem;color: #ea2c06}
.nodata {padding: 2rem 0;border-bottom: 1px solid #dfdfdf;text-align: center}
.noimg {position: relative;width: 100%;height: 100%;background: #e5e5e5;text-indent: -9999px}
.noimg:before {content: '';position: absolute;top: 50%;left: 50%;background-image: url(../images/sub/icon_noimg.png);background-repeat: no-repeat;background-position: center center;background-size: 50% auto;width: 100%;height: 100%;transform: translate(-50%, -50%)}
.board_pager {margin: 2rem 0;text-align: center}
.board_pager a {width: 1.9rem;height: 1.9rem;text-align: center;background-color: transparent;color: #717171;border: 1px solid #dedede;display: inline-block;vertical-align: middle;font-size: 1.6rem;padding-top: .25rem;margin: 0 1px;text-decoration: none;box-sizing: border-box}
.board_pager a:hover {background-color: #f8fafd;transition: .3s}
.board_pager .pagenone {border: 1px solid #dedede}
.board_pager .pagenone:hover {border-color: #000;transition: .3s}
.board_pager .pagenow {border: 2px solid #000}
.board_pager .pagenow strong {color: #000}
.board_pager i {font-size: 1rem;margin-top: .2rem;color: #777}
.board_pager .pagefirst i:after {content: '\e93c';font-family: 'xeicon';margin-left: -.8rem}
.board_pager .pagelast i:after {content: '\e93f';font-family: 'xeicon';margin-left: -.8rem}
.board_pager .pageprev {margin-right: .1rem}
.board_pager .pagenext {margin-left: .1rem}
.board_pager .counter {margin-left: .5rem;vertical-align: middle}
.board_pager .counter strong {color: #000}
.board_view {border-top: 1px solid #424242;margin-top: 2rem}
.board_view .heading {padding: 1.5rem 0;border-bottom: 1px solid #dedede;position: relative}
.board_view .heading .category {display: inline-block;padding: .2rem .7rem;border: 2px solid #1b9dd9;background: #f2f9fd;font-size: 1.4rem;color: #000;border-radius: 1rem}
.board_view .heading .title {font-size: 2.4rem;color: #000;margin: 1rem 0 1rem 0}
.board_view .heading .title2 {font-size: 2.4rem;color: #000;margin: 0 1rem;line-height: 2rem}
.board_view .heading .text {font-size: 1.6rem;color: #424242;font-weight: 300}
.board_view .heading .date {position: absolute;top: 1.5rem;right: 1rem}
.board_view .inventor {padding: .5rem;border: 3px solid #dedede;overflow: hidden}
.board_view .inventor>div {float: left}
.board_view .inventor .people {width: 70%;padding-left: 2rem;position: relative}
.board_view .inventor .people .title04 {margin-top: .5rem;padding-bottom: 0}
.board_view .inventor .people>ul {margin-left: 7.5rem;width: 60%}
.board_view .inventor .people:before {content: '';position: absolute;top: 3rem;left: 2rem;width: 5rem;height: 5rem;border-radius: 50%;background: #f7f7f7;background-image: url(../images/sub/icon_namecard.png);background-repeat: no-repeat;background-size: 47px 64px;background-position: center center}.board_view .inventor .people li {font-size: 1.6rem;padding: .5rem 0;border-bottom: 1px solid #e2e2e2}
.board_view .inventor .people li span {display: inline-block;width: 3.5rem;color: #000}
.board_view .inventor .copyright {width: 30%;background: #f7f7f7;padding: 1rem}
.board_view .inventor .copyright p.tit {color: #000;font-size: 1.9rem;margin-bottom: 1rem;font-weight: 500;padding-left: 1.5rem;position: relative}
.board_view .inventor .copyright p.tit:before {content: '';position: absolute;top: 50%;left: 0;background: url(../images/sub/icon_alarm.png) no-repeat;width: 19px;height: 20px;transform: translateY(-50%)}.board_view .inventor .copyright li {font-size: 1.4rem;margin-bottom: .3rem}
.board_view .inventor .copyright li span {display: inline-block;width: 3.5rem;padding-left: 8px;position: relative}
.board_view .inventor .copyright li span:before {content: '';width: 4px;height: 1px;background: #393939;position: absolute;top: 13px;left: 0}
.board_view .desc {padding: 1rem 2rem;border-bottom: 1px solid #dedede}.board_view .board_info {padding: 1.5rem .5rem;border-bottom: 1px solid #dedede;overflow: hidden}
.board_view .board_info .photo {float: left;width: 30%}
.board_view .board_info .infotext {float: left;width: 70%}
.board_view .infobbs {padding: .5rem .5rem;border-bottom: 1px solid #dedede}
.board_view .infobbs>span {display: inline-block;width: calc(50% - .5rem)}
.board_view .attfile {padding: .5rem .5rem;border-bottom: 1px solid #dedede;overflow: hidden}
.board_view .attfile p {float: left;width: 4rem}
.board_view .attfile ul {float: right;width: calc(100% - 4rem)}
.board_view .attfile ul li {font-size: 1.5rem;margin-bottom: .2rem;position: relative}
.board_view .attfile ul li:after {content: '\eb7c';position: absolute;font-family: xeicon;font-size: 1.6rem;color: #0c0c0c;top: 0;margin-left: .3rem}
.board_view .attfile ul li.nofile:after {display: none}
.board_view .prevnex li {padding: .75rem 1rem;border-bottom: 1px solid #dedede}.board_view .prevnex li span {border-right: 1px solid #dedede;padding-right: 2.5rem;display: inline-block;margin-right: 1rem;position: relative;color: #000}
.board_view .prevnex li span:after {content: '';position: absolute;font-family: xeicon;font-size: 1rem;color: #0c0c0c;margin-left: 1rem}
.board_view .prevnex li span.prev:after {content: '\e942'}
.board_view .prevnex li span.next:after {content: '\e945'}
.board_view .bookhis {padding: .5rem .5rem;border-bottom: 1px solid #dedede;text-align: right}
.board_view .bookhis>span {position: relative;margin-left: 15px;padding-left: 15px}
.board_view .bookhis>span:before {content: '';position: absolute;top: 50%;left: 0;width: 1px;height: 14px;background: #5b5b5b;transform: translateY(-50%)}
.totalsearch li {padding: 1rem 0;border-bottom: 1px solid #dfdfdf}
.totalsearch li dt {color: #8c8c8c;margin-bottom: .5rem}
.totalsearch li dt.textbold {color: #000000;margin-bottom: .5rem;font-size: 1rem}
.totalsearch li dd.file {margin: .5rem 0;font-size: 1.5rem}
a.filedown {position: relative;display: inline-block}
a.filedown:after {content: '\eb7c';position: relative;font-family: xeicon;font-size: 1.6rem;color: #0c0c0c;top: 0;right: 0;margin-left: .3rem}
.totalsearch li dd.date {font-size: 1.5rem;color: #5b5b5b}
.totalsearch li dd a:hover {color: #000}
.boxtext {background: #f2f9fd;font-size: 1.4rem;color: #000;border: 2px solid #1b9dd9;border-radius: 15px;padding: .1rem .25rem;display: inline-block}
.figurewrap {position: relative;margin: 1.5rem 0;overflow: hidden}
.figurewrap img {max-width: 100%}
.figurewrap>figcaption {text-align: center}
.figurewrap2 {position: relative;margin: 1.5rem 0;overflow: hidden}
.figurewrap2 .right {display: inline-block;margin-left: 52%}
.figurewrap2 .right figcaption {font-size: 1.5rem;display: block;margin-top: .5rem}
.figurewrap2 .info {display: inline-block;position: absolute;margin-right: 52%}
.figurewrap3 {margin: 1.5rem 0;overflow: hidden;position: relative}
.figurewrap3 img {display: inline-block;margin-right: 40%}
.figurewrap3 span {display: inline-block;margin-left: 65%;position: absolute;left: 0;bottom: 0;font-size: 1.5rem}
.figurewrap3 span.txtmar {margin-left: 65%}
.figurewrap4 {position: relative;margin: 1.5rem 0;overflow: hidden}
.figurewrap4>div {float: left;margin-right: 3rem}
.figurewrap4>div span {display: block;font-size: 1.5rem;text-align: center;margin-top: .5rem}
.figurewrap4 div.width25 {width: 25%;margin: 0 auto;text-align: center}
.figurewrap4 div.width25>span {text-align: left;padding: 0 1rem}
.figurewrap5 {position: relative;margin: 1.5rem 0;overflow: hidden}
.figurewrap5 .thum {float: left;text-align: center}
.figurewrap5 .thum2 {float: left;width: 40%}
.figurewrap5 .thum3 {float: right;width: 40%;text-align: right}
.figurewrap5 .thum>img,
.figurewrap5 .thum2>img,
.figurewrap5 .thum3>img {border: 1px solid #cacaca}
.figurewrap5 .thum span {display: block;font-size: 1.5rem;text-align: center;margin-top: .5rem}
.figurewrap5 .desc {float: left;width: 70%;padding-left: 2rem}
.figurewrap5 .desc2 {float: left;width: 50%;padding-left: 2rem}
.figurewrap5 .desc3 {float: left;width: 60%;padding-left: 2rem}
.figurewrap5 .desc4 {float: left;width: 60%;padding-left: 0}
.figurewrap5>img {display: inline-block;margin-right: 40%;border: 1px solid #cacaca}
.figurewrap5>span {display: inline-block;margin-left: 60%;position: absolute;left: 0;bottom: 0;font-size: 1.5rem}
.figurewrap5.center {width: auto;text-align: center}
.figurewrap5.center>img {width: 58%}
.figurewrap5.center>span {text-align: left}
.figurewrap6 {margin: 1.5rem 0;overflow: hidden;position: relative;text-align: center}
.figurewrap6 img {border: 1px solid #cacaca}
.caption {margin-top: .5rem}
.caption li {width: 20%;display: inline-block;font-size: 1.4rem}
.imgborder {border: 1px solid #cacaca}
.humanwrap {margin-top: 1.5rem;background: #f8fafd;border: 1px solid #cacaca;text-align: center;padding: 1.5rem 0}
.humanwrap img {max-width: 100%}
.humanwrap2 {margin-top: 1.5rem;background: #f8fafd;border: 1px solid #cacaca;text-align: center;padding: 1.5rem 0}
.humanwrap2 img {max-width: 100%}
.vistorwrap {margin: 1.5rem 0;overflow: hidden}
.vistorwrap>div {float: left}
.vistorwrap .list1 {width: 60%}
.vistorwrap .list2 {width: 38%;margin-left: 2%}
.vistorwrap .list3 {width: 38%;margin-right: 2%}
.vistorwrap .thum {background: #f8fafd;border: 1px solid #cacaca;text-align: center;padding: 1rem 0}
.vistorwrap .thum>img {max-width: 100%}
.vistorwrap span {display: block;text-align: center}
.citizenwrap {display: none}
.markwrap {margin: 2rem auto;max-width: 90%;width: 90%;box-shadow: 0 0 10px rgba(0, 0, 0, .15);padding: 4rem}
.markbox {position: relative;border: 2px solid #b9b29e;padding: 5px}
.markinner {border: 2px solid #b9b29e;padding: 4rem 2.5rem}
.markbox:before,.markbox:after,.markinner:before,.markinner:after {position: absolute;
top: -2px;
left: -2px;
content: '';
display: inline-block;
width: 1.4rem;
height: 1.4rem;
background: url(../images/sub/bull_chart.png) no-repeat;
background-size: cover}
.markbox:after {left: auto;
right: -2px;
transform: rotate(90deg)}
.markinner:before {top: auto;
bottom: -2px;
transform: rotate(-90deg)}
.markinner:after {top: auto;
bottom: -2px;
left: auto;
right: -2px;
transform: rotate(180deg)}
.mark_title {position: relative;
font-size: 3rem;
text-align: center;
color: #000;
line-height: 2rem;
margin-bottom: 3.6rem;
padding-bottom: 1.5rem;
font-family: 'Nanum Myeongjo', serif;
letter-spacing: -1px}
.mark_title:before {content: '';
position: absolute;
bottom: 0;
left: 50%;
background: #beb8a6;
height: 1px;
width: 65%;
transform: translateX(-50%)}
.mark_title:after {content: '';
position: absolute;
bottom: -5px;
left: 50%;
background: #d4cfc3;
height: 1px;
width: 40%;
transform: translateX(-50%)}
.mark_desc {padding: 3rem 0 1rem 0}
.mark_desc .imgbox {overflow: hidden}
.mark_desc .imgbox div {float: left;
width: calc(100% - 32rem)}
.mark_desc .imgbox div:first-child {width: 32rem}
.mark_desc .heading {font-size: 1.9rem;
color: #000}
.mark_desc dl {font-size: 1.5rem;
margin-top: 1rem}
.mark_desc dt {color: #000;
font-weight: 500}
.mark_desc dd {color: #555555}
ul.example {overflow: hidden}
ul.example li {padding: .5rem 0;
float: left}
ul.example li:nth-child(1n) {width: 20%}
ul.example li:nth-child(2n) {width: 80%}
/****
.moviewrap {background: #eaeef1;padding: 2rem;overflow: hidden}
.moviewrap .movimgbox {height: 100%;width: 60%;float: left}
.moviewrap .movimgbox .playwrap {position: relative;padding: 56.25% 0 0 0;overflow: hidden}
.moviewrap .movimgbox .playwrap .viedoplay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;border: 0}
.moviewrap .movimgbox .playwrap .btn {position: absolute;top: 50%;left: 50%;width: 3.2rem;height: 3.2rem;transform: translate(-50%, -50%)}
.moviewrap .movimgbox .playwrap .btn a {display: block;width: 3.2rem;height: 3.2rem;border-radius: 50%;background: #ff7e00;color: #fff;
font-size: 0;transition: .3s}
.moviewrap .movimgbox .playwrap .btn a:before {content: '\ea3e';
font-family: xeicon;
font-size: 1.4rem;
color: #fff;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
line-height: 0}
.moviewrap .movimgbox .playwrap .btn a:hover {background: #d84c08}
.moviewrap .movcaption {padding-left: 3%;
width: 40%;
float: right}
.moviewrap .movcaption .title {font-size: 1.2rem;
color: #000;
border-bottom: 1px solid #000;
padding-bottom: 1rem;
display: inline-block}
.moviewrap .movcaption dl {margin-top: 4.5rem}
.moviewrap .movcaption dl dt {color: #0c0c0c;
font-size: 1.85rem;
font-weight: 500;
margin-bottom: .5rem}
.moviewrap .movcaption dl dd {color: #515151;
font-size: 1.5rem}
*****************************/
.thumlist {overflow: hidden;
border-top: 1px solid #424242;
padding-top: 2rem}
.thumlist.ttsrch {border-top: 0;
padding-top: .5rem}
.thumlist ul li {float: left;
width: 31%;
margin: 0 3.5% 3.5% 0}
.thumlist ul li:nth-of-type(3n) {margin-right: 0}
.thumlist ul li a {display: block;
position: relative;
transition: all .6s .4s}
.thumlist ul li>a:hover {transform: translateZ(0);
box-shadow: 3px 3px 10px rgba(0, 0, 0, .3)}
.thumlist ul li .desc {height: 2.5rem;
text-align: center;
margin-top: 1rem;
transition: all .3s}
.thumlist ul li:hover .desc {padding: 0 .5rem}
.thumlist ul li .thumb {overflow: hidden;
width: 100%}
.thumlist ul li .thumb .box {min-height: 254px;
position: relative;
background: #e5e5e5}
.thumlist ul li .thumb .box img {position: absolute;
top: 50%;
left: 50%;
transform: scale(1) translate(-50%, -50%);
width: 100%;
height: auto;
max-height: 100%;
transition: all .6s}
.thumlist ul li:hover .thumb .box img {transform: scale(1.15) translate(-50%, -50%)}
.thumlist ul li .thumb:before {display: block;
content: '';
width: 0;
height: 2px;
background: #000;
position: absolute;
right: 0;
top: 0;
z-index: 1;
transition: all .3s .3s}
.thumlist ul li .thumb:after {display: block;
content: '';
width: 0;
height: 2px;
background: #000;
position: absolute;
left: 0;
bottom: 0;
z-index: 1;
transition: all .3s .3s}
.thumlist ul li .desc:before {display: block;
content: '';
width: 2px;
height: 0;
background: #000;
position: absolute;
left: 0;
top: 0;
z-index: 1;
transition: all .3s 0s}
.thumlist ul li .desc:after {display: block;
content: '';
width: 2px;
height: 0;
background: #000;
position: absolute;
right: 0;
bottom: 0;
z-index: 1;
transition: all .3s}
.thumlist ul li:hover .thumb:before {width: 100%;
transition: all .3s 0s}
.thumlist ul li:hover .thumb:after {width: 100%;
transition: all .3s 0s}
.thumlist ul li:hover .desc:before {height: 100%;
transition: all .3s .3s}
.thumlist ul li:hover .desc:after {height: 100%;
transition: all .3s .3s}
.animatewrap {overflow: hidden;
height: 25rem;
margin: 2rem 0;
position: relative;
padding: 2rem 0}
.animatewrap .movimgbox {height: 90%;
width: 53%;
position: absolute;
left: 0;
top: -1.5rem}
.animatewrap .movimgbox:after {content: '';
position: absolute;
left: 100%;
top: 19%;
background: url(../images/sub/bg_animate.png) no-repeat;
width: 368px;
height: 179px;
z-index: -1}
.animatewrap .movimgbox .playwrap {position: relative;
padding: 74.8% 0 0 0;
overflow: hidden}
.animatewrap .movimgbox .playwrap .viedoplay {position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 0}
.animatewrap .movimgbox .playwrap .btn {position: absolute;
top: 50%;
left: 50%;
width: 3.2rem;
height: 3.2rem;
transform: translate(-50%, -50%)}
.animatewrap .movimgbox .playwrap .btn a {display: block;
width: 3.2rem;
height: 3.2rem;
border-radius: 50%;
background: #ff7e00;
color: #fff;
font-size: 0;
transition: .3s}
.animatewrap .movimgbox .playwrap .btn a:before {content: '\ea3e';
font-family: xeicon;
font-size: 1.4rem;
color: #fff;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
line-height: 0}
.animatewrap .movimgbox .playwrap .btn a:hover {background: #d84c08}
.animatewrap .movcaption {height: 45%;
width: 65%;
position: absolute;
right: 2rem;
bottom: 2rem;
background: #fff;
box-shadow: 5px 0 18px rgba(0, 0, 0, .14);
z-index: -1}
.animatewrap .movcaption .title {font-size: 1.2rem;
color: #000;
border-bottom: 1px solid #000;
padding-bottom: 1rem;
display: inline-block}
.animatewrap .movcaption dl {margin: 2rem 2rem 0 15rem}
.animatewrap .movcaption dl dt {color: #0c0c0c;
font-size: 1.85rem;
font-weight: 500;
margin-bottom: 1rem}
.animatewrap .movcaption dl dd {color: #515151;
font-size: 1.5rem}
.animatelist {padding: 2rem 0;
overflow: hidden}
.animatelist .title {width: 8rem;
float: left;
font-size: 1.9rem;
color: #000;
border-bottom: 2px solid #000;
padding-bottom: .5rem;
letter-spacing: -1px}
.animatelist .ani_slide {position: relative;
float: left;
height: 100%;
width: 85%;
overflow: hidden}
.animatelist .ani_slide .control {height: auto;
padding: 0 3rem}
.animatelist .ani_slide .control>button {position: absolute;
width: 2.5rem;
height: 2.5rem;
border-radius: 50%;
box-shadow: 0 0 10px rgba(0, 0, 0, .12)}
.animatelist .ani_slide .control button {width: 2.5rem;
height: 2.5rem;
text-indent: -9999px;
overflow: hidden;
background-repeat: no-repeat;
background-position: center center;
transition: .2s;
border-radius: 50%;
background-color: rgba(255, 255, 255, .8);
position: absolute;
top: 50%;
transform: translateY(-50%)}
.animatelist .thum_ani .contbtn button:hover {background-color: rgba(255, 255, 255, 1);
box-shadow: 0 0 5px rgba(0, 0, 0, .25)}
.animatelist .ani_slide .control .prevslide {left: .5rem;
background-image: url(../images/main/mvic_prev2.png)}
.animatelist .ani_slide .control .nextslide {right: .5rem;
background-image: url(../images/main/mvic_next2.png)}
.animatelist .ani_slide .move {z-index: 20;
margin: 0 0 0 4rem;
width: 840px}
.animatelist .ani_slide .move ul li {overflow: hidden}
.animatelist .ani_slide .move ul li a {border: 0 !important;
background: none;
color: #000;
font-size: 20px;
text-decoration: none;
display: block;
margin: 0 auto}
.animatelist .ani_slide .move ul li a span {display: block;
padding-top: .5rem;
text-align: center}
.animatelist .ani_slide .move ul li a .btn {position: absolute;
top: 50%;
left: 50%;
width: 2.3rem;
height: 2.3rem;
border-radius: 50%;
background: rgba(255, 255, 255, .8);
color: #000;
font-size: 0;
border: 2px solid #000;
transform: translate(-50%, -50%);
transition: .5s}
.animatelist .ani_slide .move ul li a .btn:before {content: '\ea3e';
font-family: xeicon;
font-size: 1.4rem;
color: #000;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
line-height: 0}
.animatelist .ani_slide .move ul li a:hover .btn {background: #000;
color: #fff}
.animatelist .ani_slide .move ul li a:hover .btn:before {color: #fff}
.animatelist .ani_slide .swiper-slide {width: 100%}
.webtoon {position: relative;
padding: 2rem 0}
.webtoon:before {content: '';
position: absolute;
height: 13.5rem;
width: 100%;
background: #e7f0f8;
z-index: -1}
.webtoon:after {content: '';
position: absolute;
top: 0;
left: 2.5rem;
background: url(../images/sub/bg_webtoon.png) no-repeat top left;
width: 527px;
height: 266px;
z-index: -1}
.webtoon .list {margin: 10rem 0 0 0;
overflow: hidden}
.webtoon .list li {float: left;
width: 30%;
margin: 0 1.66%;
position: relative;
padding-bottom: 1.5rem}
.webtoon .list .imgbox {background: #fff;
border: 1px solid #dcdedf;
padding: 1rem 1rem;
text-align: center;
transition: .5s}
.webtoon .list .imgbox:hover {box-shadow: 0 0 10px rgba(0, 0, 0, .15)}
.webtoon .list .imgbox .desc {width: 100%;
position: absolute;
top: 1rem;
left: 50%;
transform: translateX(-50%)}
.webtoon .list .imgbox .desc dt {background: #093559;
width: 2.5rem;
height: 2.5rem;
color: #fff;
font-size: 1.8rem;
border-radius: 50%;
line-height: 2.5rem;
margin: -.7rem auto .7rem auto}
.webtoon .list .imgbox .desc dd {font-size: 1.9rem;
color: #fff;
position: relative}
.webtoon .list .imgbox .desc dd:after {content: '\e93e';
font-family: 'xeicon';
font-size: 1.6rem;
position: absolute}
.opensource {position: relative;
font-size: 1.4rem;
color: #424242;
margin: 1rem 0;
padding-left: 4.1rem}
.opensource:before {content: '';
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0}
.opensource.type01:before {background: url(../images/sub/img_opentype01.png) no-repeat}
.opensource.type02:before {background: url(../images/sub/img_opentype02.png) no-repeat}
.opensource.type03:before {background: url(../images/sub/img_opentype03.png) no-repeat}
.opensource.type04:before {background: url(../images/sub/img_opentype04.png) no-repeat}
.placewrap {margin: 1rem 0 3rem 0;
overflow: hidden}
.placewrap div {float: left}
.placewrap .mapimg {width: 76%;
position: relative}
.placewrap .placelist {width: 21%;
padding-left: 3%}
.placewrap .placelist ul {border-top: 2px solid #2b2b2b;
border-bottom: 2px solid #2b2b2b;
padding: 1rem 0;
width: 100%;
overflow: hidden;
margin-bottom: 1rem}
.placewrap .placelist ul li {float: left;
width: 49%;
margin-left: 2%;
padding: 0}
.placewrap .placelist ul li:first-child {margin-left: 0}
.placewrap .placelist ul li ol li {font-size: 1.4rem;
width: 100%;
padding: .3rem 0;
border-bottom: 1px solid #ececec}
.placewrap .title_icon {font-size: 1.4rem;
position: relative;
padding-left: 30px}
.placewrap .title_icon:before {content: '';
position: absolute;
top: 0;
left: 0;
background: url(../images/sub/icon_mouse.png) no-repeat;
width: 23px;
height: 38px}
.placewrap .mapimg .placeimg1 {position: relative;
background: url(../images/sub/img_place1.png) no-repeat;width: 90.3rem;height: 71.7rem;}
.placewrap .mapimg .placeimg1 li a {position: absolute;
display: block;
width: 25px;
height: 25px;
transition: .3s;
border-radius: 50%;
text-align: center;
color: transparent}
.placewrap .mapimg .placeimg1 li a:hover {background: #2ca203;
color: #fff;
font-size: 1.5rem}
.placewrap .mapimg .placeimg1 li.place01 a {top: 484px;
left: 580px}
.placewrap .mapimg .placeimg1 li.place02 a {top: 407px;
left: 334px}
.placewrap .mapimg .placeimg1 li.place03 a {top: 39px;
left: 260px}
.placewrap .mapimg .placeimg1 li.place04 a {top: 65px;
left: 299px}
.placewrap .mapimg .placeimg1 li.place05 a {top: 307px;
left: 232px}
.placewrap .mapimg .placeimg1 li.place06 a {top: 443px;
left: 148px}
.placewrap .mapimg .placeimg1 li.place07 a {top: 398px;
left: 173px}
.placewrap .mapimg .placeimg1 li.place08 a {top: 290px;
left: 400px}
.placewrap .mapimg .placeimg1 li.place09 a {top: 560px;
left: 160px}
.placewrap .mapimg .placeimg1 li.place10 a {top: 365px;
left: 468px}
.placewrap .mapimg .placeimg1 li.place11 a {top: 434px;
left: 535px}
.placewrap .mapimg .placeimg1 li.place12 a {top: 657px;
left: 570px}
.placewrap .mapimg .placeimg1 li.place13 a {top: 445px;
left: 465px}
.placewrap .mapimg .placeimg1 li.place14 a {top: 408px;
left: 398px}
.placewrap .mapimg .placeimg1 li.place15 a {top: 531px;
left: 707px}
.placewrap .mapimg .placeimg1 li.place16 a {top: 579px;
left: 492px}
.placewrap .mapimg .placeimg1 li.place17 a {top: 630px;
left: 503px}
.placewrap .mapimg .placeimg1 li.place18 a {top: 600px;
left: 625px}
.placewrap .mapimg .placeimg1 li.place19 a {top: 565px;
left: 704px}
.placewrap .mapimg .placeimg1 li.place20 a {top: 525px;
left: 575px}
.placewrap .mapimg .placeimg1 li.place21 a {top: 473px;
left: 658px}
.placewrap .mapimg .placeimg1 li.place22 a {top: 285px;
left: 346px}
.placewrap .mapimg .placeimg1 li.place23 a {top: 360px;
left: 300px}
.placewrap .mapimg .placeimg1 li.place24 a {top: 497px;
left: 240px}
.placewrap .mapimg .placeimg1 li.place25 a {top: 650px;
left: 540px}
.placewrap .mapimg .placeimg1 li.place26 a {top: 628px;
left: 598px}
.placewrap .mapimg .placeimg2 {position: relative;
background: url(../images/sub/img_place2.png) no-repeat;
width: 903px;
height: 555px}
.placewrap .mapimg .placeimg2 li a {position: absolute;
display: block;
width: 25px;
height: 25px;
transition: .3s;
border-radius: 50%;
text-align: center;
color: transparent}
.placewrap .mapimg .placeimg2 li a:hover {background: #2ca203;
color: #fff;
font-size: 1.5rem}
.placewrap .mapimg .placeimg2 li.ocean01 a {top: 497px;
left: 521px}
.placewrap .mapimg .placeimg2 li.ocean02 a {top: 483px;
left: 726px}
.placewrap .mapimg .placeimg2 li.ocean03 a {top: 189px;
left: 512px}
.placewrap .mapimg .placeimg2 li.ocean04 a {top: 143px;
left: 418px}
.placewrap .mapimg .placeimg2 li.ocean05 a {top: 59px;
left: 465px}
.placewrap .mapimg .placeimg2 li.ocean06 a {top: 8px;
left: 498px}
.placewrap .mapimg .placeimg2 li.ocean07 a {top: 10px;
left: 456px}
.placewrap .mapimg .placeimg2 li.ocean08 a {top: 117px;
left: 318px}
.placewrap .mapimg .placeimg2 li.ocean09 a {top: 245px;
left: 169px}
.placewrap .mapimg .placeimg2 li.ocean10 a {top: 304px;
left: 187px}
.placewrap .mapimg .placeimg2 li.ocean11 a {top: 234px;
left: 24px}
.map_mobile {display: none}
.facilitywrap {margin: 1rem 0 3rem 0;
overflow: hidden}
.facilitywrap div {float: left}
.facilitywrap .imgbox {width: 60%;
position: relative}
.facilitywrap .imgbox>img {max-width: 100%}
.facilitywrap .list {width: 40%;
padding-left: 3%}
.facilitywrap .list .items {position: relative;
width: 100%}
.facilitywrap .list .items:before {position: absolute;
content: '';
background: #000;
width: 5rem;
height: 5rem;
border-radius: 50%}
.facilitywrap .list .items span {display: inline-block;
color: #fff;
text-align: center;
line-height: 5rem;
width: 5rem;
height:5dvb;
position: absolute}
.facilitywrap .list .items table {width: 100%;
border-top: 2px solid #2b2b2b;
border-bottom: 2px solid #2b2b2b;
margin: 1.4rem 0 0 1.4rem}
.facilitywrap .list .items table th,
.facilitywrap .list .items table td {background: #f4f9fc;
border-bottom: 1px solid #ececec;
padding: 1rem 1rem; 
font-weight: 400}
.facilitywrap .list .items table td {background: #Fff}
.history {margin-top: 1.5rem;position: relative;overflow: hidden}
.history .imgstone {position: absolute;
top: 9rem;
left: 45%}
.history .imgstone>div {padding: .7rem;
box-shadow: 0 0 10px rgba(0, 0, 0, .2)}
.history .imgstone>div span {font-size: 1.4rem;
display: block;
text-align: center}
.history .eastisland {float: left;
position: relative;
width: 50%;
height: 873px}
.history .eastisland:before {content: '';
position: absolute;
top: 0;
left: 0;
background: url(../images/sub/bg_facility.png) no-repeat center center;
width: 100%;
height: 100%}
.history .eastisland p {position: relative;
left: 50%;
transform: translateX(-50%);
text-align: center;
width:14.6rem;
height: 14.6rem;
color: #fff;
font-size: 2.1rem;
line-height: 16rem;}
.history .eastisland ul {margin-top: 1.5rem}
.history .eastisland li {width: 50%;
margin-right: 50%;
text-align: right}
.history .eastisland li:nth-child(even) {width: 50%;
margin-right: 0;
margin-left: 50%;
margin-top:0rem;
text-align: left}
.history .eastisland li strong {display: block;
line-height: 3.5rem;
font-size: 2.6rem;
font-weight: 500;
margin-right: 10rem;
color: #000}
.history .eastisland li span {display: block;
margin-right: 10rem}
.history .eastisland li:nth-child(even) strong {margin-left: 9rem;
margin-right: 0}
.history .eastisland li:nth-child(even) span {margin-left: 9rem;
margin-right: 0}
.history .eastisland li:nth-child(1) {margin-top: 1rem}
.history .eastisland li:nth-child(3) {margin-top: -2rem;margin-left: -5rem;}
.history .eastisland li:nth-child(4) {margin-top: -2.5rem;margin-left: 60%; }
.history .eastisland li:nth-child(5) {margin-top: -1rem}
.history .eastisland li:nth-child(7) {margin-left: -5rem;}
.history .eastisland li:nth-child(8) {margin-top: -1.2rem;margin-left:  60%;}
.history .eastisland li:nth-child(3) strong,
.history .eastisland li:nth-child(7) strong,
.history .eastisland li:nth-child(3) span,
.history .eastisland li:nth-child(7) span {margin-right: 3.5rem}
.history .eastisland li:nth-child(9) {margin-top: -.5rem}
.history .eastisland li:nth-child(4) strong,
.history .eastisland li:nth-child(4) span,
.history .eastisland li:nth-child(8) strong,
.history .eastisland li:nth-child(8) span {margin-left: 5rem}
.history .eastisland li:nth-child(6) {margin-top: -2.2rem}
.history .westisland {float: right;
position: relative;
width: 50%;
height: 873px}
.history .westisland:before {content: '';
position: absolute;
top: 0;
right: 0;
background: url(../images/sub/bg_facility2.png) no-repeat center;
width: 100%;
height: 100%}
.history .westisland p {position: relative;
left: 46%;
transform: translateX(-45%);
text-align: center;
width: 14.6rem;
height: 14.6rem;
color: #fff;
font-size: 2.1rem;
line-height: 16rem;}
.history .westisland ul {margin-top: 37rem}
.history .westisland li {width: 50%;
margin-left: 60%;
text-align: left}
.history .westisland li strong {display: block;
line-height: 3.5rem;
font-size: 2.6rem;
font-weight: 500;
margin-left: 4.5rem}
.history .westisland li span {display: block;
margin-left: 4.5rem}
.history .westisland li:nth-child(2) {width: 50%;
margin-left: -5rem;
margin-right: 0;
margin-top: 14rem;
text-align: right}
.history .westisland li:nth-child(2) strong {margin-left: 0;
margin-right: 4rem}
.history .westisland li:nth-child(2) span {margin-left: 0;
margin-right: 3.5rem;
letter-spacing: -1px}
.history .eastisland li strong.color,
.history .westisland li strong.color {color: #008c85}
.managewrap {padding: 2rem 0;
position: relative;
margin-bottom: 3.6rem}
.managewrap:before {content: '';
position: absolute;
width: 120rem;
height: 193px;
background-image: url(../images/sub/s010305.png);
background-size: 100%;
background-position: top left;
background-repeat: no-repeat;
z-index: 0}
.managewrap ul {overflow: hidden;
min-height: 200px;
margin-left: 7rem;position:relative;z-index:1;margin-top: 1rem;}
.managewrap li {float: left;color: #fff; width: 10rem;}
.managewrap li:nth-child(even) {margin-top: 4rem} 
.managewrap li:nth-child(2) {margin-top: 7rem;margin-left: 1.8rem;}
.managewrap li:nth-child(3) {margin-left: 2rem;margin-top: 1rem;}
.managewrap li:nth-child(4) {margin-left: 1.8rem;margin-top: 8rem;}
.managewrap li:nth-child(5) {margin-left: 1.8rem;margin-top: 1rem;}
.managewrap li:nth-child(6) {margin-left: 1.8rem;margin-top: 8rem;}
.managewrap li:nth-child(7) {margin-left: 1.8rem;margin-top: 1rem;}
.managewrap li:nth-child(8) {margin-left: 1.8rem;margin-top: 9rem;}
.managewrap li dl {text-align: center;
padding-top: .7rem}
.managewrap li dt {color: #a9ccdf;
font-size: 1.4rem}
.managewrap li dd {font-size: 1.3rem;letter-spacing: -1px;}
.managewrap li dd span {display: block;
font-size: 1.8rem}
.adminwrap {height: 35rem;
position: relative}
.adminwrap:before {content: '';
position: absolute;
width: 120rem;
height: 596px;
background-image: url(../images/sub/s01030502.png);
background-size: 100%;
background-position: top left;
background-repeat: no-repeat;
z-index: 0}
.adminwrap .items {position: relative}
.adminwrap .items dl dt {margin-top: 2rem;
color: #000;
font-weight: 500;
font-size: 1.7rem}
.adminwrap .items dl dt.list2 {margin-top: 2rem}
.adminwrap .items dl dd {color: #424242;
font-size: 1.6rem}
.adminwrap .items>div {position: absolute}
.adminwrap .items>div:nth-child(1) {left: 42%;
top: 0}
.adminwrap .items>div:nth-child(2) {left: 67%;
top: 16rem}
.adminwrap .items>div:nth-child(3) {left: 42%;
top: 33rem}
.adminwrap .items>div:nth-child(3) dl {width: 20rem}
.adminwrap .items>div:nth-child(4) {left: 62%;
top:33rem}
.adminwrap .items>div:nth-child(5) {left: 57%;
top: 50rem}
.adminwrap .items h5 {display: none}
.enterwrap {position: relative;
margin: 3rem 0}
.enterwrap .title {position: absolute;
top: 2rem;
left: 0;
box-shadow: 0 0 10px rgba(0, 0, 0, .15);
padding: 2rem 4rem;
display: inline-block;
background: #fff;
font-size: 1.4rem;margin-left: 1rem;z-index: 2;}
.enterwrap .title strong {font-size: 1.8rem;
color: #000;
font-weight: 400;}
.enterwrap .applystep {width: 100%;
padding: 7rem 0 3rem}
.enterwrap .applystep:before {content: '';
border: 1px solid #cacaca;
width: calc(100% - 3.5rem);
height: 100%;
position: absolute;
top: 0;
left: 3.5rem;z-index: 1;
 }
.enterwrap .applystep .items {margin-left: 18rem;
overflow: hidden}
.enterwrap .applystep .items li {float: left;
width: 33%;
text-align: center;
position: relative}
.enterwrap .applystep .items li:after {content: '';
background: url(../images/sub/bull_arrow.png) no-repeat;
position: absolute;
top: 30%;
left: 90%;
width: 50px;
height: 50px;
transform: rotate(-90deg)}
.enterwrap .applystep .items li:last-child:after {display: none}
.enterwrap .applystep.list2 {padding-top:12rem}
.enterwrap .applystep .items li span {margin: 0 auto;
display: block;
background: #1e8f9c;
width: 15rem;
height: 15rem;
border-radius: 50%;
background-repeat: no-repeat;
background-position: center center}
.enterwrap .applystep .items li span.icon01 {background-image: url(../images/sub/icon_visit01.png)}
.enterwrap .applystep .items li span.icon02 {background-image: url(../images/sub/icon_visit02.png);
background-color: #177798}
.enterwrap .applystep .items li span.icon03 {background-image: url(../images/sub/icon_visit03.png);
background-color: #084990}
.enterwrap .applystep .items li span.icon04 {background-image: url(../images/sub/icon_visit04.png)}
.enterwrap .applystep .items li span.icon05 {background-image: url(../images/sub/icon_visit05.png);
background-color: #177798}
.enterwrap .applystep .items li p strong {display: block;
font-size: 1.9rem;
margin-top: .5rem;
font-weight: 500;
color: #1e8f9c}
.enterwrap .applystep .items li:nth-child(2) p strong {color: #177798}
.enterwrap .applystep .items li:nth-child(3) p strong {color: #084990}
.enterwrap .applystep .desc {width: calc(100% - 5.5rem);
margin-left: 4.5rem;
margin-top: 1.5rem;
background: #f8f9fb;
padding: 1.5rem 2rem}
.enterwrap .applystep .desc li {font-size: 1.6rem}
.enterwrap .applystep .desc strong {font-size: 1.7rem;
color: #000}
.reference {position: relative;
margin: 4rem 0}
.reference .tit {position: relative;
font-size: 1.8rem;
color: #000;
padding-left: 9rem;
padding-top: .5rem}
.reference .tit:before {content: '';
background: url(../images/sub/bull_doc.png) no-repeat;
width: 178px;
height: 68px;
position: absolute;
top: 0;
left: 0}
.reference .info {position: relative;
width: 100%;
margin-top: 4rem;
padding: 2rem 2rem 2rem 12rem}
.reference .info:before {content: '';
border: 3px solid #e5e5e5;
width: calc(100% - 9rem);
height: 100%;
position: absolute;
top: 0;
left: 9rem;
z-index: 0}
.reference .info li {padding-left: 1.4rem;
position: relative;
font-size: 1.6rem}
.reference .info li:before {content: '';
width: 4px;
height: 1px;
background: #000;
position: absolute;
top: 12px;
left: 0}
.reference .info li span {color: #3b64cc}
.reference .info .desc {width: 100%;
margin-left: 0;
margin-top: 1.5rem;
background: #f8f9fb;
padding: .75rem 1.5rem}
.reference .info .desc dt {position: relative;
font-size: 1.6rem;
color: #000;
margin-bottom: 1rem;
border-bottom: 1px solid #d8d8d8;
padding-bottom: .5rem;
padding-left: .5rem;
font-weight: 500}
.reference .info .desc dt:before {content: '';
width: 4px;
height: 4px;
background: #000;
border-radius: 50%;
position: absolute;
top: 10px;
left: 0}
.reference .info .desc dd {font-size: 1.5rem}
.popup_artist {width:1060px;height: 780px;position: relative;}
.popup_artist .popup_title {font-size: 40px;color: #000;padding: 20px 0 0 45px; box-sizing: border-box;}
.photographer {position: relative;margin: 0;width: 100%; height: 780px}
.photographer:before {content: '';position: absolute;width: 100%;height: 100vh;background : url(../images/sub/bg_photographern.jpg)   no-repeat top center #b88d63; }
.photographer .title {position: absolute;top: 27%;left: 50px;width: 210px; word-break: keep-all;color: #5d5d5d}
.photographer .title strong {color: #000;font-size: 3rem;display: block;margin-bottom: 1.75rem}
.photographer .writerlist {position: absolute;right: 0;top: 9rem;width: 72%}
.photographer .writerlist .items {float: left;margin: 1rem 2rem;position: relative}
.photographer .writerlist .items a .imgbox {width: 25.4rem;height: 18.9rem;border: 6px solid #6d6882;
box-shadow: 15px 8px 10px rgba(0, 0, 0, .11);transition: .4s;padding: 1rem}
.photographer .writerlist .items a .imgbox.col {width: 18rem;height: 25.4rem}
.photographer .writerlist .items a .imgbox .thum {width: 100%;height: 100%;overflow: hidden;transition: .4s}
.photographer .writerlist .items a .imgbox .thum>img {width: 100%;height: 100%;opacity: .8}
.photographer .writerlist .items a .imgbox .desc {position: absolute;bottom: 3rem;left: 0;width: 150px;
height: 36px;background: linear-gradient(to right, rgba(51, 34, 141, .8), rgba(77, 173, 30, .8));
transition: .4s}
.photographer .writerlist .items a .imgbox .desc p {color: #fff;font-size: 1.4rem;padding-left: 1rem;
opacity: 1;top: 50%;transform: translateY(-50%);position: relative;transition: .4s}
.photographer .writerlist .items a .imgbox .desc p:after {content: '\ea6e';position: absolute;right: 0;top: 50%;font-family: 'remixicon';font-size: 1.6rem;transform: translateY(-50%)}
.photographer .writerlist .items a .imgbox .desc p span {font-size: 1.7rem}
.photographer .writerlist .items a:hover .imgbox {border: 3px solid #000;box-shadow: 0 0 20px rgba(24, 8, 58, .5);padding: .5rem}
.photographer .writerlist .items a:hover .imgbox .thum>img {opacity: 1}
.photographer .writerlist .items a:hover .imgbox .desc {width: 100%;background: linear-gradient(to right, rgba(29, 10, 91, .8), rgba(29, 10, 92, .8))}
.photographer .writerlist .items a:hover .imgbox .desc p {text-align: center}
.photographer .writerlist .items a:hover .imgbox .desc p:after {right: 10%}
.photographer .writerlist .items:nth-child(odd) {padding-top: 1.6rem}
.photographer .writerlist .items:nth-child(4) {margin-left: 5rem}
.popup_artist2 {width:1060px;height: 780px; }
.popup_artist2:before {content: '';position: absolute;width: 100%;height: 100vh;background: url(../images/sub/bg_photographer2n.jpg) no-repeat top center #c89e70;}
.slide_photo {width:1060px;height: 660px; }
/* .slide_photo:before {content: '';position: absolute;width: 100%;height: 100vh;background: url(../images/sub/bg_photographer2n.jpg) no-repeat top center #c89e70;} */
.slide_photo .titlebox {float: left;width: 340px;padding: 6.5rem 1rem 0 5rem;position: relative;height: 660px; box-sizing: border-box; }
.slide_photo .titlebox .boxarea {height: 460px; }
.slide_photo .titlebox .boxarea > p {color: #615064;border-bottom: 1px solid #beb8bf;font-size: 17px;padding: 20px 0;word-break: keep-all}
.slide_photo .titlebox .boxarea > p strong {font-size: 25px} 
.slide_photo .titlebox .boxarea dt {margin: 25px 0;color: #000;font-size:18px;line-height: 25px;word-break: keep-all}
.slide_photo .titlebox .boxarea dd  {color: #767676;font-size:16px;line-height:25px}
.slide_photo .titlebox .slidebtn {height: 35px;width: 100%;  }
.slide_photo .titlebox .slidebtn>button {background: #a6927b;color: #fff;height: 34px;line-height: 34px;padding: 0 10px;border-radius: 8px;font-size: 16px;transition: .3s}
.slide_photo .titlebox .slidebtn>button:hover,
.slide_photo .titlebox .slidebtn>button.on {background: #503e2a}
.slide_photo .imgbox {float: right;width: calc(100% - 440px);padding-top: 14rem}
.slider_author {position: relative;width: 54rem;/*left: 30%;transform: translateX(-30%)*/}
.slider_author .swiper-slide:before {position: absolute;left: 0;top: 0;width: 100%;height: 100%;content: '';background-size: 100% auto;background-position: center top;background-repeat: no-repeat;}
.slider_author .swiper-slide.bg1:before {background-image: url(../images/sub/photographer5.jpg);box-shadow: 0 0 20px rgba(0, 0, 0, .15)}
.slider_author .swiper-slide.bg2:before {background-image: url(../images/sub/photographer6.jpg)}
.slider_author .swiper-container .swiper-slide .imgthum {height: 100%}
.slider_author .swiper-container .swiper-slide .imgthum>img {box-shadow: 0 0 20px rgba(0, 0, 0, .15);border: 20px solid #fff}
.slider_author .swiper-container {width: 100%;height: auto}
.slider_author .swiper-container .swiper-slide {height: 400px;line-height: 400px}
.slider_author .swiper-container .swiper-slide.imgheight {height: 380px;line-height: 380px}
.slider_author .ctrlwrap {position: relative;z-index: 2;text-align: center;padding-top:4rem}
.slider_author .ctrlwrap .swiper-pagination {position: absolute;top: 4.95rem;left: 50%;margin-left:10em;color: #000;font-size: 1.5rem;line-height: 5rem;width: 8rem;height: 5rem}
.slider_author .ctrlwrap .swiper-pagination-current {color: #000;font-size: 2.2rem}
.slider_author .ctrlwrap button {width: 5.5rem;height: 5.5rem;text-indent: -9999px;overflow: hidden;background-repeat: no-repeat;
background-position: center center;transition: .2s;border-radius: 50%;background-color: #f7f7f7;border: 1px solid #d8d8d8}
.slider_author .ctrlwrap button:hover {background-color: rgba(255, 255, 255, 1);border: 1px solid #fff;box-shadow: 0 0 5px rgba(0, 0, 0, .11)}
.slider_author .ctrlwrap .stopslide, .ctrlwrap .playslide {display: none}
.slider_author .ctrlwrap .stopslide {background-image: url(../images/main/mvic_stop2.png)}
.slider_author .ctrlwrap .playslide {background-image: url(../images/main/mvic_play2.png)}
.slider_author .ctrlwrap .stopslide.on,
.ctrlwrap .playslide.on {display: inline-block}
.slider_author .ctrlwrap .prevslide {background-image: url(../images/main/mvic_prev2.png)}
.slider_author .ctrlwrap .nextslide {background-image: url(../images/main/mvic_next2.png)}
.slide_photobtm {position: absolute;height: 50px;bottom: 10px;left: 50%;transform: translateX(-50%);width: 100%; }
/* .slide_photobtm:before {content: '';position: absolute;width: 100%; height: 100%;background-image: url(../images/sub/bg_photographer3n.jpg);
background-size: 100%;background-repeat: no-repeat;} */
.slide_photobtm p {padding-top: 1rem;font-size: 1.4rem;color: #fff;position: relative;text-align: center}
.ecoebook {margin: 2.5rem 0;position: relative}
.ecoebook:before {content: '';position: absolute;top: 0;left: 4.5rem;
background: url(../images/sub/bg_ebook.png);width: 51.6rem;height: 24.15rem;}
.ecoebook .title {position: absolute;left: 0;top: 0;width: 11rem;word-break: keep-all;
padding-left: 2.5rem}
.ecoebook .title:before {content: '';position: absolute;top: .5rem;left: 0;background: url(../images/sub/icon_click.png);
width: 31px;height: 32px;}
.ecoebook .items {position: relative;height: 13rem;width: calc(100% - 14.75rem);margin-left: 14.75rem;margin-top: 5rem}
.ecoebook .items:before {content: '';position: absolute;top: 100%;left: 0;background: url(../images/sub/bg_ebook2.png) left top;
width: 45.95rem;height: 5.2rem;}
.ecoebook .items.list2 {margin-left: 0}
.ecoebook .items ul {margin-left: 2.5rem;margin-top: 1rem}
.ecoebook .items li {float: left;width: 30.33333%;margin: 0 1.5%}
.ecoebook .items li .imgbox {display: block;width: 255px;height: 252px;position: relative}
.ecoebook .items li .imgbox:before {content: '';position: absolute;top: -1px;background: url(../images/sub/bg_ebookbox.png) center top no-repeat;width: 100%;height: 100%;z-index: -1}
.ecoebook .items li .imgbox .thum {position: relative;margin-left: .7rem;overflow: hidden}
.ecoebook .items li .imgbox .thum span {position: absolute;
bottom: 0;
left: 0;
width: 100%;
color: #fff;
text-align: center;
display: block;
height: 2rem;
background: #1a3e69;
line-height: 2rem;
transition: .3s}
.ecoebook .items li .imgbox a:hover .thum span {height: 100%;
background: rgba(33, 79, 134, .85);
font-size: 1rem;
line-height: 10rem;
letter-spacing: -1px}
.experhis {overflow: hidden}
.experhis .history {padding: 1rem 0;
float: left;
width: 50%}
.experhis .history:after {content: '';
position: absolute;
top: 0;
left: 165px;
width: 1px;
height: 100%;
background: #000;}
.experhis .history h4 {position: relative;
width: 165px;
margin-right: 165px;
font-size: 2.2rem;
color: #000}
.experhis .history h4:before {content: '';
position: absolute;
top: 50%;
right: 0;
width: 65px;
height: 1px;
background: #000}
.experhis .history h4:after {content: '';
position: absolute;
top: 50%;
right: -8px;
width: 16px;
height: 16px;
background: #000;
border-radius: 50%;
transform: translateY(-50%)}
.experhis .history ul {margin-left: 165px;
padding: 1.5rem 0}
.experhis .history ul li p {display: inline-block;
position: relative;
width: 66px;
height: 66px;
word-break: keep-all;
text-align: center;
left: -33px;
top: 50%;
z-index: 1;}
.experhis .history ul li p:before {content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #34cfac;
border-radius: 50%;}
.experhis .history ul li p.color2:before {background: #00a79f}
.experhis .history ul li p.color3:before {background: #1e8f9c}
.experhis .history ul li p.color4:before {background: #177798}
.experhis .history ul li p.color5:before {background: #084990}
.experhis .history ul li p span {font-size: 1.5rem;
line-height: 2rem;
color: #fff;
display: inline-block;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 2;}
.experhis .history ul li ol {padding-left: 46px;
margin: -66px 0 25px 0}
.experhis .history ul li ol li {font-size: 1.5rem;
position: relative;
padding-left: 8px}
.experhis .history ul li ol li:before {content: '';
position: absolute;
top: 10px;
left: 0;
width: 4px;
height: 1px;
background: #5b5b5b}
.museumbox {margin: 2rem 0;
position: relative;
min-height: 33.5rem;
height: 100%}
.museumbox .thum:after {content: '';
background: #f6f6f6;
position: absolute;
left: 45%;
top: 40%;
width: 15rem;
height: 10rem;
z-index: -1}
.museumbox .thum>img {max-width: 100%}
.museumbox .info {position: absolute;
left: 33%;
top: 50%;
width: 65%;
height: auto;
box-shadow: 0 1px 16px rgba(0, 0, 0, .2);
background: #fff;
padding-left: 2rem;
padding-bottom: 1.5rem}
.museumbox .info ul {margin-top: 1rem}
.museumbox .info li {float: left;
width: 50%;
padding: 1rem 0}
.museumbox .info li.width100 {float: left;
width: 100%;
padding: 1rem 0}
.museumbox .info li dl {padding-left: 55px;
position: relative}
.museumbox .info li dl:before {content: '';
position: absolute;
width: 45px;
height: 45px;
top: 0;
left: 0}
.museumbox .info li dl.icon01:before {background: url(../images/sub/icon_address.png) no-repeat}
.museumbox .info li dl.icon02:before {background: url(../images/sub/icon_phone.png) no-repeat}
.museumbox .info li dl.icon03:before {background: url(../images/sub/icon_homepage.png) no-repeat}
.museumbox .info li dl.icon04:before {background: url(../images/sub/icon_center.png) no-repeat}
.museumbox .info li dl.icon05:before {background: url(../images/sub/icon_time.png) no-repeat}
.museumbox .info li dt {font-size: 1.8rem;
color: #000}
.museumbox .info li dd {font-size: 1.6rem}
.museumbox .info .goto {background: #a9a1b3;
color: #fff;
font-size: 1.5rem;
padding: .6rem 2rem .6rem .9rem;
border-radius: 8px;
margin-top: 1rem;
display: inline-block;
transition: .5s;
position: relative}
.museumbox .info .goto:before {content: '\e940';
position: absolute;
top: 50%;
right: 4px;
font-family: 'xeicon';
font-size: 1.6rem;
transform: translateY(-50%)}
.museumbox .info .goto:hover {background: #6f5b87}
.contact {margin-top: 1rem;
background: #f9f9f9;
border: 1px solid #d5d5d5;
padding: 1rem 2rem;
position: relative;}
.contact li {margin: .5rem 0}
.contact li dl {padding-left: 65px;
position: relative}
.contact li dl:before {content: '';
position: absolute;
width: 45px;
height: 45px;
top: 0;
left: 0}
.contact li dl.address:before {background: url(../images/sub/icon_address.png) no-repeat left center}
.contact li dl.phone:before {background: url(../images/sub/icon_phone.png) no-repeat left center}
.contact li dl.fax:before {background: url(../images/sub/icon_fax.png) no-repeat left center}
.contact li dt {font-size: 1.6rem;
color: #010101}
.contact li dd {font-size: 1.5rem;
color: #565656}
.contact .btn {position: absolute;
top: 2rem;
right: 2rem}
.contact .btn a {display: block;
margin-bottom: .3rem}
.transport {padding-left: 17rem;
position: relative}
.transport:before {content: '';
position: absolute;
top: 0;
left: 0;
width: 12.8rem;
height: 12.8rem;
background: #025885;
border-radius: 50%}
.transport:after {content: '';
background: url(../images/sub/icon_car.png) no-repeat center center;
width: 12.8rem;
height: 12.8rem;
position: absolute;
top: 0;
left: 0}
.transport.ktx:after {background: url(../images/sub/icon_ktx.png) no-repeat center center}
.transport.bus:after {background: url(../images/sub/icon_bus.png) no-repeat center center}
.carlist {position: relative;
min-height: 7rem;
height: 100%;
margin-bottom: 1rem}
.carlist .highway {position: absolute;
left: 0;
top: .75rem;
font-size: 1.8rem;
color: #000;
width: 25rem;
height: 5rem;
background: #fff;
box-shadow: 0 0 10px rgba(0, 0, 0, .11);
text-align: center;
line-height: 5rem;
z-index: 2;}
.carlist .desc {position: absolute;
left: 18rem;
top: 0;
border: 1px solid #e6e6e6;
background: #fff;
padding: 1.5rem 2rem 1.5rem 10rem;
z-index: 1;
height: 100%;
width: calc(100% - 18rem);}
.transport .train {border: 1px solid #e6e6e6;
background: #fff;
padding: 2rem 3rem}
.filewrap {border: 3px solid #ececec;
padding: 1rem 2rem 1rem 8.5rem;
overflow: hidden;
position: relative}
.filewrap:before {content: '';
position: absolute;
top: 50%;
left: 2rem;
background: #f7f7f7;
width: 5.15rem;
height: 5.15rem;
border-radius: 50%;
transform: translateY(-50%)}
.filewrap:after {content: '';
background: url(../images/sub/icon_file.png) no-repeat;
width: 54px;
height: 46px;
position: absolute;
left: 3rem;
top: 50%;
transform: translateY(-50%)}
.filewrap p {color: #000000;
font-size: 1.15rem;
margin-bottom: 1rem}
.filewrap li {float: left;
width: 33.33333%}
.filewrap li a:before {font-family: 'xeicon';
content: '\eb7c';
color: #000;
padding-right: .5rem}
.tooltipLink {color: #015A98;
font-size: 11px}
.italic {font-style: italic}
.listfaq {margin: 1rem 0 2.5rem 0;
border: 1px solid #cacaca;
padding: 1.5rem 2.5rem;
position: relative;
overflow: hidden;
min-height: 200px}
.listfaq:before {content: '';
position: absolute;
top: 2.5rem;
width: 88px;
height: 108px;
background: url(../images/sub/icon_law01.png) no-repeat left top}
.listfaq.icon02:before {content: '';
position: absolute;
top: 2.5rem;
width: 88px;
height: 108px;
background: url(../images/sub/icon_law02.png) no-repeat left top}
.listfaq ul {margin-left: 10rem}
.listfaq ul li .question {display: block;
position: relative}
.listfaq ul li .answer {border-top: 1px solid #dfdfdf;
border-bottom: none;
position: relative}
.listfaq ul li {border-bottom: 1px solid #dfdfdf;
transition: .3s}
.listfaq ul li:hover {background: #fafafa}
.listfaq ul li .question a {color: #424242;
font-size: 1.6rem;
display: block;
padding: .8rem}
.listfaq ul li .question a strong {color: #000}
.listfaq ul li .question:after {content: '\e943';
font-family: 'xeicon';
font-size: 1.1rem;
color: #999;
position: absolute;
right: 1rem;
top: .7rem}
.listfaq ul li .answer {display: block;
opacity: 0;
visibility: hidden;
max-height: 0;
overflow: hidden;
background: #f4f5f6}
.listfaq ul li .answer .answer_box {padding: .8rem}
.listfaq ul li.active .question .category {background-color: #126fb4}
.listfaq ul li.active .question:after {transform: rotate(180deg);
transition: .25s;
color: #333}
.listfaq ul li.active .answer {opacity: 1;
visibility: visible;
transition: .5s;
max-height: 2000px}
.listfaq .link li {border-bottom: 1px solid #dfdfdf;
padding: .5rem 0}
.listfaq .link li a {display: block;
color: #424242;
font-size: 1.6rem;
font-weight: 300;
transition: .5s}
.listfaq .link li a:after {content: '';
background: url(../images/sub/icon_blank.png) no-repeat;
width: 17px;
height: 18px;
position: relative;
top: 50%;
margin-left: .5rem;
display: inline-block}
.listfaq .link li a:hover {color: #000}
.modalwrap {visibility: hidden;
overflow: hidden;
width: 0;
height: 0;
opacity: 0;
position: fixed;
left: 0;
top: 0;
z-index: 9999;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0)}
.modalwrap .modalpopup {position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 39rem;
max-width: calc(100% - 2rem);
margin-left: auto !important;
margin-right: auto !important;
overflow: hidden;
overflow-y: auto;
background-color: #fff;
border: 2px solid #000}
.modalwrap .modalpopup.arch_width {width: 32rem}
.modalwrap .modalpopup .container {padding: 2rem;
position: relative}
.modalwrap .modalpopup .container.archive {padding: 1rem}
.modalwrap .modalpopup .container .heading {border-bottom: 1px solid #1a1a1a;
padding-bottom: 1rem;
text-align: center;
margin-bottom: 1rem}
.modalwrap .modalpopup .container .heading h1 {font-size: 2.6rem;color: #000;margin-bottom: 1rem}
.modalwrap .modalpopup .container .heading p {font-size: 1.7rem;color: #0c0c0c}
.modalwrap .modalpopup .container .moviebox {position: relative;padding: 56.25% 0 0 0;overflow: hidden}
.modalwrap .modalpopup .container .animbox {position: relative;padding: 74.8% 0 0 0;overflow: hidden}
.modalwrap .modalpopup .container .moviebox .viedoplay,
.modalwrap .modalpopup .container .animbox .viedoplay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;border: 0}
.modalwrap .modalpopup .container .scroll {margin: 0;height: 500px;overflow-y: scroll}
.modalwrap .modalpopup .container .thum {width: 100%;max-width: 100%;overflow: hidden;position: relative}
.modalwrap .modalpopup .container .thum .photo {margin: auto;text-align: center}
.modalwrap .modalpopup .container .thum .photo>img {width: 100%}
.modalwrap .modalpopup .container .thum .boxicon {position: absolute;bottom: .5rem;right: 1.7rem}
.modalwrap .modalpopup .container .btn {position: absolute;top: 1rem;right: 1rem}
.modalwrap .modalpopup .container.archive .btn {position: absolute;top: .5rem;right: .5rem}
.modalwrap .modalpopup .container .scroll2 {margin: 0;height: 600px;overflow-y: auto}
.modalwrap .modalpopup .container .btn .modalclose {font-size: 2.6rem;color: #000;}
.modalwrap .modalpopup .container .btn .modalclose:hover i {transform: rotate(360deg);transition: .6s ease-out}
.modalwrap.active {visibility: visible;overflow: visible;width: auto;height: auto;opacity: 1;width: 100% !important;height: 100% !important;transition: opacity .5s}
.modalwrap .popup_place {position: absolute;top: 50%;left: 50%;max-width: 50rem;width: 90%;background: #fff;box-shadow: 0 0 10px rgba(0, 0, 0, .15);
transform: translate(-50%, -50%);overflow: hidden}
.modalwrap .popup_place .container {padding: 2rem 2rem;position: relative}
.modalwrap .popup_place .container h1 {font-size: 2.4rem;color: #000;border-bottom: 1px solid #000;padding-bottom: 1.5rem;margin-bottom: 1.5rem}
.modalwrap .popup_place .container .btn {position: absolute;top: 1.5rem;right: -1rem}
.modalwrap .popup_place .container .btn button {width: 3.2rem;height: 3.2rem;border-radius: 50%;background: #eeeeee;color: #000;font-size: 0;transition: .3s;display: inline-block}
.modalwrap .popup_place .container .btn button:hover {background: #111111;color: #fff}
.modalwrap .popup_place .container .btn button.modalclose:before {content: '\e921';font-family: 'xeicon';font-size: 1.6rem;position: relative;top: 0;left: 0} 
.modalwrap .popup_place .container dt {font-size: 1.8rem;color: #111111;position: relative;padding: .5rem 0 .5rem 1rem}
.modalwrap .popup_place .container dt:before {content: '';width: 5px;height: 5px;border-radius: 50%;background: #555555;position: absolute;top: 12px;left: 0}
.modalwrap .popup_place .container dd {font-size: 1.6rem;color: #626262}
.modalwrap .popup_place .container .thum {margin: 2rem 0 0;text-align: center}
.modalwrap .popup_place .container .thum>img {max-width: 100%}
.userguide {margin: 2rem 0;padding-left: 12rem;position: relative}
.userguide:before {content: '';background: url(../images/sub/icon_copyright2.png) no-repeat left center;width: 82px;
height: 79px;
position: absolute;
left: 0;top: 0}
.userguide>p {margin-bottom: 1rem}
.privacy:before {background: url(../images/sub/icon_copyright.png) no-repeat left center;width: 75px;height: 85px}
.relsite {overflow: hidden}
.relsite li {float: left;width: 49%;border: 1px solid #ececec;margin: 0 1% .8rem 0;padding: 2rem 2rem;height: 9rem}
.relsite li a {display: block}
.relsite li span {display: inline-block;width: 25rem;padding: 0;margin: 0}
.relsite li dl {display: inline-block;vertical-align: middle}
.satisfaction {position: relative;max-width: 120rem;margin-top: 4rem}
.satisf-inner {background-color: #f3f3f3;border-radius: 4px;padding: 1rem 2.5rem;overflow: hidden}
.satisf-inner>div {float: left;width: 50%}
.satisf-inner>div>article {position: relative}
.satisf-inner>div>article:before {content: '';width: 4.75rem;height: 4.75rem;position: absolute;background-repeat: no-repeat;background-size: 100% auto}
.satisf-inner>div>article.icon1:before {background-image: url(../images/sub/icon_satis01.png)}
.satisf-inner>div>article.icon2:before {background-image: url(../images/sub/icon_satis02.png)}
.satisf-inner>div h5, .satisf-inner ul {padding-left: 6.5rem}
.satisf-inner>div h5 {color: #000;font-size: 1rem;font-weight: 500;margin-top: 0}
.satisf-inner ul {font-size: 1.5rem;margin-top: 1rem}
.satisf-inner li {padding-bottom: .3rem}
.satisf-inner .type {position: relative;color: #555555;min-width: 4rem;display: inline-block;margin-right: .4rem}
.satisf-inner .type:before {content: '·'}
.satisf-inner .type:after {content: ':';position: absolute;right: 0;top: -1px}
.satisf-inner .data {color: #000}
.btn_satis {padding: .3rem .75rem;color: #fff;background-color: #1c1c1c;font-size: 1.4rem;position: absolute;right: 8px;top: 2.35rem;border-radius: .8rem}
.btn_satis:hover {background-color: #000;color: #fff}
.inputxt {margin-top: 1rem;padding-left: 6.5rem}
.inputxt>input[type=text] {width: calc(100% - 4rem);vertical-align: middle;height: 1.9rem;padding-left: .5rem}
.sitemap {border: 1px solid #ececec;margin-bottom: .5rem;overflow: hidden;height: 100%;min-height: 5rem;background: linear-gradient(to right, #f8f8f8 19%, #fff 19%)}
.sitemap .heading {float: left;width: 19%;height: 100%;padding: 1.5rem 2rem 0 2rem}
.sitemap .heading a {color: #0c0c0c;font-size: 1.2rem;display: block}
.sitemap .list {float: right;width: 81%;height: 100%;padding: 1.5rem 1rem}
.sitemap .list li {float: left;width: 20%;position: relative;padding-left: 10px}
.sitemap .list li:before {content: '';position: absolute;top: 10px;left: 0;width: 3px;height: 3px;background: #404040}
.sitemap .list li.desc {display: block;clear: both}
.sitemap .list li a {color: #010101;font-size: .85rem;display: block;padding-right: 2rem;padding-bottom: .5rem}
.sitemap .list li a:hover {color: #004798}
.sitemap .list li ul {margin-top: .5rem}
.sitemap .list li li {float: none;width: 100%;padding-left: 8px}
.sitemap .list li li:before {content: '';position: absolute;top: 13px;left: 0;width: 3px;height: 1px;background: #565656}
.sitemap .list li li a {color: #565656;font-size: 1.5rem;padding-bottom: 0}
.sitemap .list li li a:hover {color: #000;text-decoration: underline}
.table {margin: 15px 0 30px;overflow: hidden}
.table table {width: 100%;table-layout: fixed;border-collapse: collapse;border-spacing: 0;border: 0;border-top: 1px solid #424242}
.table table th,.table table td {font-size: 1.5rem;padding: .4rem .5rem;text-align: center;word-wrap: break-word;word-break: keep-all}
.table table thead th, .table table tbody th {padding: .6rem 0;color: #000;border-bottom: 1px solid #dfdfdf;border-right: 1px solid #dfdfdf;background: #f8fafd}
.table table thead th.line:last-child {border-right: 1px solid #dfdfdf}
.table table thead th:last-child {border-right: none}
.table table td:last-child {border-right: none}
.table table td {border-bottom: 1px solid #dfdfdf;border-right: 1px solid #dfdfdf;background: #fff;}
.table table td.left {padding-left: .5rem;text-align: left}
.table table td.left .subject a {position: relative;display: inline-block;width: 93%;height: 24px;color: #444;text-overflow: ellipsis;overflow: hidden;white-space: nowrap}
.table table td.left .subject a:hover {text-decoration: underline}
.table table td.right {padding-right: .5rem;text-align: right}
.table table td.sum {background: #ffffe7}
.table table tfoot td {background: #ffffe7}
.table.responsive table {min-width: 768px}
.lawbgbox {margin: 2rem 0;position: relative}
.lawbgbox:after {content: '';position: absolute;right: 0;bottom: 0;background: url(../images/sub/lawbgimg.png) no-repeat;width: 590px;height: 347px}
.lawbgbox p {margin-top: 1rem;width: 50%;word-break: keep-all}
.lawbgbox p.title {width: 70%}
.lawbgbox p.title strong {font-family: 'Nanum Myeongjo';font-size:2.4rem;color: #000;line-height: 3.5rem;font-weight: 500;}
.title_about {padding-top: 1rem}
.title_about .txt_01 {font-size: 2.4rem}
.title_about .txt_01 em {font-size: 3rem;color: #000;font-family: 'Nanum Myeongjo'}
.title_about .txt_02 {color: #009891}
.rsch_center {margin-top: 4rem;position: relative;height: 55rem}
.rsch_center:before {content: '';position: absolute;width: 502px;height: 505px;background-image: url(../images2025/sub/org_bg1.png);background-size: 100%;
background-position: center center;left: 50%;background-repeat: no-repeat;transform: translateX(-50%)}
.rsch_center .items {position: absolute}
.rsch_center .items:nth-child(1) {left: 11%;top: 120px;width: 30rem}
.rsch_center .items:nth-child(4) {left: 64%;top: -.5rem;width: 33rem}
.rsch_center .items:nth-child(2) {left: 20%;top: 400px;width: 30rem}
.rsch_center .items:nth-child(3) {left: 63%;top: 300px;width: 30rem}
.rsch_center .items dl dt {margin-bottom: .65rem;color: #000;font-weight: 500;font-size: 1.6rem}
.rsch_center .items dl dd {color: #424242;font-size: 1.5rem;margin-bottom: .65rem}
.about_history {position: relative;padding: 2rem 0;overflow: hidden}
/*.about_history:before {content: '';width: 1px;height: calc(100% - 8.5rem);background: #0b537b;position: absolute;left: 15.95rem;}*/
.about_history li {width: 13.5rem;
text-align: right;
min-height: 7.5rem;
float: left}
.about_history li:nth-child(even) {display: inline-block;
width: calc(100% - 14rem);
text-align: left;
margin-top: 0;
padding-left: 6rem}
.about_history li strong {display: block;
font-size: 1.6rem;
font-weight: 500;
color: #000;
margin-right: 3rem;
position: relative;
line-height: 0}
.about_history li strong span {font-size: 2rem}
.about_history li strong:before {content: '';
position: absolute;
right: -5rem;
width: 3rem;
height: 1px;
background: #0b537b}
.about_history li strong:after {content: '';
position: absolute;
top: -.5rem;
right: -6rem;
width: 1rem;
height: 1rem;
background: #0b537b;
border-radius: 50%}
.about_history li:nth-child(even) p {font-size: 1.6rem;
font-weight: 500;
color: #000;
line-height: 0;
padding-bottom: 1rem}
.about_history li:nth-child(even) .img {margin: 1rem 0 2rem  -2rem;}
.vision {margin: 2rem 0;
position: relative;
height: 50rem}
.vision:before {content: '';
position: absolute;
width: 100%;
height: 100%;
background-image: url(../images2025/sub/org_bg4.png);
background-size: 100%;
background-position: center center;
background-repeat: no-repeat;}
.vision .items {position: absolute;
width: 30rem}
.vision .items:nth-child(1) {left: 1%;
top: 0}
.vision .items:nth-child(2) {left: 29%;
top: 250px}
.vision .items:nth-child(3) {left: 55%;
top: 50px;
width: 26rem}
.vision .items:nth-child(4) {left: 79%;
top: 200px;
width: 26rem}
.vision .items dl dt {margin-bottom: .65rem;
color: #000;
font-weight: 500;
font-size: 1.9rem;
word-break: keep-all}
.vision .items dl dd {position: relative;
color: #424242;
font-size: 1.6rem;
margin-bottom: .5rem;
padding-left: 10px}
.vision .items dl dd:before {content: '';
position: absolute;
top: .5rem;
left: 0;
width: 4px;
height: 1px;
background: #5b5b5b}
.title_greet {font-size: 2.2rem;
color: #000}
.title_greet2 {font-size: 1.8rem;color: #000;}
.title_greet2 strong {font-family: 'Nanum Myeongjo'; font-size: 3rem;}
.vision .items p {display: none}
.list_rsch li {position: relative;
padding: 2px 0 2px 17px}
.list_rsch li:before {content: '';
width: 3px;
height: 3px;
background: #363636;
position: absolute;
left: 0;
top: 12px}
.list_rsch li ol li {position: relative;
padding: 2px 0 2px 17px}
.list_rsch li ol li:before {content: '';
width: 5px;
height: 1px;
background: #363636;
position: absolute;
left: 0;
top: 14px}
.list_rschtit {font-size: 1.8rem;
color: #000;
padding: .5rem 0}
.org_bgimage {position: relative}
.org_bgimage>img,
.org_bgimage2>img {position: absolute;
top: 0;
right: 0}
.org_bgimage2 {position: relative;
padding-right: 54rem;
min-height: 30rem}
.dataview {overflow: hidden}
.dataview li {float: left;
width: calc(50% - 1.5rem);
height: 15rem;
position: relative;
margin: 1.5rem 0;
padding-left: 1.5rem}
.dataview dt {position: absolute;
top: 1rem;
left: .5rem;
width: 13rem;
height: 3.5rem;
background: #fff;
text-align: center;
line-height: 3.5rem;
color: #000;
font-size: 1.8rem;
box-shadow: 5px 5px 20px rgba(0, 0, 0, .15)}
.dataview dd>img {max-width: 25.75rem;
max-height: 15.25rem;
width: 100%;
height: auto}
.dataview .desc {margin: 0 0 1.5rem 0;
position: relative;
padding: 0 0 0 3.5rem}
.dataview .desc:before {content: '';
position: absolute;
top: 0;
left: 0;
background: url(../images/sub/icon_dataview.png) no-repeat top left;
width: 46px;
height: 43px}
.ico_photo,
.ico_movie {display: inline-block;
position: relative;
width: 21px;
height: 20px}
.ico_photo:before,
.ico_movie:before {content: '';
width: 100%;
height: 100%;
position: absolute;
top: 60%;
left: 0;
transform: translateY(-50%)}
.ico_photo:before {background: url(../images/sub/icon_photo.png) no-repeat center left}
.ico_movie:before {background: url(../images/sub/icon_movie.png) no-repeat center left}
.opensource2 {position: relative;
font-size: 0;
color: #424242;
margin: 1rem 0;
padding-left: 0;
height: 2.5rem;
text-align: right}
.opensource2:before {content: '';
width: 100%;
height: 100%;
position: absolute;
right: 0;
top: 0}
.opensource2.type01:before {background: url(../images/sub/img_opentype01.png) no-repeat top right}
.opensource2.type02:before {background: url(../images/sub/img_opentype02.png) no-repeat top right}
.opensource2.type03:before {background: url(../images/sub/img_opentype03.png) no-repeat top right}
.opensource2.type04:before {background: url(../images/sub/img_opentype04.png) no-repeat top right}
.opensource3 {position: relative;
font-size: 0;
color: #424242;
width: 7rem;
height: 1.85rem}
.opensource3:before {content: '';
width: 100%;
height: 100%;
position: absolute;
right: 0;
top: 0;
background-repeat: no-repeat;
background-position: top right}
.opensource3.type01:before {background-image: url(../images/sub/img_opentype01.png);
background-size: 5.5rem 100%}
.opensource3.type02:before {background-image: url(../images/sub/img_opentype02.png);
background-size: 6.95rem 100%}
.opensource3.type03:before {background-image: url(../images/sub/img_opentype03.png);
background-size: 6.95rem 100%}
.opensource3.type04:before {background-image: url(../images/sub/img_opentype04.png);
background-size: 8.4rem 100%}
.thumarch {overflow: hidden;
border-top: 1px solid #424242;
padding-top: 2rem}
.thumarch ul li {float: left;
width: calc(33% - 2rem);
margin: 0 2rem 3.5% 0}
.thumarch ul li article {display: block;
position: relative;
transition: all .6s .4s}
.thumarch ul li>article:hover {transform: translateZ(0);
box-shadow: 3px 3px 10px rgba(0, 0, 0, .3)}
.thumarch ul li .desc {height: 3.5rem;
text-align: left;
margin-top: 1rem;
transition: all .3s}
.thumarch ul li:hover .desc {padding: 0 .5rem}
.thumarch ul li .thumb {overflow: hidden;
width: 100%}
.thumarch ul li .thumb .box {min-height: 254px;
position: relative;
background: #e5e5e5}
.thumarch ul li .thumb .box img {position: absolute;
top: 50%;
left: 50%;
transform: scale(1) translate(-50%, -50%);
width: 100%;
height: auto;
max-height: 100%;
transition: all .6s}
.thumarch ul li:hover .thumb .box img {transform: scale(1.15) translate(-50%, -50%)}
.thumarch ul li .thumb:before {display: block;
content: '';
width: 0;
height: 2px;
background: #000;
position: absolute;
right: 0;
top: 0;
z-index: 1;
transition: all .3s .3s}
.thumarch ul li .thumb:after {display: block;
content: '';
width: 0;
height: 2px;
background: #000;
position: absolute;
left: 0;
bottom: 0;
z-index: 1;
transition: all .3s .3s}
.thumarch ul li .desc:before {display: block;
content: '';
width: 2px;
height: 0;
background: #000;
position: absolute;
left: 0;
top: 0;
z-index: 1;
transition: all .3s 0s}
.thumarch ul li .desc:after {display: block;
content: '';
width: 2px;
height: 0;
background: #000;
position: absolute;
right: 0;
bottom: 0;
z-index: 1;
transition: all .3s}
.thumarch ul li:hover .thumb:before {width: 100%;
transition: all .3s 0s}
.thumarch ul li:hover .thumb:after {width: 100%;
transition: all .3s 0s}
.thumarch ul li:hover .desc:before {height: 100%;
transition: all .3s .3s}
.thumarch ul li:hover .desc:after {height: 100%;
transition: all .3s .3s}
.arch_left {float: left;
width: calc(100% - 6rem);
padding-top: .5rem}
.arch_right {float: right;
width: 6rem;
text-align: right}
.btn_archiv {position: relative;
width: 2rem;
height: 2rem;
border: 2px solid rgba(255, 255, 255, .7);
background: #04254b;
border-radius: 50%;
font-size: 0;
transition: .3s;
display: inline-block}
.btn_archiv.remove {background: #c79443}
.btn_archiv.disdown {background: #b7b7b7}
.btn_archiv.goback {background: #940f47}
.btn_archiv:before {content: '';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
line-height: 1.8rem;
background-position: 0 0;
background-repeat: no-repeat}
.btn_archiv:before {background-image: url(../images/sub/icon_cart.png);
width: 21px;
height: 21px}
.btn_archiv.img:before {background-image: url(../images/sub/icon_smimg.png)}
.btn_archiv.remove:before {background-image: url(../images/sub/icon_cartrem.png);
width: 26px;
height: 19px}
.btn_archiv.disdown:before {background-image: url(../images/sub/icon_cartdis.png);
width: 26px;
height: 21px}
.btn_archiv.goback:before {background-image: url(../images/sub/icon_goback.png);
width: 20px;
height: 22px}
.btn_archiv:hover {background: #245a99}
.btn_archiv.remove:hover {background: #c36408}
.btn_archiv.disdown:hover {background: #7f7f7f}
.btn_archiv.goback:hover {background: #c40c5a}
.tit_icocart {position: relative;
padding-left: 2rem}
.tit_icocart:before {content: '\e9fb';
position: absolute;
top: 0;
left: 0;
font-family: 'xeicon';
font-size: .85rem;
line-height: 1.5rem;
color: #fff;
width: 1.5rem;
height: 1.5rem;
background: #000000;
border-radius: 50%;
text-align: center}
.tootip {display: inline-block;
position: relative}
.tootip span {position: absolute;
border: 1px solid #b7b7b7;
background: #fff;
width: 5.25rem;
height: 1.1rem;
font-size: .6rem;
text-align: center;
line-height: 1rem;
padding: 0 0;
border-radius: 3px;
top: -28px;
left: 50%;
transform: translateX(-50%);
opacity: 0;
transition: .5s;
visibility: hidden;
display: block;
z-index: 10;
letter-spacing: -1px}
.tootip span:after {content: '';
position: absolute;
background-color: #fff;
width: 7px;
height: 7px;
transform: rotate(45deg) translateX(-50%);
bottom: -7px;
left: 50%;
border-color: #b7b7b7;
border-style: solid;
border-width: 0 1px 1px 0}
.tootip:hover span {opacity: 1;
visibility: visible}
.tootip.popup {left: 50%;
top: 0;
transform: translateX(-50%)}
.similar_head {height: 1.35rem;
position: relative;
margin: 0 0}
.similar_head .leftnav {position: absolute;
left: 0;
width: calc(100% - 7rem)}
.similar_head .leftnav>p {margin-top: .2rem;
text-align: left}
.similar_head .rightnav {position: absolute;
right: 0}
.similar_img {position: relative;
border-top: 1px solid #dbdbdb}
.similar_img .tit {padding: .5rem 0;
color: #000;
font-size: .95rem}
.js_slide {position: relative;
height: 100%;
padding: .5rem 0 0}
.js_slide .control {width: 100%}
.js_slide .control button {position: absolute;
top: 1.25rem;
font-size: 0;
width: 1.8rem;
height: 1.8rem;
background: #f4f7fa;
border: 1px solid #e5e7e7;
border-radius: 50%;
transition: .3s}
.js_slide .control button:hover {background: #eff5fb;
border: 1px solid #dbdbdb}
.js_slide .control .icbtn_prev {left: 0}
.js_slide .control .icbtn_next {right: 0}
.js_slide .control button::before {content: '';
font-family: 'xeicon';
font-size: 1.8rem;
left: 50%;
transform: translateX(-50%)}
.js_slide .control .icbtn_prev::before {content: '\e93b'}
.js_slide .control .icbtn_next::before {content: '\e93e'}
.js_slide .move {z-index: 20;
margin: 0 2rem;
width: calc(100% - 4rem)}
.js_slide .move ul li .photo {width: 110px;
height: 65px;
margin: auto;
background: #e5e5e5;
padding-bottom: .5rem;
position: relative}
.js_slide .move ul li .photo img {position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
height: auto;
max-height: 100%}
.js_slide .move ul li .desc {position: relative}
.js_slide .move ul li .photo.noimg {background: #e5e5e5}
.scroll_similar {margin: 0;
max-height: 650px;
overflow-y: scroll}
.boxcart {margin-top: 1rem;
position: relative}
.boxcart::after {content: '';
border: 2px solid #363636;
border-radius: .75rem;
position: absolute;
left: 1rem;
top: .35rem;
width: calc(100% - 1rem);
min-height: 5rem;
z-index: 0}
.boxcart p {position: relative;
padding: 1.25rem 1.25rem 1.25rem 2.5rem;
text-align: center}
.boxcart p::before {content: '\e9fb';
background: #d34600;
width: 2rem;
height: 2rem;
border-radius: 50%;
position: absolute;
top: 0;
left: 0;
z-index: 1;
font-family: 'xeicon';
font-size: 1.1rem;
line-height: 2rem;
color: #fff}
.boxcart p strong {color: #d34600}
.boxcart p.empty {padding-top: 1.8rem}
.boxcart p.empty::before {background: #000}
/*.archive_list {border-top: 1px solid #424242}
.archive_list li {overflow: hidden;
padding: 1rem 1rem;
border-bottom: 1px solid #dfdfdf}
.archive_list li>div {float: left}
.archive_list li .fltchk {width: 2.5rem}
.archive_list li .photo {padding-right: 1.5rem}
.archive_list .no_data {text-align: center;
color: #000;
font-size: 1.8rem;
padding: 5rem 0;
vertical-align: middle}*/
.icon_data {position: relative;
display: inline-block;
vertical-align: middle;
margin-right: 100px}
.icon_data::before {content: '';
background: url(../images/sub/icon_nodata.png) top left no-repeat;
position: absolute;
top: -36px;
left: 0;
width: 72px;
height: 72px}
.color_blk {color: #000}
.formchk input[type=checkbox] {display: none}
.formchk label {display: inline-block;
cursor: pointer;
font-size: 0;
vertical-align: middle}
.formchk label:before {content: '\e929';
font-family: 'xeicon';
border: 2px solid #1f1f1f;
width: 18px;
height: 18px;
font-size: 17px;
vertical-align: middle;
display: inline-block;
text-align: center;
line-height: 15px;
color: transparent;
transition: .2s}
.formchk input[type=checkbox]:checked+label:before {background-color: #07386f;
color: #fff;
border-color: transparent}
.formchk input[type=checkbox]+label:active:before {transform: scale(0)}
.downinfo {border: 2px solid #eaeaea;
padding: 1.5rem .85rem}
.downinfo .title {font-size: 1.2rem;
color: #000;
text-align: center}
.downinfo .textbox {background: #f7f7f7;
color: #000;
padding: 2rem 1rem;
margin: 1rem 0}
.downinfo .textbox p {position: relative;
padding: .5rem 0 0 3.5rem}
.downinfo .textbox p::before {content: '';
background: url(../images/sub/icon_mobile.png) no-repeat top left;
position: absolute;
top: 0;
left: 0;
width: 41px;
height: 65px}
.downinfo .textbox p.icon_down::before {content: '';
background: url(../images/sub/icon_download.png) no-repeat top left;
position: absolute;
top: .5rem;
left: 0;
width: 46px;
height: 46px}
.downinfo .textbox span {display: block;
font-size: .9rem}
.btn_orange,
.btn_blue {position: relative;
display: inline-block;
height: 2.5rem;
border-radius: 1.75rem;
color: #fff;
font-size: 1.6rem;
padding: 0 3rem;
line-height: 2.5rem;
transition: .4s}
.btn_orange {background: #e54600}
.btn_orange:hover {background: #c63d00}
.btn_blue {background: #04254b}
.btn_blue:hover {background: #004798}
.acrh_login {border: 1px solid #e5e7e7;
padding: 1.5rem 1rem;
margin-top: 1.5rem}
.acrh_login .title {font-size: 1.2rem;
color: #000;
text-align: center}
.acrh_login ul {margin: 1rem 0}
.acrh_login li {position: relative;
padding: 0 0 0 .5rem;
font-size: 1.5rem}
.acrh_login li::before {content: '';
width: 3px;
height: 1px;
background: #444444;
position: absolute;
top: .5rem;
left: 0}
.arch_popup {position: relative;
margin: 1.5rem 0;
background: #f4f7fa;
border: 1px solid #e5e7e7;
transition: .4s;
font-size: .85rem;
color: #000;
padding: 1rem 1.5rem 1rem 4rem}
.arch_popup:hover {background: #eff5fb;
border: 1px solid #dbdbdb}
.arch_popup::before {content: '';
background: url(../images/sub/icon_text.png) top left no-repeat;
width: 28px;
height: 31px;
position: absolute;
top: 50%;
left: 1.5rem;
transform: translateY(-50%)}
.arch_popup>a {position: relative}
.arch_popup>a::after {position: absolute;
top: 50%;
left: 100%;
font-family: 'xeicon';
content: '\e940';
color: #000;
transform: translateY(-50%);
padding-left: .25rem}
.arch_wrap {overflow: hidden;
margin: 2rem 0}
.arch_wrap .list {float: left;
width: calc(70% - 3.5rem);
padding-right: 3.5rem}
.arch_wrap .info {float: right;
width: 30%}
.arch_dl {margin: 1rem 0}
.arch_dl dt {padding: .25rem 0;
color: #000;
font-weight: 400}
.arch_dl dd {padding: .25rem 0;
color: #393939}
.fltwrap {overflow: hidden;
margin: 1rem 0}
.fltwrap .fltleft {float: left}
.fltwrap .fltright {float: right}
.modalwrap .modalpopup .container .scroll_arch {margin: 0;
height: 500px;
overflow-y: scroll}
.modalwrap .modalpopup .container .thum_arch {width: 100%;
max-width: 100%;
overflow: hidden}
.archive_line {text-align: left}
.poptit_line {margin-top: 1.5rem;
font-size: 1.85rem;
color: #000;
position: relative;
padding: .7rem 0}
.poptit_line:before {content: '';
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 2px;
background: #000}
.pop_photo {margin: 1rem auto;
padding: .2rem .2rem}
.pop_photo>img {max-width: 100%;
border: 3px solid #eeeeee}
.descinfo {padding: .5rem 0}
.skydokdo {overflow: hidden;
padding-top: 2rem}
.skydokdo ul li {float: left;
width: calc(50% - 1rem);
margin: 0 1rem 3.5% 0;
position: relative}
.skydokdo.list3d ul li {width: calc(50% - 1.65rem);
margin: 0 1.65rem 3.5% 0;
position: relative}
.skydokdo .photo {position: relative;
z-index: 1;
text-align: center}
.skydokdo .photo img {width: 100%;
height: auto}
.skydokdo .photo .btn {position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);}
.skydokdo .desc {background: #fff;
box-shadow: 0 1px 16px rgba(0, 0, 0, .2);
width: calc(100% - 12px);
margin: 0 auto;
margin-top: -2.5rem;
z-index: 2;
position: relative;
padding: 1.2rem .9rem;}
.skydokdo .desc dt {font-size: 2rem;color: #000;font-weight: 400;margin-bottom: 1rem;}
.skydokdo.list3d .desc {margin-top: -1rem;width: calc(100% - 40px);position: relative;}
.skydokdo.list3d .desc a {position: absolute;right: 1rem;top: 1rem;}
.btmovlink {background: #7b5ca1;color: #fff;font-size: 1.4rem;padding: .5rem 1.6rem .5rem 1rem;border-radius: 8px;margin-top: 1rem;
display: inline-block;transition: .5s;position: relative}
.btmovlink:before {content: '\e940';position: absolute;top: 50%;right: 6px;font-family: 'xeicon';font-size: .6rem;transform: translateY(-50%)}
.btmovlink:hover {background: #6f5b87}
.experience2  {overflow: hidden}
.experience2  .history {padding: 1rem 0;float: left;width: 50%}
.experience2  .history:after {content: '';position: absolute;top: 0;left: 165px;width: 1px;height: 100%;background: #000;}
.experience2  .history h4 {position: relative;width: 165px;margin-right: 165px;font-size: 2.2rem;color: #000}
.experience2  .history h4:before {content: '';position: absolute;top: 50%;right: 0;width: 65px;height: 1px;background: #000}
.experience2  .history h4:after {content: '';position: absolute;top: 50%;right: -8px;width: 16px;height: 16px;background: #000;border-radius: 50%;transform: translateY(-50%)}
.experience2  .history ul {margin-left: 165px;padding: 1.5rem 0}
.experience2  .history ul li p {display: inline-block;position: relative;width: 66px;height: 66px;word-break: keep-all;text-align: center;left: -33px;top: 50%}
.experience2  .history ul li p:before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: #34cfac;border-radius: 50%;z-index: 1;}
.experience2  .history ul li p.color2:before {background: #00a79f}
.experience2  .history ul li p.color3:before {background: #1e8f9c}
.experience2  .history ul li p.color4:before {background: #177798}
.experience2  .history ul li p.color5:before {background: #084990}
.experience2  .history ul li p span {font-size: 1.7rem;line-height: 1.9rem;color: #fff;display: inline-block;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);z-index: 1;}
.experience2  .history ul li ol {padding-left: 46px;margin: -66px 0 25px 0}
.experience2  .history ul li ol li {font-size: 1.6rem;position: relative;padding-left: 8px}
.experience2  .history ul li ol li:before {content: '';position: absolute;top: 10px;left: 0;width: 4px;height: 1px;background: #5b5b5b}
.list_col3 {overflow: hidden;
margin: .5rem 0 1rem 0}
.list_col3 li {float: left;
width: 33%;
font-size: 1.5rem}
.table td.align_top {vertical-align: top;
padding: 1rem 1rem}
.prvimg img {width: 80px}
dl.prvinfo {padding-top: 1rem}
dl.prvinfo dt {color: #000;
font-weight: 400;
margin-bottom: .5rem}
.tit_prvn {font-size: 1.15rem;
color: #015A98;
padding-left: 0;
margin: 1.5rem 0 .6rem}
.tit_prvn>img {padding-left: 15px;
width: 50px}
.list_privacy {margin: .5rem 0}
.list_privacy>li {padding-left: 26px;
margin: .5rem 0}
.list_privacy .numbox {margin-left: -26px;
display: inline-block;
width: 21px;
height: 21px;
border-radius: 50%;
background-color: #015A98;
color: #fff;
font-size: 13px;
line-height: 21px;
text-align: center}
.mar_prv {margin: .5rem 0}
#footer .footer_info .utile_wrap li a.prvlink {text-decoration: underline;
color: #fbe927;
font-size: 1.5rem;
padding-right: 1.25rem;
line-height: 2.7rem}
.dokdovr {margin: 0rem 0}
.dokdovr ul {overflow: hidden;
margin: 0 -1rem;
padding-bottom: 2rem}
.dokdovr li {float: left;
width: calc(33.3333% - 2rem);
margin: 0 1rem}
.dokdovr li .photo {position: relative}
.dokdovr li .photo>img {max-width: 100%;
width: 100%}
.dokdovr li .photo span {position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 8rem;
height: 8rem}
.dokdovr .bt_vr {background: rgba(0, 0, 0, .35);
width: 100%;
height: 100%;
display: block;
border-radius: 50%;
text-align: center;
line-height: 8rem}
.dokdovr li .desc {background: #fff;
box-shadow: 0 0 .85rem rgba(0, 0, 0, .11);
height: 12rem;
width: calc(100% - 1.5rem);
margin: 0 auto;
margin-top: -1rem;
z-index: 2;
position: relative;
padding: 1.5rem 1.5rem}
.dokdovr li .desc dt {font-size: 2rem;
color: #000;
margin-bottom: 1rem}
.dokdovr li .desc a {display: block;
background: #7b5ca1;
width: 9rem;
height: 3rem;
border-radius: .45rem;
color: #fff;
text-align: center;
line-height: 3rem;
font-size: 1.5rem;
transition: .25s;
position: absolute;
bottom: 1rem}
/* .dokdovr li .desc a:hover {background: #6b35ab}
.dokdovr li .desc a:after {position: absolute;
right: .2rem;
top: 50%;
transform: translateY(-50%);
font-family: 'xeicon';
content: '\e93f'} */
.undermov {margin: 2rem 0}
.undermov ul {overflow: hidden;
margin: 0 -1rem;
padding-bottom: 2rem}
.undermov li {float: left;
width: calc(50% - 2rem);
margin: 0 1rem;
margin-bottom: 3.6rem}
.undermov li .photo {position: relative}
.undermov li .photo>img {width: 100%;
height: 100%;
object-fit: cover}
.undermov li .photo span {position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 4rem;
height: 4rem}
.undermov .btnmov {background: rgba(0, 0, 0, .35);
width: 100%;
height: 100%;
display: block;
border-radius: 50%;
text-align: center;
line-height: 4rem}
.undermov li .desc {background: #fff;
box-shadow: 0 0 .85rem rgba(0, 0, 0, .11);
height: 4rem;
width: calc(100% - 1.5rem);
margin: 0 auto;
margin-top: -1rem;
z-index: 2;
position: relative;
padding: 1.5rem 1rem;
display: flex;
justify-content: space-between}
.undermov li .desc p {font-size: 1rem;
padding-top: .2rem;}
.undermov li .desc a {display: inline-block;
background: #7b5ca1;
border-radius: .45rem;
color: #fff;
text-align: center;
font-size: 1.4rem;
transition: .25s;
position: relative;
padding: .35rem .75rem .35rem .5rem;}
.undermov li .desc a:hover {background: #6b35ab}
.undermov li .desc a:after {position: absolute;
right: .2rem;
top: 50%;
transform: translateY(-50%);
font-family: 'xeicon';
content: '\e93f';}
.undermov li .desc a:nth-of-type(1) {background: #547fc6;}
.undermov li .desc a:nth-of-type(2) {background: #5e60c1;}
.undermov li .desc a:nth-of-type(3) {background: #7b5ca1;}
.undermov li .desc a:hover:nth-of-type(1) {background: #3273df;}
.undermov li .desc a:hover:nth-of-type(2) {background: #3f42c5;}
.undermov li .desc a:hover:nth-of-type(3) {background: #6b35ab;}
/*20260209*/
.about_history26 {display: flex;justify-content: space-between;margin-top: 4rem; } 
.about_history26 .leftarea {padding-right: 25rem; }
.about_history26 .rightarea {width: 14rem; }
.about_history26 .rightarea {position: relative;}
.about_history26 .his_list> li {width: 13.5rem;text-align: right;min-height: 7.5rem;float: left}
.about_history26 .his_list> li:nth-child(even) {display: inline-block;width: calc(100% - 14rem);text-align: left;margin-top: 0;padding-left: 6rem}
.about_history26 .his_list> li strong {display: block;font-size: 1.6rem;font-weight: 500;color: #000;margin-right: 3rem;position: relative;line-height: 0}
.about_history26 .his_list> li strong span {font-size: 2rem}
.about_history26 .his_list> li strong:before {content: '';position: absolute;right: -5rem;width: 3rem;height: 1px;background: #0b537b}
.about_history26 .his_list> li strong:after {content: '';position: absolute;top: -.5rem;right: -6rem;width: 1rem;height: 1rem;background: #0b537b;border-radius: 50%}
.about_history26 .his_list> li:nth-child(even) p {font-size: 1.6rem;font-weight: 500;color: #000;line-height: 0;padding-bottom: 1rem}
.about_history26 .his_list> li:nth-child(even) .img {margin: 1rem 0 2rem  -2rem;} 
[class^="hisgoal0"] {position: relative;}
[class^="hisgoal0"]::before {content: '';/*z-index: -1;*/width: 14rem;background-repeat: no-repeat;background-position: 0 0; background-size: 100% auto;position: absolute;top: 0;right: 0;} 
.hisgoal01::before {background-image: url(../images2025/sub/bg_his10.jpg);height: 48.5rem;}
.hisgoal02::before {background-image: url(../images2025/sub/bg_his11.jpg);height: 28.5rem;}
.hisgoal03::before {background-image: url(../images2025/sub/bg_his12.jpg);height: 26.5rem;}
.hisgoal04::before {background-image: url(../images2025/sub/bg_his13.jpg);height: 26.7rem;} 
[class^="hsplan0"] {position: relative; text-align: left;} 
.hsplan01 li:nth-of-type(1) {margin:5rem 0 0 1rem;}
.hsplan01 li:nth-of-type(2) {margin: 17rem auto 0 1.5rem;text-align: center; width: 12.5rem;word-break: break-all;}
.hsplan01 li:nth-of-type(3) {margin: 15.75rem 0 0 1rem;}
.hsplan02 li:nth-of-type(1) {margin: 0rem 0 0 1rem;padding-top: .35rem;}
.hsplan02 li:nth-of-type(2) {margin: 7rem auto 0 1.5rem;text-align: center; width: 12.5rem;word-break: break-all;}
.hsplan02 li:nth-of-type(3) {margin: 7rem 0 0 1rem;padding-top: .25rem;} 
.hsplan03 li:nth-of-type(1) {margin: -7rem 0 0 1rem;padding-top: .25rem;}
.hsplan03 li:nth-of-type(2) {margin: 6rem auto 0 1.5rem;text-align: center; width: 12.5rem;word-break: break-all;}
.hsplan03 li:nth-of-type(3) {margin: 6rem 0 0 1rem;padding-top: .25rem;} 
.hsplan04 li:nth-of-type(1) {margin: 0rem 0 0 1rem;padding-top: .25rem;}
.hsplan04 li:nth-of-type(2) {margin: 6rem auto 0 1.5rem;text-align: center; width: 12.5rem;word-break: break-all;}
.hsplan04 li:nth-of-type(3) {margin: 6rem 0 0 1rem;padding-top: .25rem;}
.about_history26 .text1 {color: #2f3b6d;font-size: 1.4rem;display: inline-block;padding-top: .5rem;}
.about_history26 .text2 {color: #b7e2e0;font-size: 1.7rem; padding-top: 1.05rem;  }
.about_history26 .text3 {font-size: 1.8rem;color: #fff; } 
.about_history26 .text3 span {display: block;} 

/*20260224*/
.nodisp {display: none !important}
/* .slide_photo .titlebox .slidebtn { position: initial !important; margin-top: 41rem;} */
.slide_photo {position: relative}
.slide_photo .titlebox {position: relative}
.slider_author .swiper-container .swiper-slide .thum {height: 100%}
/* .slider_author .swiper-container .swiper-slide .thum>img {box-shadow: 0 0 20px rgba(0, 0, 0, .15);border: 20px solid #fff} */
.modalwrap .modalpopup {max-width: calc(100% - 2rem);max-height: calc(100vh - 4rem);} 
.slider_author .swiper-container .swiper-slide .thum > img {height:400px;}

/***************Respond***************/
@media(max-width:1680px) {#right_menu {display: none}}
@media(max-width:1240px) {
	.placewrap .mapimg {width: 95%;margin: 0 2.5%}
	.placewrap .placelist {display: none}
	/* .photographer .title {left:45px;width: 210px;} */
	/* .photographer .writerlist {width: 65%} */
	.slide_photo .titlebox {padding: 6.5rem 2rem 0 8rem}
	.ecoebook:before {display: none}
	.ecoebook .title {position: relative;left: 0;top: 0;width: 100%}
	.ecoebook .items {margin-left: 0;margin-top: 2rem;width: 100%}
	.ecoebook .items:before {left: 50%;background: url(../images/sub/bg_ebook2.png) left top;transform: translateX(-50%)}
	.ecoebook .items.list2 {margin: 5rem 0}
	.ecoebook .items ul {width: 100%}
	.ecoebook .items li {float: left;width: 31.33333%;margin: 0 0}
	.museumbox .thum:after {display: none}
	.museumbox .info {left: 1.25%;top: 50%;width: 95%;height: auto;margin: auto}
	.arch_wrap .list {width: 60%;padding-right: 1.5rem}
	.arch_wrap .info {width: 40%}
}
@media(max-width:1024px) {
	#content_detail {width: 100%;padding: 0 1rem}
	.introbox .desc {left: 0;height: auto;width: 95%;padding: 0 2rem 2rem 2rem;margin: auto}
	.introgeo .desc {width: 96%;padding: .25rem 2rem 1rem 2rem;margin: 0 auto}
	.introbox p {display: none}
	.introbox .desc2 {left: 0;top: 30%;height: 10rem;width: 95%;padding: 0 2rem 0 2rem;margin: auto}
	.introbox2 p {display: none}
	.introbox2 .desc2 {position: absolute;left: 0;width: 95%;top: 25%;margin: auto}
	.introform, .introform.weather {height: auto;margin: 1rem 0}
	.introform .desc {position: relative;top: 0;width: 100%;box-shadow: none;padding: 0}
	.introform .thum {float: none;text-align: left;margin-top: 1rem}
	.introform .thum>img {border: 1px solid #d9d9d9}
	.introform .desc2 {position: relative;top: 0;right: 0;width: 100%;box-shadow: none;padding: 0}
	.introform2 {margin: 1rem 0}
	.introform2 .thum {float: none;width: 100%}
	.introform2 .thum .caption {text-align: right}
	.introform2 .thum>img {z-index: -1}
	.introform2 .desc {float: none;width: 70%;margin: 0 0 1rem 1rem;padding: 1rem;position: relative;top: -3rem}
	.introform .desc2 {float: none;width: 100%;margin: 1rem 0;padding: 0;position: relative;top: 0;box-shadow: none}
	.introform .thum2 {float: none;width: 100%}
	.introform3 {margin: 1rem 0}
	.introform3>div {float: none;width: 100%}
	.introform3>div:first-child {margin-right: 0;margin-bottom: 1rem}
	.list_type01 li {width: 100%;border-right: 1px solid #d9d9d9;border-bottom: 0}
	.list_type01 li p {width: 50%;float: left}
	.list_type01 li span {width: 50%;float: left;border-top: 0}
	.list_type01 li:first-child {display: none}
	.list_type01 li:last-child {margin-left: 0;border-bottom: 1px solid #d9d9d9}
	.humanwrap {padding: 0;border: 0;background: #fff}
	.humanwrap img {display: none}
	.citizenwrap {display: block;margin: 3rem 0}
	.citizenwrap li {padding: 3rem 0 2rem 0;position: relative}
	.citizenwrap li:before {content: '';width: 100%;height: 1px;background: #cdcdcd;position: absolute;top: 2rem;left: 0; }
	.citizenwrap li p {width: 3.8rem;height: 3.8rem;border-radius: 50%;text-align: center;line-height: 2.7rem;border: 1px solid #7bceac;padding: 4px;position: absolute;
	top: 0;left: 50%;transform: translate(-50%, 0);z-index: 1;background: #fff}
	.citizenwrap li p span {display: block;width: 2.8rem;height: 2.8rem;border-radius: 50%;background: #7bceac;color: #fff;font-size: 1.8rem;}
	.citizenwrap li p span.bg2 {background: #5ea59e}
	.citizenwrap li p span.bg3 {background: #548e9a}
	.citizenwrap li p span.bg4 {background: #467695}
	.citizenwrap li p span.bg5 {background: #2c4a8d}
	.citizenwrap dt {padding: 1.5rem 0;font-size: 1.7rem;color: #000;padding-left: 45px;position: relative}
	.citizenwrap dt:before {content: '';width: 38px;height: 33px;background: url(../images/sub/icon_jumin.png) no-repeat;position: absolute;top: 0;left: 0}
	.citizenwrap dt strong {font-size:2.1rem}
	.citizenwrap dd {font-size: 1.8rem;padding-left: 8px;position: relative}
	.citizenwrap dd:before {content: '';width: 4px;height: 1px;background: #5b5b5b;position: absolute;top: 10px;left: 0}
	.vistorwrap>div {float: none}
	.vistorwrap .list1 {width: 100%}
	.vistorwrap .list2 {width: 100%;margin-left: 0;margin-top: 1rem}
	.vistorwrap .list3 {width: 100%;margin-right: 0;padding-bottom: 1rem}
	.list_type02 {width: 100%}
    .list_type02 li {width: 100%;
    border-left: 1px solid #d9d9d9;
    border-bottom: 0}
    .list_type02 li p {width: 50%;
    float: left}
    .list_type02 li span {width: 50%;
    float: left;
    border-top: 0}
    .list_type02 li span br {display: none}
    .list_type02 li:first-child {width: 100%}
    .list_type02 li:last-child {border-bottom: 1px solid #d9d9d9}
    .list_land li {width: 100%;
    border-left: 1px solid #d9d9d9;
    border-bottom: 0}
    .list_land li p {width: 50%;
    float: left}
    .list_land li span {width: 50%;
    float: left;
    border-top: 0}
    .list_land li:first-child {width: 100%}
    .list_land li:last-child {border-bottom: 1px solid #d9d9d9}
    .climate {margin: 1rem 0;
    overflow: hidden}
    .climate .items {float: none;
    width: 100%;
    padding: 3rem 0}
    .climate .items .iconbox {padding: 0 0 0 15rem}
    .board_list li .photo,
    .board_list li .photo.book {display: none}
    .board_list li .desc,
    .board_list li .desc.book {float: none;
    width: 100%}
    .boardinfo {padding: .5rem 0 .5rem 0;
    overflow: hidden}
    .boardinfo .pagenum {float: none;
    width: 100%;
    line-height: 1rem}
    .boardinfo .searchbbs {float: none;
    width: 100%}
    .board_view .board_info .photo {float: none;
    width: 100%}
    .board_view .board_info .infotext {float: none;
    width: 100%;
    margin-top: 1rem}
    .opensource {padding-left: 85px}
    .moviewrap {padding: 1.5rem 1rem}
    .thumlist ul li {width: 48%;
    margin: 0 4% 4.85% 0}
    .thumlist ul li:nth-child(3n) {margin-right: 4%}
    .thumlist ul li:nth-child(2n) {margin-right: 0}
    .thumarch ul li {width: 47%;
    margin: 0 3% 4.85% 0}
    .thumarch ul li:nth-of-type(3n) {margin-right: 4%}
    .animatewrap {height: auto;
    padding: 0}
    .animatewrap .movimgbox {width: 100%;
    height: auto;
    position: relative;
    top: 0}
    .animatewrap .movimgbox:after {display: none}
    .animatewrap .movimgbox .playwrap {position: relative;
    padding: 50% 0 0 0;
    overflow: hidden}
    .animatewrap .movimgbox .playwrap .viedoplay>img {max-width: 100%;
    width: 100%}
    .animatewrap .movcaption {width: 100%;
    position: relative;
    right: 0;
    bottom: 0;
    box-shadow: none}
    .animatewrap .movcaption dl {margin: 2rem 0 0 0}
    .animatelist {padding: 0 0}
    .animatelist .title {margin-bottom: 1rem;
    width: 100%;
    float: none}
    .animatelist .ani_slide {float: none;
    width: 100%}
    .animatelist .ani_slide .move {width: auto;
    margin: 0 4rem 0 4rem}
    .animatelist .ani_slide .move ul li a>img {max-width: 100%;
    width: 100%}
    .webtoon:before {display: none}
    .webtoon:after {display: none}
    .webtoon .list {margin: 0 0 0 0}
    .webtoon .list li {width: 46%;
    padding: 1.5rem 0;
    margin: 0 2%}
    .webtoon .list .imgbox>img {max-width: 100%;
    width: 100%}
    .placewrap {margin: 0}
    .placewrap .mapimg {display: none}
    .map_mobile {display: block}
    .placewrap .title_icon {margin-bottom: 1rem}
    .placewrap .placelist ul li {margin-left: 0}
    .place_select {width: 100%;
    margin: 1rem 0;
    overflow: hidden;
    padding: 1rem 0;
    border-top: 2px solid #2b2b2b;
    border-bottom: 2px solid #2b2b2b}
    .place_select li {width: 20%;
    float: left;
    padding: .3rem 0}
    .facilitywrap div {float: none}
    .facilitywrap .imgbox {width: 100%;
    text-align: center}
    .facilitywrap .list {width: 100%;
    padding-left: 0}
    .facilitywrap .list .items:before,
    .facilitywrap .list .items span {left: 50%;
    top: -3.8rem}
    .facilitywrap .list .items table {margin-top: 3rem;
    margin-left: 0}
    .history .imgstone {position: relative;
    top: 0;
    left: 0}
    .history .imgstone>div {width: 21rem;
    margin: 1rem auto;
    text-align: center}
    .history .imgstone>div>img {max-width: 100%;
    height: 100%}
    .history .eastisland,
    .history .westisland {float: none;
    width: 100%;
    margin-top: 2rem}
    .history .eastisland p,
    .history .westisland p {line-height: 17rem}
    .history .westisland p {left: 47%;}
    .managewrap {padding: 2rem 0;
    position: relative;
    margin-bottom: 3.6rem}
    .managewrap:before {display: none}
    .managewrap ul {min-height: auto;
    margin-left: 0}
    .managewrap li {width: 9.5rem;
    height: 9.5rem;
    border-radius: 50%;
    background: #315479;
    color: #fff;
    margin: 0 1rem 1rem 1rem;
    position: relative}
    .managewrap li:after {content: '';
    position: absolute;
    top: 50%;
    left: 92%;
    font-family: 'remixicon';
    content: '\ea6d';
    color: #000;
    transform: translateY(-50%);font-size: 2.5rem;}
    .managewrap li:nth-child(even) {margin-top: 0}
    .managewrap li:nth-child(2) {margin-top:0rem;margin-left: 0rem;}
    .managewrap li:nth-child(8) {background: #4d85ae}
    .managewrap li:nth-child(8):after {display: none} 
    .managewrap li:nth-child(even) {margin-top: 0rem} 
    .managewrap li:nth-child(2) {margin-top: 0rem;margin-left: 0rem;}
    .managewrap li:nth-child(3) {margin-left:0rem;margin-top: 0rem;}
    .managewrap li:nth-child(4) {margin-left:0rem;margin-top: 0rem;}
    .managewrap li:nth-child(5) {margin-left:0rem;margin-top: 0rem;}
    .managewrap li:nth-child(6) {margin-left: 0rem;margin-top: 0rem;}
    .managewrap li:nth-child(7) {margin-left: 0rem;margin-top: 0rem;}
    .managewrap li:nth-child(8) {margin-left:0rem;margin-top: 0rem;}

    .adminwrap {height: auto}
    .adminwrap:before {display: none}
    .adminwrap .items {position: relative;
    width: 100%}
    .adminwrap .items>div {position: relative;
    width: 100%}
    .adminwrap .items>div:nth-child(1) {left: 0;
    top: 0}
    .adminwrap .items>div:nth-child(2) {left: 0;
    top: 0}
    .adminwrap .items>div:nth-child(3) {left: 0;
    top: 0}
    .adminwrap .items>div:nth-child(3) dl {width: 100%}
    .adminwrap .items>div:nth-child(4) {left: 0;
    top: 0}
    .adminwrap .items>div:nth-child(5) {left: 0;
    top: 0}
    .adminwrap .items h5 {display: block;
    border-bottom: 1px solid #d6d6d6;
    color: #000;
    font-size: 1.85rem;
    margin-top: 2.25rem;
    padding-bottom: 1.2rem}
    .enterwrap .applystep .items {margin-left: 2rem;
    overflow: hidden}
    .figurewrap2 .right {display: block;
    margin: 1rem auto;
    text-align: center}
    .figurewrap2 .right>img {max-width: 100%}
    .figurewrap2 .info {display: block;
    position: relative;
    margin-right: 0}
    .figurewrap3 img {display: block;
    margin: 1rem auto;
    max-width: 100%}
    .figurewrap3 span {display: block;
    margin-left: 0;
    position: relative;
    text-align: center}
    .figurewrap4>div {margin: 1rem auto}
    .figurewrap4>div img {margin-right: 0}
    .reference .info {padding: 2rem 1rem 1rem 1rem}
    .reference .info:before {width: 100%;
    left: 0;
    top: 1rem}
    .photographer {height: 100%}
    .photographer:before {background-image: none}
    .photographer .title {position: relative;
    top: 0;
    left: 0;
    max-width: 100%}
    .photographer .writerlist {position: relative;
    top: 1rem;
    right: 0;
    left: 0;
    width: 100%;
    overflow: hidden}
    .photographer .writerlist .items:nth-child(3) {clear: both}
    .slide_photo:before {display: none}
    .slide_photo .titlebox {float: none;
    width: 100%;
    padding: 0 1rem 0 0;
    margin-bottom: 1rem}
    .slide_photo .titlebox dt {margin: 1rem 0}
    .slide_photo .titlebox .slidebtn {display: none}
    .slide_photo .imgbox {float: none;
    padding-top: 0;
    width: 100%}
    .slide_photobtm {background: #bfc4d1;
    height: auto;
    padding: 1rem;
    margin-top: 1rem}
    .slide_photobtm p {padding-top: 0;
    text-align: left;
    line-height: 2rem}
    .slide_photobtm:before {display: none}
    .slider_author {text-align: center;
    left: 50%;
    transform: translateX(-50%)}
    .ecoebook .items {margin-left: 0}
    .ecoebook .items:before {display: none}
    .ecoebook .items li {float: left;
    width: 33.33333%;
    margin: 0 0}
    .ecoebook .items ul {margin-left: 0}
    .ecoebook .items.list2 {margin: 2rem 0 0}
    .experhis .history {padding: 1rem 0;
    float: none;
    width: 100%}
    .figurewrap5 .thum {float: none;
    text-align: center}
    .figurewrap5 .thum2 {float: none;
    width: 100%}
    .figurewrap5 .thum3 {float: none;
    width: 100%;
    text-align: right}
    .figurewrap5 .thum span {display: block;
    font-size: 1.5rem;
    text-align: center;
    margin-top: .5rem}
    .figurewrap5 .desc {float: none;
    width: 100%;
    padding-left: 0}
    .figurewrap5 .desc2 {float: none;
    width: 100%;
    padding-left: 0}
    .figurewrap5 .desc3 {float: none;
    width: 100%;
    padding-left: 0}
    .figurewrap5 .desc4 {float: none;
    width: 100%;
    padding-left: 0}
    .figurewrap5>img,
    .figurewrap5 .thum2>img,
    .figurewrap5 .thum3>img {display: block;
    margin: 0 auto;
    border: 1px solid #cacaca;
    text-align: center;
    max-width: 100%;
    width: 100%}
    .figurewrap5>span {display: block;
    margin-left: 0;
    position: relative;
    left: 0;
    bottom: 0;
    font-size: 1.5rem;
    text-align: center}
    .figurewrap5.center {width: auto;
    text-align: center;
    margin: 1rem auto}
    .figurewrap5.center>img {max-width: 100%;
    width: 100%}
    .figurewrap5.center>span {text-align: center}
    .figurewrap6 img {text-align: center;
    max-width: 100%;
    width: 100%}
    .caption li {text-align: left;
    width: 48%}
    .figurewrap4 div.width25 {width: 50%;
    margin: 0 auto;
    text-align: center}
    .lawwrap ul,
    .lawwrap dl {margin-left: 7rem}
    .lawwrap {padding: 1rem 2rem}
    .contact .btn {position: relative;
    top: 0;
    right: 0}
    .transport {padding-left: 0;
    position: relative}
    .transport:before {display: none}
    .transport:after {display: none}
    .carlist {position: relative;
    min-height: 7rem;
    height: 100%;
    margin-bottom: .25rem}
    .carlist .highway {position: relative;
    left: 50%;
    top: 0;
    transform: translateX(-50%)}
    .carlist .desc {position: relative;
    left: 0;
    top: -1rem;
    padding: 2rem 1.5rem}
    .transport .train {border: 1px solid #e6e6e6;
    background: #fff;
    padding: 1rem 1.5rem}
    .sitemap .heading {padding: 1rem 0 0 1rem}
    .sitemap .list {padding: 1rem 0 1rem 1rem}
    .listfaq {padding: 1rem 1rem}
    .listfaq:before,
    .listfaq.icon02:before {display: none}
    .listfaq ul {margin-left: 0}
    .lawbgbox:after {display: none}
    .lawbgbox p,
    .lawbgbox p.title {width: 100%}
    .rsch_center {position: relative;
    height: auto;
    overflow: hidden}
    .rsch_center:before {display: none}
    .rsch_center .items {position: relative;
    float: left;
    width: 48%;
    min-height: 10rem;
    margin-right: 2%}
    .rsch_center .items:nth-child(1) {left: 0;
    top: 0;
    width: 48%}
    .rsch_center .items:nth-child(2) {left: 0;
    top: 0;
    width: 48%}
    .rsch_center .items:nth-child(3) {left: 0;
    top: 0;
    width: 48%}
    .rsch_center .items:nth-child(4) {left: 0;
    top: 0;
    width: 48%}
    .rsch_center .items dl dt {border: 2px solid #084990;
    padding: 1rem 0;
    text-align: center}
    .rsch_center .items dl dt.line2 {border-color: #00a79f}
    .rsch_center .items dl dt.line3 {border-color: #1e8f9c}
    .rsch_center .items dl dt.line4 {border-color: #177798}
    .vision {position: relative;
    height: auto;
    overflow: hidden}
    .vision:before {display: none}
    .vision .items {position: relative;
    float: left;
    width: 48%;
    min-height: 10rem;
    margin-right: 2%}
    .vision .items:nth-child(1) {left: 0;
    top: 0;
    width: 48%}
    .vision .items:nth-child(2) {left: 0;
    top: 0;
    width: 48%}
    .vision .items:nth-child(3) {left: 0;
    top: 0;
    width: 48%;
    clear: both}
    .vision .items:nth-child(4) {left: 0;
    top: 0;
    width: 48%}
    .vision .items p {position: relative;
    padding: 3rem 0 3rem 0;
    display: block}
    .vision .items p.num:before {content: '';
    position: absolute;
    width: 100%;
    height: 1px;
    top: 50%;
    left: 0;
    background: #c2c2c2;
     }
    .vision .items p.num span {display: block;
    position: relative;
    color: #fff;
    text-align: center;font-size: 0;}
    .vision .items p.num span:before {content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 0rem;
    height: 0rem;
    border: 0;
    border-radius: 0;
    background: #fff;
     }
    .vision .items p.num span:after {
        content: '';
    position: absolute;
    width: 3rem;
    height: 3.4rem;
    /* border-radius: 50%; */
    border-radius: 90% 90% 90% 90% / 90% 90% 100% 100%;
    background: #1e9c59;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);     }
    .vision .items dl {margin-top: 1rem}
    .vision .items p.num.box2 span:before {border: 0px solid #1e8f9c}
    .vision .items p.num.box2 span:after {background: #239cae}
    .vision .items p.num.box3 span:before {border: 0px solid #177798}
    .vision .items p.num.box3 span:after {background: #1e88d3}
    .vision .items p.num.box4 span:before {border: 0px solid #084990}
    .vision .items p.num.box4 span:after {background: #8c76dd}
    .org_bgimage>img,
    .org_bgimage2>img {position: relative;
    top: 1rem}
    .org_bgimage2 {position: relative;
    padding-right: 0;
    min-height: 15rem}
    .filewrap {padding: 1rem 1rem 1rem 1rem}
    .filewrap:after,
    .filewrap:before {display: none}
    .filewrap li {width: 50%}
    /*.archive_list li .photo {padding-right: 0}
    .archive_list li .desc {padding: .5rem 0 0 2.5rem}*/
    .experience2 .history {padding: 1rem 0;float: none;width: 100%}
    .web {display: none;}
    .undermov li .desc {height: 6.5rem;flex-direction: column;margin-top: 20px;}
 	.undermov li .desc p {margin-bottom: 20px;}  
    [class^="hisgoal0"] {margin-bottom: 5rem; text-align:center}
    .about_history26 {flex-direction: column;align-items: flex-start;justify-content: space-around;}
    .about_history26 .leftarea {padding-right: 0;}
    .about_history26 .rightarea {padding-right: 0;width: 100%;} 
    [class^="hisgoal0"]::before {display: none;} 
    [class^="hsplan0"]  {width: 100%;max-width: 45rem; margin: 0 auto; display: flex;align-items: center; } 
    [class^="hsplan0"]::before  {content: '';width: 39rem;height: 1px; position: absolute;left: 50%;top: 50%;border: 1px dashed #989b9e; z-index: 1px;transform: translate(-50%, 50%);} 
    [class^="hsplan0"] li {position: relative;}    
    [class^="hsplan0"] li:nth-of-type(1) {width: 5.5rem;height: 3rem;padding: 0 1rem; margin:-5rem 0 0 0rem; background: #e4e4e4;border-radius: .5rem;z-index: 2;}
    [class^="hsplan0"] li:nth-of-type(1)::before {content: '';width: 1px;height: 60%; position: absolute;left: 53%;top: 50%;border: 1px dashed #989b9e; z-index: 1px;transform: translate(-50%, 50%);}        
    [class^="hsplan0"] li:nth-of-type(2) {width: 12.2rem;height: 12.2rem;margin: 0 auto;background: #08908b; border-radius: 100%;display: flex;align-items: center;flex-direction: column;justify-content: center;   }
    [class^="hsplan0"] li:nth-of-type(3) {width: 5.5rem;height: 3rem;padding: 0 1rem; margin:-5rem 0 0 0rem; background: #e4e4e4;border-radius: .5rem; z-index: 2;position: relative; }
    [class^="hsplan0"] li:nth-of-type(3)::before {content: '';width: 1px;height: 60%; position: absolute;left: 50%;top: 53%;border: 1px dashed #989b9e; z-index: 1px;transform: translate(-50%, 50%);}    
    .hsplan01 li:nth-of-type(2) {background: #08908b;}  
    .hsplan02 li:nth-of-type(2) {background: #087b90;}  
    .hsplan03 li:nth-of-type(2) {background: #086890;} 
    .hsplan04 li:nth-of-type(2) {background: #043f7e;} 
    .about_history26 .text1 { font-weight: 500;} 
}

@media(max-width:860px) {
    .ecoebook {overflow: hidden}
    .ecoebook .items {width: 100%;
    margin: auto;
    height: auto}
    .ecoebook .items li {width: 100%;
    margin: .5rem auto}
    .ecoebook .items li .imgbox {margin: 0 auto}
    .sitemap {background: linear-gradient(to bottom, #f8f8f8 50px, #fff 50px);
    padding-bottom: 1rem}
    .sitemap .heading {float: none;
    width: 100%;
    padding: .75rem 0 0 1rem}
    .sitemap .list {float: none;
    width: 100%}
    .sitemap .list li {width: 50%;
    margin-top: .75rem}
    .sitemap .list li:before {top: 9px}
    .sitemap .list li li {margin-top: 0}
    .sitemap .list li li:before {top: 10px}
    .skydokdo ul li {width: 100%;}
    .dokdovr li {width: calc(50% - 2rem);margin-bottom: 3.6rem}
}
@media(max-width:768px) {
    #location .lnb .submenu:last-child {display: none}
    .mobhide {display: none}
    .introform4 .thum {float: none;
    width: 100%}
    .introform4 .desc {float: none;
    position: absolute;
    top: 1rem;
    right: 1rem;
    margin: 0;
    padding: .5rem;
    width: 6rem;
    max-height: 6.5rem}
    .introform4 .desc li span {width: 2rem}
    .tablewrap th,
    .tablewrap td {text-align: center;
    padding: .7rem 0}
    .tabmenu {background: #fff;
    padding: 0}
    .tabmenu .tab_2depth {overflow: visible;
    text-align: left;
    background-color: #08235b;
    color: #fff}
    .tabmenu .tab_2depth .selected {display: block;
    line-height: 37px;
    padding-left: 1rem}
    .tabmenu .tab_2depth .active {display: none;
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    border: 1px solid #ccc;
    background: #fff}
    .tabmenu .tab_2depth.on .active {display: block;
    z-index: 90}
    .tabmenu .tab_2depth ul {overflow-y: auto}
    .tabmenu .tab_2depth ul li {z-index: 90;
    float: none;
    width: 100% !important;
    height: auto;
    margin-top: 0;
    border-top: 1px solid #d5d5d5}
    .tabmenu .tab_2depth ul li a {height: auto;
    display: block;
    padding-left: 10px;
    border: 0;
    border-radius: 0;
    background: transparent;
    line-height: 37px}
    .tabmenu .tab_2depth ul li a span {display: block;
    height: 37px;
    line-height: 37px;
    color: #000}
    .tabmenu .tab_2depth ul li:first-child a {border-top: 0}
    .tabmenu .tab_2depth ul li.on a {padding-left: 10px;
    background: transparent;
    border: none}
    .tabmenu .tab_2depth ul li a:hover {background: transparent;
    border: none;
    color: #08235b}
    .boardinfo.patent {padding-left: 0}
    .boardinfo.patent:before {display: none}
    .markwrap {box-shadow: none;
    padding: 0}
    .markbox {border: none;
    padding: 0}
    .markinner {border: none;
    padding: 0}
    .markbox:before,
    .markbox:after,
    .markinner:before,
    .markinner:after {background: none}
    .mark_title {font-size: 2.7rem}
    .mark_desc {padding: 1rem 0 1rem 0}
    .mark_desc .imgbox {overflow: hidden}
    .mark_desc .imgbox div {float: none;
    width: 100%}
    .mark_desc .imgbox div:first-child {padding-left: 0;
    text-align: center;
    margin-bottom: 1.5rem}
    .mark_desc dl {margin-top: 1rem}
    .moviewrap .movimgbox {width: 100%;
    float: none}
    .moviewrap .movcaption {padding-left: 0;
    width: 100%;
    float: none;
    margin-bottom: 1rem}
    .moviewrap .movcaption dl {margin-top: 1rem}
    .modalwrap .modalpopup {width: 90%}
    .modalwrap .modalpopup .container {padding: 1rem}
    .modalwrap .modalpopup .container .btn {top: .2rem;
    right: .2rem}
    .satisf-inner {padding: 1rem 1rem}
    .satisf-inner>div {float: none;
    width: 100%}
    .satisf-inner>div:nth-child(2) {margin-top: 2rem;
    padding-bottom: 1rem}
    .btn_satis {right: 0}
    .enterwrap {margin: 3rem 0}
    .enterwrap .applystep:before {width: 100%;
    left: 0}
    .enterwrap .title {top: -1.5rem;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    text-align: center}
    .enterwrap .title strong {display: block}
    .enterwrap .applystep .items li {float: none;
    width: 100%;
    text-align: left;
    margin-bottom: 4rem}
    .enterwrap .applystep .items li:last-child {margin-bottom: 0}
    .enterwrap .applystep .items li:after {top: 100%;
    left: 50%;
    transform: translateX(-50%) rotate(0)}
    .enterwrap .applystep .items li span {margin: 0;
    display: inline-block;
    width:12rem;
    height: 12rem}
    .enterwrap .applystep .items li p {display: inline-block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 1rem}
    .enterwrap .applystep .desc {width: calc(100% - 2rem);
    margin-left: 1rem;
    margin-top: 1.5rem}
    .ecoebook {height: 100%;
    overflow: hidden}
    .museumbox .info {left: 1%;
    top: 40%;
    width: 98%;
    padding-left: 1.25rem}
    .museumbox .info li {float: none;
    width: 100%;
    padding: 1rem 0}
    .museumbox .info li.width100 {float: none;
    width: 100%;
    padding: 1rem 0}
    .lawwrap:before {display: none}
    .lawwrap ul,
    .lawwrap dl {margin-left: 0}
    .lawwrap {padding: 1rem}
    .webtoon .list li {width: 100%;
    padding: 1rem;
    margin: 0 0}
    .board_pager a {width: 1.6rem;
    height: 1.6rem;
    font-size: 1.6rem;
    padding-top: .15rem;
    margin: 0 1px 5px 1px}
    .board_pager i {font-size: 1rem;
    margin-top: .1rem}
    .table.responsive {width: 100%;
    overflow-x: auto}
    .table thead th {padding: .6rem .25rem}
    .table td {padding: .5rem .25rem}
    .rsch_center .items {position: relative;
    float: none;
    width: 100%;
    min-height: auto;
    margin-right: 0}
    .rsch_center .items:nth-child(1),
    .rsch_center .items:nth-child(2),
    .rsch_center .items:nth-child(3),
    .rsch_center .items:nth-child(4) {left: 0;
    top: 0;
    width: 100%}
    .about_history:before {display: none}
    .about_history li {float: none;
    width: 100%;
    text-align: left;
    min-height: auto;
    padding: 1rem 0}
    .about_history li:nth-child(even) {float: none;
    width: 100%;
    padding-left: 0}
    .about_history li:nth-child(even) .img {width: 330px;
    margin: 2rem 1rem 0 1rem}
    .about_history li strong:before {left: 6rem}
    .about_history li strong:after {left: 8rem}
    .vision .items {float: none;
    width: 100%;
    min-height: auto;
    margin-right: 0}
    .vision .items:nth-child(1),
    .vision .items:nth-child(2),
    .vision .items:nth-child(3),
    .vision .items:nth-child(4) {left: 0;
    top: 0;
    width: 100%}
    .relsite li {float: none;
    width: 100%;
    padding: 1rem 1rem;
    height: auto}
    .relsite li span {width: 11rem}
    .filewrap li {width: 100%}
    .dataview li {float: none;
    width: 100%;
    height: auto}
    .place_select li {width: 33.33333%}
    .arch_wrap .list {float: none;
    width: 100%;
    padding-right: 0}
    .arch_wrap .info {float: none;
    width: 100%}
    .tab_1depth ul li a { 
    line-height: 45px;
    font-size:1.8rem;
    padding: 0 1rem}
    .skydokdo.list3d ul li {width: 100%;
    margin: 0 0 2rem 0}
    .about_history li strong:before, .about_history li strong:after {display: none;}
}
@media(max-width:640px) {
    #subvisual .txtwrap h2 {font-size: 1.5rem}
    #location {display: none}
    #location .lnb .home {width: 2.3rem}
    #location .lnb .submenu>button {padding: 0 .4rem;
    font-size: 1.6rem}
    #location .lnb .submenu>button:after {right: .35rem}
    .introbox2 {max-height: 16rem}
    .history .eastisland ul {margin-top: 6rem;}
    .history .westisland ul {margin-top: 51rem;}
    /*.history .eastisland li strong {font-size: 1.1rem;
    margin-right: 5rem}
    .history .eastisland li span {margin-right: 5rem}
    .history .westisland li strong {font-size: 1.1rem;
    margin-left: 4.5rem}
    .history .westisland li span {margin-left: 4.5rem}*/
    .photographer .writerlist .items {margin: 1rem 1rem 1rem 0}
    .photographer .writerlist .items a .imgbox {width: 12.65rem;height: 8.05rem}
    .photographer .writerlist .items a .imgbox.col {width: 10.05rem;height: 12.65rem}
    .photographer .writerlist .items:nth-child(4) {margin-left: 0}
    .photographer .writerlist .items:nth-child(odd) {padding-top: 0}
    .slider_author .thum {height: 23.7rem;width: 100%;background-color: #fff}
    /*.form_input,.form_select {display: block;width: calc(100% - 3rem);margin-top: .5rem}
    .form_input>input,
    .form_date>input,
    .form_select>select {width: 100%}
    .boardinfo {margin-top: 1rem}
    .boardinfo.patent strong {display: block}*/
    .slider_author {width: 24rem}
    .slider_author .swiper-container .swiper-slide {height: 19rem;line-height: 19rem}
    .slider_author .swiper-container .swiper-slide:nth-child(odd) {height: 30.35rem;line-height: 30.35rem}
    .board_view .prevnex li {padding: .75rem 0}
    .board_view .prevnex li span {padding-right: 2rem;margin-right: .5rem}
    .board_view .prevnex li span:after {margin-left: .5rem}
    .relsite li dl dd {display: none}
    .undermov ul {margin: 0}
    .undermov li {float: none;width: 100%;margin: 0;margin-bottom: 3.6rem} 
    .about_history26 .his_list> li:nth-child(even) .img {margin: 0 0;}
    .about_history26 .his_list> li  {float: none;width: 100%;text-align: left;min-height:auto;margin-top: 5rem;}
    .about_history26 .his_list> li:nth-child(even)  {display: block;width: 100%; text-align: left;padding-left: 0;margin-top: 4rem;}
    .about_history26 .his_list> li strong:before {right: auto;left: 11rem;}
    .about_history26 .his_list> li strong:after {right: auto;left: 13rem;}
    [class^="hisgoal0"] {margin-bottom: 0;}
}
@media(max-width:500px) {
    .dokdovr ul {margin: 0}
    .dokdovr li {float: none;width: 100%;margin: 0;margin-bottom: 3.6rem}
}
@media(max-width:480px) {
    .introbox2 {max-height: 13rem}
    .enterwrap .applystep .items li span {width:10rem;height:10rem;background-size: 40%}
    .enterwrap .applystep .items {margin-left: 1rem}
    .photographer .writerlist .items {margin: 1rem .5rem 1rem 0}
    .slider_author {width: 18rem}
    .slider_author .swiper-container .swiper-slide {height: 14.25rem;line-height: 14.25rem}
    .slider_author .swiper-container .swiper-slide:nth-child(odd) {height: 22.75rem;line-height: 22.75rem}
    .board_view .prevnex li span {display: block}
    .board_view .prevnex li span {border-right: 0}
    a.filedown {display: block}
    .history .imgstone>div {width: 15rem}
    .satisf-inner>div>article.icon1:before,
    .satisf-inner>div>article.icon2:before {display: none}
    .satisf-inner>div h5,
    .satisf-inner ul,
    .inputxt {padding-left: 0}
    .inputxt>input[type='text'] {width: calc(100% - 3rem)}
    .userguide {padding-left: 0}
    .privacy:before,    .userguide:before {display: none}
    .thumlist ul li {width: 100%;margin: 0 0% 4.85% 0}
    .thumlist ul li:nth-child(3n) {margin-right: 0}
    .thumlist ul li:nth-child(2n) {margin-right: 0}
    .thumarch ul li {width: calc(100% - 2rem);margin: 0 2rem 2rem 0}
    .thumarch ul li:nth-child(3n) {margin-right: 0}
    .thumarch ul li:nth-child(2n) {margin-right: 0}
    .animatelist .ani_slide .move ul li a span {font-size: 1.6rem}
    .place_select li {width: 50%}
    .modalwrap .modalpopup .container .heading h1 {padding-top: 1.4rem}
    .relsite li dl {display: block}
    .relsite li span,.relsite li dt {width: 100%;text-align: center}
    .relsite li dt {padding-top: .5rem}
    /* .archive_list li {padding: 1rem 0} */
    .skydokdo ul li {width: 100%;margin: 0 0 2rem 0}
    .skydokdo.list3d .desc a {position: relative;top: 0;right: 0} 
    .hsplan01::before, .hsplan02::before, .hsplan03::before, .hsplan04::before {width: calc(100% - 5.5rem);}
}