@import url(https://use.fontawesome.com/releases/v5.15.2/css/all.css);
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff');
@font-face {font-family: 'GmarketSansBold'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff'); font-weight: normal; font-style: normal;}
@font-face {font-family: 'GmarketSansLight'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff'); font-weight: normal; font-style: normal;}
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
@charset "utf-8";

/* Reset CSS  */
html { height: 100%; overflow-y:scroll;}
body { font-size: 13px; color:#000;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, blockquote, th, td, p { margin: 0px; padding:0px;  list-style:none;  font-family:"Noto Sans KR", sans-serif;}
fieldset{ border: 0px; }
a{font-style:normal; text-decoration:none; color:#000;}
p {word-break: keep-all;}
hr, legend {height: 0; left: -5000px; line-height: 0; overflow-x: hidden; overflow-y: hidden; position: absolute; visibility: hidden;width: 0;}
caption {font-size: 0; height: 0; line-height: 0; visibility: hidden; width: 0;}
* {-webkit-text-size-adjust:none;}
* { margin:0; padding:0; border:0; outline:0;  }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; }
img, video { max-width:100%; border:0; height:auto; vertical-align:top; }
table { border-collapse:collapse; border-spacing:0; border: 0px solid #E5E5E5; }
input, select { vertical-align:middle; }
label { cursor:pointer; }
.blind,legend,hr,caption { display:block; overflow:hidden; position:absolute; top:0; left:-1000em; }
i,em,address { font-style:normal; font-weight:normal; }
td,th {vertical-align: middle;line-height: 1.6;}
td strong {font-weight: 100;	font-size: 5px;vertical-align: bottom;}
a:hover{text-decoration:none;}
ul:after{content:""; display:block; clear:both;}

.container { max-width: 1410px; width:100%; margin: 0 auto; position: relative; box-sizing: border-box; padding:0 15px;}
.container:after {content: ""; display: block; clear: both;}

/*formmail*/
#select-form{border:1px solid #ddd; width:100%; padding:15px 10px; font-size:15px}
.fields{position:relative; margin-top:30px; border-top:1px solid #ddd;}
.fields li{display:flex;border-bottom:1px solid #ddd;  align-items:center; padding:15px;}
.fields .lbl{width:200px;font-size:15px; cursor:text}
.fields .desc{width:100%;}
.fields .input{border:1px solid #ddd; padding:15px 10px; box-sizing:border-box; width:100%}
.fields .input.full{width:100%}
.fields .btn-group{margin-top:34px; text-align:center}
.fields .btn-group span{font-size:16px; color:#999;}
.fields .btn-group a{font-size:16px; color:#000; font-weight:bold;}
.fields .btn-group a:hover{text-decoration:underline}
input[id="agree-check"] + label {display: inline-block; width: 20px; height: 20px; border: 1px solid #bbb; cursor: pointer;margin: 0 4px 4px 0;}
input[id="agree-check"]:checked + label {border-color:#0b4ea2; background:url('../img/agree_check.png') no-repeat center center;}
input[id="agree-check"] {display: none;}
.fields .btn-submit{background:#0b4ea2; color:#fff; font-size:16px; font-weight:bold; padding: 15px 47px; border:none; outline:none; margin-top:35px;}

/* main-page-anchor */
.main-page-anchor {position: fixed;right: 40px;top: 40%;z-index: 30;}
.main-page-anchor li{text-align: center; margin-bottom: 20px;}
.main-page-anchor a {position: relative;width: 7px;height: 7px;border-radius: 100px;background: transparent;border: 1px solid #ccc; padding: 4px;display: inline-block;margin-bottom: 3px;text-align: center;transition: 0.3s;}
.main-page-anchor a p {position: absolute; top: -5px; left: -125px;width: 110px; text-align: right; color: #999;}
.main-page-anchor li.active>a {background: #333333; border: none;width: 13px;height: 13px;}
.main-page-anchor li.active>a p {color: #333;}

/*header*/
#header {position: fixed; width: 100%; background: transparent; z-index: 99; transition: all 0.3s;}
#header:hover {background: #fff; box-shadow: 0 5px 20px 0 rgba(0 0 0 / 10%);}
#header .head_container {padding: 20px;}
#header .logo { display: inline-block; }
#header .logo a img {width: 80%;}
#header .head_rg {float: right;}
#header .gnb {float: left; padding-top: 10px;}
#header .gnb ul li {float: left; font-size: 21px; font-weight: 600; *margin-right: 50px; font-family: 'Lato', sans-serif;}
#header .gnb ul li:nth-child(4) .lnb {padding-left: 0;}
#header .gnb > ul > li {margin-right: 50px;}
#header .gnb > ul > li:hover > a {color: #f5b71a;}
#header .gnb > ul > li > a {padding-bottom: 15px;}
#header .gnb ul li a {color: #333; display: block;}
#header .gnb .lnb {display: none; *position: absolute; top: 90px; padding: 25px 0; width: 61px;}
#header .gnb > ul > li ul li {float: none; padding-bottom: 20px;}
#header .gnb > ul > li ul li a {font-size: 17px; white-space: nowrap;}
#header .gnb:hover .lnb {display: block;}
#header .gnb > ul > li ul:hover {display: block;}
#header .gnb ul li > a {transition: all 0.2s;}
#header .gnb .lnb:hover:before {content: ""; background: #f5b71a; width: 110px; height: 3px; display: block; position: absolute; top: 80px;}
/* #header .lnb:hover::before {content: ""; display: block; width: auto; height: 3px; background: red;} */
#header .lnb {}
#header .lang {float: right; margin-top: 10px;}
#header .lang a {color: #333; border: 1px solid #333; border-radius: 25px; padding: 5px 10px; transition: all 0.3s;}
#header .lang a:first-child {display: block;}
#header .lang a:last-child {position: absolute; top: 65px; opacity: 0; background: #fff; transform: translateY(-100%); transition: all 0.3s;}
#header .lang a:hover {background: #333; color: #fff; display: block;}
#header .lang:hover .lang_last {transform: translateY(0); opacity: 1;}
.sub_header {background: #fff!important;}

/*mobile*/
#header .menu_btn {display: none; position: absolute; top: 27px; right: 5px; width: 40px; height: 25px; z-index: 9;}
#header .menu_btn span {width: 30px; height: 3px; background: #333; display: block; position: absolute; transition: all 0.4s;}
#header .menu_btn span:nth-child(1) {top: 0;}
#header .menu_btn span:nth-child(2) {top: 10px;}
#header .menu_btn span:nth-child(3) {bottom: 0;}
#header .menu_btn.active span:nth-child(1) {-webkit-transform: translateY(14px) rotate(-45deg); transform: translateY(14px) rotate(-45deg);}
#header .menu_btn.active span:nth-of-type(2) {opacity: 0;}
#header .menu_btn.active span:nth-of-type(3) {-webkit-transform: translateY(-8px) rotate(45deg);transform: translateY(-8px) rotate(45deg);}


.menu {width: 240px; height: 100%; position: fixed; top: 0; right: 0; background: #fff; border-radius: 50px 0 0 50px; display: none; box-shadow: 0 0 15px 5px #ddd;}
.menu .menu_wrap {width: 100%; height: 100%;}
.menu .close {font-size: 25px; position: absolute; top: 15px; right: 25px;}
#header .menu .gnb {float: none!important; padding-top: 0;}
.menu .gnb > ul > li {width: 100%; margin-right: 0!important; border-top: 1px solid #ddd; padding-bottom: 5px;}
.menu .gnb > ul > li:first-child {border-top: none;}
#header .menu .gnb .lnb {padding: 0px; display: block;}
#header .menu .gnb > ul > li > a {color: #f6c23c; font-size: 15px; padding: 20px 20px 10px;}
#header .menu .gnb > ul > li ul li {padding-bottom: 0;}
#header .menu .gnb > ul > li ul li a {font-size: 14px; margin-bottom: 5px; padding: 0 20px;}


/*main*/
#fullpage section {width: 100%; overflow: hidden;}
#fullpage section .left {width: 50%; float: left;}
#fullpage section .right {width: 50%; float: right;}
.container {padding-top: 150px;}
.main_title {position: relative;}
.main_title h1 {font-family: 'GmarketSansBold'; font-size: 55px;}
.main_title p {font-size: 20px; font-weight: 300; margin-top: 10px;}
.title_deco {position: absolute; top: -20px; left: -55px;}
#fullpage .left .main_title h1 {float: left;}
#fullpage .left .main_title p {display: inline-block; margin: 15px 0 0 40px;}
#fullpage .right .main_title h1 {float: left;}
#fullpage .right .main_title p {display: inline-block; margin: 20px 0 0 40px;}
#page01 .swiper {height: 100%; width: 100%;}
#page01 .swiper-slide {opacity: 1; transition: all 0.3s;}
/* #page01 .swiper-slide .slide_con {position: absolute; top: 15%; right: 10%;animation: icon 2s infinite;}
@keyframes icon {
  0% {
    transform: translateY(0);
  }
  50%{
    transform: translateY(-5px);
  }
  100%{
    transform: translateY(0);
  }
} */
#page01 .swiper-slide.active {opacity: 0.5;}
#page01 .slide02 .slide_con {width: 45%; right: 7%; top: 15%;}
#page01 .slide01 .slide_con img {width: 90%;}
#page01 .page01_title {opacity: 0; position: absolute; bottom: 40%; left: 12%; z-index: 9; transition: all 0.8s;}
#page01 .swiper-slide-active .page01_title {opacity: 1; bottom: 35%;}
#page01 .swiper-slide .ms_back {transform: scale(1.1); width: 100%; height: 100%; transition: all 5s;}
#page01 .swiper-slide-active .ms_back {transform: scale(1);}
#page01 .page01_text {letter-spacing: -2px;}
#page01 .page01_text span {display: block; font-size: 18px; margin-bottom: 15px; letter-spacing: 0;}
#page01 .page01_text img {width: 80%; margin-top: 10px;}
#page01 .page01_text h3 {font-family: 'GmarketSansBold';font-size: 45px; font-weight: 500; margin-top: 70px;}
#page01 .page01_text p {letter-spacing: 0px; font-size: 20px; margin: 40px 0; opacity: 0.5; line-height: 1.5;}
#page01 .page_nat p {float: left; margin-right: 10px;}
#page01 .page_nat p:first-child {font-size: 26px; margin: 10px 10px 0 0;}
#page01 .page01_more a {font-family: 'GmarketSansLight'; background: #114672; color: #fff; width: 120px; height: 120px; border-radius: 100px; padding: 52px 36px; position: absolute; bottom: 0; left: 5%;}
#page01 .slide02 .page01_title {color: #333;}
#page01 .slide_bottom {position: relative; bottom: 33%;}
#page01 .m_slide_btn {position: absolute; left: 400px; top: 71%;}
#page01 .swiper-button-next {left: 40px;}
#page01 .swiper-button-prev, .swiper-button-next {color: #333; width: 60px; height: 20px; overflow:hidden;}
#page01 .swiper-button-prev:after, .swiper-button-next:after {display: none;}
#page01 .swiper-pagination-fraction {width: auto; left: 13.2%; bottom: 28%; font-size: 14px;}
#page01 .swiper-pagination-fraction span:last-child {padding-left: 170px;}

#page01 .swiper-btns span {font-family: 'GmarketSansBold'; display: block;z-index: 99; position: absolute; bottom: 28.7%; border-radius: 40px; border: 1px solid #333; padding: 3px 5px; width: 25px; height: 25px; cursor: pointer; font-weight: 800; text-align: center; font-size: 15px;}
#page01 .swiper-btns span.active {display: none;}
#page01 .swiper-btns {left: 500px; position: absolute; bottom: 32.3%;}
#page01 .swiper-btns .start {bottom: 28.9%;}
#page01 .swiper-btns .stop {border: none;}
#page01 .swiper-pagination2 {position: absolute; left: 14.5%; top: 71%; background: rgba(255 255 255 / 10%); height: 2px; z-index: 100; width: 130px;}

/*progress*/
#page01 .swiper-pagination{position:relative; font-size:0; text-align: left;}
#page01 .pagination-box{position: absolute; width:100%; left:11%; bottom:29%;}
#page01 .pagination-box > div{float:left;}
#page01 .pagination-box::after{content:""; display:block; clear:both;}

#page01 .pagination-left {width:54px;}
#page01 .pagination-left .swiper-pagination-bullet {font-family: 'Lato'; background: transparent; display:none; font-size:17px; color:#333; text-align: center; width: auto; height: auto;}
#page01 .pagination-left .swiper-pagination-bullet-active {display:block;}
#page01 .pagination-left .swiper-pagination-bullet-active::after{content:"03"; position:absolute; top: 0; right:-140px; font-size:17px;}

#page01 .pagination-right{  margin:10px 0 0 0; background:rgba(255, 255, 255, 0.3); width:100px}
#page01 .pagination-right .swiper-pagination-bullet {width: 0; height: 2px; display: inline-block; border-radius: 0; background:#333; left:0; opacity: 1; }
#page01 .pagination-right .swiper-pagination-bullet-active{-webkit-animation: sl-loading 6.5s ease-in infinite; animation: sl-loading ease-in 6.5s infinite;}

@-webkit-keyframes sl-loading {
  0% {width:0;}
  100% {width:100%;}
}

@keyframes sl-loading {
  0% {width:0;}
  100% {width:100%;}
}



#page02 {background: url(../img/main2_bg.png) no-repeat center/cover;}
#page02 .main_title p {font-family: 'Pretendard';}
#page02 .PIP_icon {margin-top: 50px;}
#page02 .PIP_icon ul {display: flex; justify-content: space-between;}
#page02 .PIP_icon ul li {transition: all 0.3s;}
#page02 .PIP_icon ul li a > div {position: absolute; border: 1px solid #f5b71a; background: #fff; padding: 60px 30px; border-radius: 150px; height: 60vh; width: 280px; text-align: center;}
#page02 .PIP_icon ul li a > div img {width: 60%;}
#page02 .PIP_icon .pip_icon02 {display: none; background: #f5b71a; box-shadow: 3px 3px 10px 2px #ddd; transition: all 0.3s;}
#page02 .PIP_icon ul li:hover .pip_icon02 {display: block;}
#page02 .PIP_icon ul li a div h3 {font-family: 'Pretendard'; font-size: 25px; margin: 20px 0;}
#page02 .pip_icon01 p {font-family: 'Pretendard'; font-size: 22px;}
#page02 .PIP_icon ul li .icon_down {margin-top: 30px;}
#page02 .pip_icon02 p {font-size: 15px; text-align: left;}
#page02 .PIP_icon ul li:last-child .pip_icon02 p {text-align: center;}

#page03 {background: url(../img/main3_bg.png) no-repeat center/cover; background-color: #f4f6f8;}
#page03 .container {padding-top: 250px;}
#page03 .content {margin-top: 50px;}
#page03 .content ul li {float: left; margin-bottom: 20px; background: #fff;}
#page03 .content > ul > li {width: 100%; margin-bottom: 25px;}
#page03 .content .pat_sub {display: flex; justify-content: space-between;}
#page03 .content .pat_sub:after {display: none;}
#page03 .content .pat_sub li {width: 11vw; height: 5vw; background: #fff; overflow: hidden; position: relative;}
#page03 .content .pat_bg {display: none; background: rgba(42, 121, 186, 0.8); position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#page03 .content .pat_bg img {position: absolute; left: 50%; transform: translateX(-50%); top: 25%;}
#page03 .content .pat_sub li:hover .pat_bg {display: block;}

#page04 {background: url(../img/main4_bg.png) no-repeat center/cover;}
#page04 .main_title h1 {color: #fff; float: left;}
#page04 .main_title p {color: #fff; display: inline-block; margin: 15px 0 0 40px;}
#page04 .content {margin-top: 80px;}
#page04 .content ul {display: flex; justify-content: space-between;}
#page04 .content ul:after {display: none;}
#page04 .content ul li {background: #fff; margin-right: 25px; padding: 35px 20px 55px; border-top: 10px solid #1871b6;}
#page04 .content ul li:last-child {margin-right: 0;}
#page04 .content ul li span {color: #777; font-size: 15px; display: block; line-height: 22px;}
#page04 .content .new_icon {display: none;}
#page04 .content ul li h3 {font-size: 23px; margin: 10px 0;}
#page04 .content ul li p {font-size: 15px; line-height: 22px; margin-bottom: 15px; font-weight: 400;}
#page04 .content ul li a {font-size: 20px; line-height: 32px;}
#page04 .content ul li a:after {display: block; width: 5vw; height: 1px; background: #333; margin: 15px 0; content: "";}
#page04 .more {position: absolute; left: 50%; transform: translate(-50%); bottom: -25%;}
#page04 .more a {border: 1px solid #fff; padding: 18px 95px; color: #fff; transition: all 0.3s;}
#page04 .more a:hover {background: rgba(255,255,255,0.8); color: #333; border: none;}

#page05 {overflow: hidden;}
#page05 .container {height: 100%; max-width: 1600px;}
#page05 .left {height: 100%;}
#page05 .left .content {height: 100%; position: relative;}
#page05 .left .content .page05_le_bg {background: url(../img/main5_img.png) no-repeat center/cover; position: absolute; left: -95px; bottom: 0; width: 100%; height: 33vw;}
#page05 .left .content .page05_le_bg .more a {background: #fff; padding: 5px; display: inline-block; position: absolute; right: 0; width: 50px; height: 50px; text-align: center; font-size: 24px; color: #b1a8a8;}
#page05 .left .more_1 {position: absolute; bottom: 10%; left: 5%; width: 90%;}
#page05 .left .more_1 .text {position: absolute; color: #fff; top: 35%; left: 12%;}
#page05 .left .more_1 .text h3 {font-size: 35px;}
#page05 .left .more_1 .text p {font-size: 20px; margin-top: 10px;}
#page05 .right {position: relative; height: 100%;}
#page05 .right .history {height: 100%; position: relative;}
#page05 .right .history img {position: absolute; left: 0; bottom: 6%;}

#page06 {background-color: #f9f9f9;}
#page06 .left {width: 60%!important;}
#page06 .left .container {padding-top: 10vw;}
#page06 .left .main_title {width: 65%; margin: 0 auto;}
#page06 .left .page06_con {margin: 0 auto; width: 65%; margin-top: 70px;}
#page06 .left .menu_an ul {display: flex; gap: 4vw; }
#page06 .left .menu_an ul::after {display: none;}
#page06 .left .menu_an ul li { float: left;}
#page06 .left .menu_an ul li a {padding: 1vw 3.4vw; border: 1px solid #ddd; white-space: nowrap;}
#page06 .left .menu_an ul li a:hover {background: #136ab2; color: #fff; border: none;}
#page06 .left .menu_an ul li a.active {background: #136ab2; color: #fff; border: none;}
#page06 .left .info_wrap {position: relative;}
#page06 .left .info_con {margin-top: 70px; position: absolute;}
#page06 .left .info_con ul {}
#page06 .left .info_con ul li {padding: 20px; text-align: center; float: left; width: 33.333%; position: relative;}
#page06 .left .info_con ul li:after {content: ""; width: 1px; height: 250px; position: absolute; top: 0; right: 0; margin-left: 20px; background: #ddd;}
#page06 .left .info_con ul li:last-child {border-right: none;}
#page06 .left .info_con ul li:last-child:after {display: none;}
#page06 .left .info_con h3 {margin: 35px 0 15px;; font-size: 22px; font-weight: 500;}
#page06 .left .info_con p {font-size: 16px;}
#page06 .right {width: 40%!important; height: 100%; position: relative;}
#page06 .right > div {position: absolute; top: 0; right: 0; width: 100%; height: 100%;}
#page06 .right > div >iframe {padding: 65px 20px; margin-top: 45px;}


/*sub page*/
.visual {height: 460px; transition: all 0.3s;overflow: hidden; }
.visual .container {padding-top: 90px; display: flex; justify-content: center; flex-direction: column;}
.visual .sub_bg {height: 100%; animation: icon 5s; display: flex; justify-content: center; flex-direction: column;}
@keyframes icon {
  0% {
    transform: scale(1.05);
  }
  100%{
    transform: scale(1);
  }
}
.visual .bg1 {background-image: url(../img/sub_banner_1.png);}
.visual .bg2 {background-image: url(../img/sub_banner_2.png);}
.visual .bg3 {background-image: url(../img/sub_banner_3.png);}
.visual .bg4 {background-image: url(../img/sub_banner_4.png);}
.visual .bg5 {background-image: url(../img/sub_banner_5.png);}
.visual .bg6 {background-image: url(../img/sub_banner_6.png);}
.visual-wrap {text-align: center; color: #fff;}
.visual-wrap .visual-title {font-size: 65px;}
.visual-wrap .visual-text {font-size: 18px; font-weight: 100;}
.route {font-size: 15px;}
.bbs_container {max-width: 1400px; margin: 0 auto; padding: 100px 0px; box-sizing: border-box; position: relative;}
.sub_con:last-child {margin-bottom: 200px;}
.sub_title {margin-bottom: 100px;}
.sub_title h1 {font-size: 48px; letter-spacing: -4px;}
.sub_title h1 span {color: #136ab2;}
.sub_title p {font-size: 18px; margin: 10px 0;}
.con01 .container {padding-top: 0;}

/*sub010101*/
#sub0101_1 .swiper-container {overflow: hidden; width: 100%; height: 100%;}
#sub0101_1 .swiper-button-prev, #sub0101_1 .swiper-button-next {color: #000;}
#sub0101_1 .swiper-slide-duplicate, #sub0101_1 .swiper-slide { background-position: center center; background-size: cover; text-align: center; font-size: 18px; background: #fff; display: flex; flex-flow: column nowrap; justify-content: center; align-items: center;}
#sub0101_1 .description, #sub0101_1 .title {display: block; opacity: 0; transition: 0.5s ease 0.5s;}
#sub0101_1 .description.active {opacity: 1; font-size: 16px; color: #777; transition: opacity 0.5s ease 0.75s;}
#sub0101_1 .title.active {opacity: 1; margin-bottom: 0.5rem; font-size: 24px; color: #000; transition: opacity 0.5s ease 0.5s;}
#sub0101_1 .swiper-progress-bar {position: relative; width: 100%; display: block; zz-index: 1; height: 2px;}
#sub0101_1 .swiper-progress-bar .slide_progress-bar {position: absolute; height: 2px; background: rgba(0,0,0,0.3); width: auto; clear: both; opacity: 0; bottom: 45px; left: 0; right: 0;}
#sub0101_1 .swiper-progress-bar .slide_progress-bar:after {position: absolute; top: 0; left: 0; background: #000; height: 100%; width: 0; content: ""; transition: 0.1s width linear;}
#sub0101_1 .swiper-progress-bar .slide_progress-bar.active {opacity: 1;}
#sub0101_1 .swiper-progress-bar .slide_progress-bar::after.animate {transition: width linear; transition-delay: unset; width: 100%; transition-duration: 5s;}

/*sub01_01*/
/* #sub0101 .container {padding-top: 100px;}
.sub_con {padding-top: 200px;}
#sub0101 .con01 {padding-top: 100px;}
#sub0101 .con01 {text-align: center;}
#sub0101 .con01 img {width: 150px;}
#sub0101 .con01 h3 {font-size: 40px; color: #f7b135; margin: 10px 0 30px;}
#sub0101 .con01 p {width: 55%; margin: 0 auto; font-size: 18px;}

#sub0101 .con03 {margin-bottom: 300px!important;}
#sub0101 .con03 .con03_wrap .sub0101_con03 {background: url(../img/sub0101_2.png) no-repeat center/cover; background-attachment: fixed; position: relative;height: 300px; color: #fff; text-align: center;}
#sub0101 .con03 .con03_wrap h3 {font-size: 30px;}
#sub0101 .con03 .con03_wrap p {font-size: 30px; margin: 10px 0;}
#sub0101 .con03 .con03_wrap .con03_bg {position: absolute; top: -45%;}
#sub0101 .con03 .con03_1 {position: absolute;left: 25%; margin-top: 60px;} */

#sub0101 .con01 {margin-top: 100px;}
#sub0101 .con01 .container {background: url(../img/about_us.jpg) no-repeat center/cover; padding: 150px 100px;}
#sub0101 .con01 p {font-size: 20px; font-weight: 400; margin-bottom: 25px; opacity: 0.5;}
#sub0101 .con01 h1 {font-size: 60px; font-weight: 900;}
#sub0101 .con02 .container > div {width: 45%; line-height: 3em;}
#sub0101 .con02 .left {float: left;}
#sub0101 .con02 .right {float: right;}
#sub0101 .con02 .container {padding: 50px 0; }
#sub0101 .con02 .container > div p {font-size: 18px; word-break: keep-all; margin-bottom: 20px;}
#sub0101 .con02 .deco::before {content: "✔"; display: inline-block; color: #136ab2; width: 30px;}

#sub0102 .sub_con {padding-top: 100px;}
#sub0102 .con02 {padding-top: 0;}
#sub0102 .con02 .container {padding: 0;}
#sub0102 .con02 .pic_lt {margin-top: 150px;}
#sub0102 h2 a {font-size: 40px; color: #333; margin-bottom: 60px;}
#sub0102 h2 a::before {content: ""; display: block; background: #f5b71a; width: 20px; height: 20px; position: absolute; top: -20px; left: -30px; border-radius: 50px;}

#sub0103 .con01 h3:before {content: ""; display: block; background: #f5b71a; width: 20px; height: 20px; position: absolute; top: 10%; left: -2%; border-radius: 50px;}
#sub0103 .con01 h3 {font-size: 40px; color: #333; margin: 30px 0;}
#sub0103 .hs_container {max-width: 1400px; margin: 120px auto; position: relative;}
#sub0103 .hs_container::after {content: ""; display: block; width: 1px; height: 100%; background: #ebebeb; position: absolute; top: -15px; left: 170px;}
#sub0103 .hs_container > div {display: flex; margin-bottom: 50px;}
#sub0103 .hs_container h4 {font-size: 30px;}
#sub0103 .hs_container .hs_con {margin-left: 150px; position: relative;}
#sub0103 .hs_con ul li {display: flex; margin-bottom: 20px;}
#sub0103 .hs_con ul li h5 {font-size: 20px;}
#sub0103 .hs_con .hs_txt {margin-left: 20px;}
#sub0103 .hs_con ul li p {display: block; font-size: 16px; margin-bottom: 15px;}
#sub0103 .hs_con ul li p a {background: rgba(245,183,26,0.3);}
#sub0103 .hs_con ul li p a span {border-radius: 20px; border: 1px solid #333; margin-left: 20px; padding: 5px 15px; font-size: 10px;}
#sub0103 .hs_con::before {content: ""; display: block; width: 25px; height: 25px; background-color: #f5b71a; border: 8px solid #fff; border-radius: 50%; position: absolute; left: -90px; top: 0; z-index: 99; box-shadow: 0px 5px 10px 0px rgb(0 0 0 / 15%);}

#sub0105 .container {padding-top: 100px;}
#sub0105 .sub_con {margin-bottom: 400px; padding-top: 0;}
#sub0105 h3 {font-size: 22px; margin-bottom: 80px;}
#sub0105 h3:before {content: ""; display: block; background: #f5b71a; width: 15px; height: 15px; position: absolute; top: 11%; left: -1%; border-radius: 50px;}
#sub0105 h3:after {content: ""; background: #333; width: 200px; height: 1px; display: inline-block; margin-left: 10px;}
#sub0105 .menu_an {width: 30%;}
#sub0105 .menu_an ul {display: flex; justify-content: space-between;}
#sub0105 .menu_an ul::after {display: none;}
#sub0105 .menu_an ul li { float: left;}
#sub0105 .menu_an ul li a {padding: 1vw 3.4vw; border: 1px solid #ddd;}
#sub0105 .menu_an ul li a:hover {background: #136ab2; color: #fff; border: none;}
#sub0105 .menu_an ul li a.active {background: #136ab2; color: #fff; border: none;}
#sub0105 .map {position: relative; width: 100%; height: 30vw; margin-top: 50px;}
#sub0105 .map > div {position: absolute; top: 0; right: 0; width: 100%; height: 100%;}
#sub0105 .map table {width: 100%;}
#sub0105 .map table tr {border-bottom: 1px solid #ddd;}
#sub0105 .map table th {width: 20%; padding: 20px; border-bottom: 1px solid #333;}
#sub0105 .map table td {padding-left: 20px;}

#sub0201 {position: relative;}
#sub0201 .sub0201_scroll {display: none;}
#sub0201 .con01 {padding: 100px 0;}
#sub0201 .con01 .container {padding-top: 0;}
#sub0201 .pro_button {position: absolute; width: 100%; height: 100%; left: 2%;}
#sub0201 .pro_btn {position: absolute; width: 10%; height: 6%; text-indent: -10000px;}
#sub0201 .arbm-101 {top: 30%;}
#sub0201 .arbm-201 {top: 49%;}
#sub0201 .arbm-301 {top: 68%;}

/*popup*/
.mobile {display: none;}
.pro_popup {position: absolute; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); }
#sub0202 .close {width: 70px; opacity: 0.7;margin: 20px; cursor: pointer; position: absolute; top: 2%; right: 6%; z-index: 9; padding: 25px;}
.popup {position: absolute; left: 50%; transform: translateX(-50%); background: #fff; top: 11%; width: 85%; height: 80%; overflow-y: auto; border-top: 5px solid #136ab2; padding: 15px;}
.tap ul {}
.tap .dis_flex {display: flex; justify-content: space-between;}
.tap ul::after {display: none;}
.tap ul li {border: 1px solid #136ab2; width: 24%; text-align: center;}
.tap ul li a {padding: 20px 7vw; display: block;}
.tap ul li a.active {background: #136ab2; color: #fff;}
.tap ul li a:hover {background: #136ab2; color: #fff;}
.sub_con td {font-size: 16px;}
#sub0201 #sub0202 .sub_con {padding-top: 0;}
#sub0201 #sub0202 .sub_con:first-child {padding-top: 100px;}

.sub_con {padding: 0 10px;}
.sub_con .pro_title p {position: relative; margin-left: 50px;}
.sub_con .pro_title p::before {content: ""; display: inline-block; margin-right: 20px; width: 1px; height: 50px; background: #333; position: absolute; left: -50px;}
.sub_con td {font-size: 16px;}

#sub0202 .container {padding: 100px 0 40px;}
#sub0202 .con01 h3 {font-size: 48px; color: #136ab2;}
#sub0202 .con01 table {width: 100%; text-align: center; margin-top: 30px;}
#sub0202 .con01 table tr {}
#sub0202 .con01 table th {background: #a7c7e2; color: #4e4e4e; padding: 10px 0; font-size: 18px; border-right: 1px solid #959595; border-top: 1px solid #959595;}
#sub0202 .con01 table td {padding: 20px 0; border-right: 1px solid #959595; border-bottom: 1px solid #959595;}
#sub0202 .con01 table th:last-child {border-right: none;}
#sub0202 .con01 table td:last-child {border-right: none;}
#sub0202 .sub_con .pro_title {display: flex; justify-content: space-evenly;}
#sub0202 .sub_con .pro_title h4 {display: inline-block; font-size: 30px; position: relative;}
#sub0202 .sub_con .pro_title h4::before {content: ""; display: block; background: #f5b71a; width: 20px; height: 20px; position: absolute; top: -10px; left: -25px; border-radius: 50px;}
#sub0202 .sub_con .pro_title .line {display: none; content: ""; width: 1px; height: 50px; background: #333; margin-left: 50px;}
#sub0202 .sub_con .pro_title p {display: inline-block; width: 80%; font-size: 16px; word-break: keep-all; text-align: justify;}
#sub0202 .sub_con .pro_title p span {font-style: italic;}
#sub0202 .sub_con .up_txt {font-style: normal;}
#sub0202 .sub_con .pro_img {text-align: center; margin-top: 60px;}
#sub0202 .sub_con .pro_img p {margin-top: 30px; color: #c3c3c3;}
#sub0202 .sub_con .pro_img p span {font-style: italic;}

#sub0202 .con01 {padding-top: 0;}
#sub0202 .sub_con h3 {font-size: 40px; color: #0f4d81; margin: 10px 0 30px;}

#sub0302 .sub_con h3 {font-size: 40px; color: #333; margin: 10px 0 30px; position: relative;}
#sub0302 .con01 h3::before {content: ""; display: block; background: #f5b71a; width: 20px; height: 20px; position: absolute; top: -10px; left: -25px; border-radius: 50px;}
#sub0302 .con01 .text {margin-top: 15px;}
#sub0302 .con01 .text p {color: #c1c1c1; line-height: 25px; font-weight: 300;}

#sub0401 {padding-bottom: 0;}
#sub0401 h3:before {content: ""; display: block; background: #f5b71a; width: 20px; height: 20px; position: absolute; top: -15px; left: -30px; border-radius: 50px;}
#sub0401 h3 {font-size: 40px; color: #333; margin: 100px 0 10px; position: relative;}

#sub0402 h3 {font-size: 40px; color: #333; margin: 100px 0 10px; position: relative;}
#sub0402 h3:before {content: ""; display: block; background: #f5b71a; width: 20px; height: 20px; position: absolute; top: -15px; left: -30px; border-radius: 50px;}

#sub0501 .sub_con:last-child {padding-bottom: 0px;}
#sub0501 .con02 .container {padding-top: 100px;}
#sub0501 .sub_con .title h3 {font-size: 40px; color: #333; margin: 10px 0 20px; position: relative;}
#sub0501 .sub_con .title h3::before {content: ""; display: block; background: #f5b71a; width: 20px; height: 20px; position: absolute; top: -10px; left: -25px; border-radius: 50px;}
#sub0501 .sub_con .title p {font-size: 20px;}
#sub0501 .sub_con .title p span {color: #f5b71a; font-weight: 600; font-size: 23px;}
#sub0501 .con01 .content {width: 90%; margin: 0 auto; margin-top: 100px;}
#sub0501 .con01 .content .sub0501_text {display: flex; justify-content: space-between;}
#sub0501 .con01 .content .left {width: 45%;}
#sub0501 .con01 .content .right {width: 45%;}
#sub0501 .con01 .content h4 {font-size: 25px; text-align: center; color: #136ab2;}
#sub0501 .con01 .content h4::after {content: ""; width: auto; height: 2px; background: #136ab2; display: block; margin: 20px 0;}
#sub0501 .con01 .content .text {margin-top: 20px;}
#sub0501 .con01 .content p {font-size: 16px; line-height: 26px; width: 60%; margin: 0 auto; word-break: keep-all; margin-top: 20px; text-align: center;}
#sub0501 .con02 a {text-align: center; width: 200px; padding: 20px 50px; position: absolute; left: 50%; transform: translateX(-50%); border: 1px solid #333; border-radius: 10px; transition: all 0.5s;}
#sub0501 .con02 a:hover {border-radius: 50px;}

#sub0502 h3 {font-size: 40px; color: #333; margin: 60px 0 0; position: relative;}
#sub0502 h3:before {content: ""; display: block; background: #f5b71a; width: 20px; height: 20px; position: absolute; top: -10px; left: -25px; border-radius: 50px;}
#sub0502 .title p {font-size: 20px; margin: 20px 0 100px;}
#sub0502 .title p span {color: #f5b71a; font-size: 23px; font-weight: 600;}
#sub0502 .step {width: 90%; margin: 0 auto;}

/*ESG*/
#ESG_btn {display: flex; justify-content: space-between;}
#ESG_btn:after {display: none;}
#ESG_btn li {width: 30%; text-align: center;}
#ESG_btn li a {border:1px solid #ddd; padding: 10px 0; border-radius: 50px; font-size: 20px; color: #ddd; width: 100%; display: block;}
#ESG_btn li a.active {background: #e7a600; border: 1px solid #e7a600; color: #fff;}

#sub0601 .sub_con {margin-bottom: 120px;}
#sub0601 .con01 {display: flex; justify-content: space-between; align-items: center;}
#sub0601 .con01 > div {width: 48%;}
#sub0601 .con01 p {font-size: 18px; margin-bottom: 20px; word-break: keep-all; font-weight: 300; line-height: 34px;}
#sub0601 .con01 p b {color: #e7a600; font-weight: 500;}
#sub0601 .con02 h3 {font-size: 28px; margin-bottom: 50px;}
#sub0601 .con02 ul {position: relative; padding-left: 20px;}
#sub0601 .con02 ul:before {position: absolute; left: 0; content: ""; width: 2px; height: 100%; background: #e7a600;}
#sub0601 .con02 ul li {margin-bottom: 40px;}
#sub0601 .con02 ul li b {font-size: 20px; margin-bottom: 20px; display: block; font-weight: 500;}
#sub0601 .con02 ul li p {font-size: 16px; font-weight: 300;}
#sub0601 .con03 ul li {width: 50%; float: left; margin-bottom: 50px;}
#sub0601 .con03 ul li b {font-size: 20px; margin-bottom: 20px; display: block;}
#sub0601 .con03 ul li p {font-size: 16px; margin-bottom: 5px; font-weight: 300;}
#sub0601 .con03 ul li p:before {content: ""; width: 6px; height: 6px; border-radius: 20px; background: #e7a600; display: inline-block; margin-right: 10px;}
#sub0601 .con03 .signature {text-align: right; font-size: 18px; margin-top: 50px;}
#sub0601 .con03 .signature img {width: 250px; margin-bottom: 15px}
#sub0601 .con03 .signature p {}
#sub0601 .con03 .signature span {display: block; color: #6b6b6b; margin: 15px 0 3px;}
#sub0601 .con03 .signature b {font-size: 24px;}

#sub0602 .sub_con .title {margin-bottom: 80px;}
#sub0602 .sub_con h3 {font-size: 40px; color: #333; margin: 10px 0 30px; position: relative;}
#sub0602 .sub_con h3:before {content: ""; background: #f5b71a; width: 20px; height: 20px; position: absolute; top: -10px; left: -25px; border-radius: 50px;}
#sub0602 .con01 {margin-bottom: 150px;}
#sub0602 .con01 .title p {font-size: 18px;}
#sub0602 .con01 .img_box {text-align: center;}
#sub0602 .con01 .text {font-size: 18px; text-align: center; margin-top: 50px; line-height: 36px; word-break: keep-all;}

#sub0603 h3:before {content: ""; display: block; background: #f5b71a; width: 20px; height: 20px; position: absolute; top: -15px; left: -30px; border-radius: 50px;}
#sub0603 h3 {font-size: 40px; color: #333; margin: 100px 0 10px; position: relative;}
#sub0603 p {font-size: 18px;}

/*footer*/
#footer {background: #1e1e1e; color: #a5a5a5; height: auto!important; clear:both;}
#footer .fp-tableCell{height: auto !important;}
#footer .up {padding: 35px;}
#footer .up .ft_logo {margin-bottom: 20px; opacity: 0.5;}
#footer .left {float: left;}
#footer .left p {margin: 5px 0; font-size: 15px;}
#footer .right {float: right; margin-bottom: 30px;}
#footer .right .gnb ul li {margin-bottom: 10px;}
#footer .right .gnb ul li a {color: #a5a5a5; font-size: 15px;}
#footer .right .gnb > ul > li > a {font-weight: bold;}
#footer .right .gnb > ul > li ul {margin-top: 10px;}
#footer .right .gnb > ul > li {float: left; margin-right: 60px; position: relative;}
#footer .right .gnb > ul > li:after {content: ""; position: absolute; top: 0; right: -30px; background: #3a3a3a; width: 1px; height: 175px; margin-left: 79px;}
#footer .right .gnb > ul > li:last-child::after {display: none;}
#footer .down {background: #131313; padding: 15px 35px; clear: both;}


@media (max-width: 1199px) {
  .only_pc {display: none;}
  #header .gnb .lnb:hover:before {display: none;}
  #header .menu .lang {position: absolute; right: 5px; bottom: 10px;}
  #header .menu .lang a:hover {display: inline-block;}
  #header .menu .lang a.active {background: #333; color: #fff;}
  #header .menu .lang a:first-child {display: inline-block;}
  #header .menu .lang a:last-child {position: sticky; opacity: 1;}
  .main-page-anchor {display: none;}
  #header:hover {background: transparent; box-shadow:  none;}
  #header .head_rg {display: none;}
  #header .menu_btn {display: block;}


  .container {padding-top: 90px; position: relative; height: 100%;}

  #page01 .swiper-btns {display: none;}
  #page01 .m_slide_btn {display: none;}

  #page01 .slide01 {background: url(../img/main_bg_3.png) no-repeat center/cover;}
  #page01 .slide02 {background: url(../img/main_bg_4.png) no-repeat center/cover;}
  #page01 .slide03 {background: url(../img/main_bg_6.png) no-repeat center/cover;}

  .main_title h1 {font-size: 4vw;}
  .main_title p {font-size: 1.5vw;}
  #page02 .PIP_icon ul li a > div {width: 23%;}
  #page02 .PIP_icon .pip_icon02 {display: none;}

  #page03 .container {padding-top: 120px;}

  #page04 .more {bottom: 60px;}

  #page05 .left {height: auto;}
  #page05 .left {height: 100%;}
  #page05 .left .content .page05_le_bg {position: absolute; bottom: 39px; height: 80%; left: 0;}
  #page05 .left .more_1 {left: 5%; bottom: 10px;}
  #page05 .left .more_1 .text {top: 18%; left: 10%;}
  #page05 .left .more_1 .text h3 {font-size: 30px;}
  #page05 .left .more_1 .text p {font-size: 18px;}
  #page05 .left .more_1 img {width: 100%;}
  #page05 .main_title p {margin-left: 20px!important;}

  #page06 .left .container {padding-top: 120px;}
  #page06 .left .page06_con {margin-top: 25px;}
  #page06 .left .menu_an ul {display: block;}
  #page06 .left .menu_an ul li {float: none; margin-bottom: 5px;}
  #page06 .left .menu_an ul li a {display: block;}
  #page06 .left .info_con {margin-top: 25px;}
  #page06 .left .info_con ul li {float: none; width: 100%; padding: 0; padding-bottom: 20px; border-bottom: 1px solid #ddd;}
  #page06 .left .info_con ul li:last-child {border-bottom: none;}
  #page06 .left .info_con ul li:after {display: none;}
  #page06 .left .info_con ul li img {height: 40px; float: left; margin-right: 40px;}
  #page06 .left .info_con ul li .info_txt {text-align: left;}
  #page06 .left .info_con h3 {margin: 10px 0;}
  #page06 .left .info_con p {font-size: 14px; margin-left: 81px;}
  #page06 .right > div >iframe {padding: 0; margin-top: 0;}

  #sub0102 h2 a::before {display: none;}

  .popup {width: 90%; padding: 20px;}
  #sub0202 .container {padding: 50px 0 40px;}
  #sub0202 .close {top: 20px; right: 15px; margin: 0;}
  #sub0202 .tap {padding: 0 10px;}
  .sub_con .pro_title p {margin-left: 0; margin-top: 10px;}
  #sub0202 .sub_con .pro_title {display: block;}
  #sub0202 .sub_con .pro_title h4::before {display: none;}
  #sub0202 .sub_con .pro_title p {width: 100%;}
  #sub0202 .con04 .pro_img img {margin-left: 0;}
}

@media (max-width: 768px) {
  #fullpage section {overflow: hidden;}
  #header .logo a img {width: 70%;}
  .main_title h1 {font-size: 20px;}
  .main_title p {font-size: 12px;}
  .container {padding-top: 30px; padding-left: 10px; padding-right: 10px;}
  .bbs_container {padding: 30px 0;}
  .mobile {display: block;}
  .pc_only {display: none;}

  #page01 .page01_text p {font-size: 15px;}

  #page02 .container {padding-top: 100px;}
  #page02 .PIP_icon {margin-top: 20px; height: 100%;}
  #page02 .PIP_icon ul {display: block; height: 100%;}
  #page02 .PIP_icon ul li {float: left; width: 49%; height: 32vh; margin-right: 1vw; margin-bottom: 1vw; border-radius: 10px; border: 1px solid #f5b71a;}
  #page02 .PIP_icon ul li:nth-child(2n) {margin-right: 0;}
  #page02 .PIP_icon ul li a > div {position: static; width: 100%; height: auto; padding: 5vw 0; text-align: center; border: none;}
  #page02 .PIP_icon ul li a div h3 {font-size: 20px;}
  #page02 .PIP_icon ul li a div p {display: inline-block; font-size: 15px; white-space: nowrap;}
  #page02 .PIP_icon ul li a > div img {width: 70px;}
  #page02 .PIP_icon ul li .icon_down {display: none;}
  #page02 .PIP_icon ul li:hover .pip_icon02 {display: none;}
  #page02 .PIP_icon .pip_icon02 {display: none;}

  #page03 .container {padding-top: 95px;}
  #page03 .content {margin-top: 20px;}
  #page03 .content ul li {margin-bottom: 10px;}
  #page03 .pic_lt li {width: 32.3%;}
  #page03 .pic_lt li:nth-child(3n) {margin-right: 0;}

  #page04 .container {padding-top: 100px;}
  #page04 .main_title p {margin:  0 0 0 10px;}
  #page04 .content {margin-top: 30px;}
  #page04 .content ul {display: block;}
  #page04 .content ul li {margin-right: 0; padding: 20px; margin-bottom: 20px;}
  #page04 .content ul li:last-child {display: none;}
  #page04 .content ul li a {font-size: 16px; line-height: 20px;}
  #page04 .content ul li a:after {display: none;}
  #page04 .content ul li span {font-size: 13px; line-height: 18px; display: none;}
  #page04 .more {bottom: 120px;}
  #page04 .more a {padding: 18px 18vw;}

  #fullpage section .left {width: 100%; float: none;}
  #fullpage section .right {width: 100%; float: none;}
  #page05 .container {padding-top: 75px;}
  #page05 .left {height: 48%; margin-bottom: 10px; overflow: hidden;}
  #page05 .left .more_1 {bottom: 20px;}
  #page05 .left .more_1 .text {position: static; background: #136ab2; border-radius: 10px; padding: 5px 10px;}
  #page05 .left .more_1 .text h3 {font-size: 20px;}
  #page05 .left .more_1 .text p {font-size: 0.5em; margin-top: 0;}
  #page05 .left .more_1 img {display: none;}
  #page05 .right {height: 48%;}
  #page05 .right .history {text-align: center;}
  #page05 .right .history img {position: static; height: 100%;}
  #page05 .main_title p {margin: 0!important;}

  #page06 .left {margin-bottom: 5vw;}
  #page06 .left .container {padding-top: 95px;}
  #page06 .left .main_title {width: 100%;}
  #page06 .left .main_title p {margin: 0;}
  #page06 .left {width: 100%!important;}
  #page06 .left .page06_con {width: 100%; margin-top: 15px;}
  #page06 .left .info_con {margin-top: 15px; position: static;}
  #page06 .left .info_con ul li {padding-bottom: 10px;}
  #page06 .left .info_con h3 {font-size: 18px; text-align: left;}
  #page06 .left .info_con p {font-size: 12px; text-align: left;}
  #page06 .right {width: 100%!important; height: 30%;}

  .visual {height: 260px;}
  .visual .container {padding-top: 70px;}
  .visual-wrap .visual-title {font-size: 30px;}
  .visual-wrap .visual-text {font-size: 12px;}
  .sub_con:last-child {margin-bottom: 50px;}

  #sub0101 .con01 {margin-top: 50px;}
  #sub0101 .con01 .container {text-align: center; padding: 100px 0;}
  #sub0101 .con01 p {font-size: 18px;}
  #sub0101 .con01 h1 {font-size: 50px;}
  #sub0101 .con02 .container > div {width: 100%; margin: 0 auto;}
  #sub0101 .con02 .container > div p {font-size: 15px;}
  #sub0101 .con02 .left, #sub0101 .con02 .right {float: none;}

  #sub0102 {overflow: hidden;}
  #sub0102 .con02 .container {padding: 0 10px; margin: 0 auto;}

  #sub0103 .con01 h3 {font-size: 30px;}
  #sub0103 .con01 h3:before {display: none;}
  #sub0103 .hs_container {padding: 0 10px; margin: 100px auto;}
  #sub0103 .hs_container::after {display: none;}
  #sub0103 .hs_container > div {display: block;}
  #sub0103 .hs_container h4:after {content: ""; background: #f5b71a66; width: 30px; height: 2px; display: block; margin-top: 10px;}
  #sub0103 .hs_container .hs_con {margin-left: 0; margin-top: 20px;}
  #sub0103 .hs_con ul li h5 {white-space: nowrap;}

  #sub0105 h3 {margin-bottom: 40px;}
  #sub0105 h3:before {display: none;}
  #sub0105 .menu_an {width: 100%;}
  #sub0105 .map {height: 80vw;}
  #sub0105 .map table th {padding: 20px 0; white-space: nowrap;}
  #sub0105 .map table td {font-size: 12px;}

  #sub0201 .sub0201_scroll {display: block; color: #939292; margin: 15px; animation: scroll 2.5s infinite;}
  @keyframes scroll {
    0% {
      opacity: 0;
    }
    50%{
      opacity: 1;
    }
    100%{
      opacity: 0;
    }
  }

  #sub0201 .con01 {overflow-x: scroll;}
  #sub0201 .pro_btn {width: 125px;}
  #sub0201 .con01 .container img {max-width: 1000px;}

  .popup {padding: 0px;}
  #sub0202 {overflow: hidden;}
  #sub0202 .tap .container {padding: 40px 10px 90px;}

  .tap .dis_flex {display: block;}

  #sub0202 .container {padding: 30px 10px 0;}
  #sub0202 .sub_con .pro_title h4::before {display: none;}
  #sub0202 .con01 {padding-bottom: 0;}
  #sub0202 .sub_con .pop_con01_1 {margin-bottom: 15px;}
  #sub0202 .sub_con .pop_con01_1:first-child {margin-top: 50px;}
  #sub0202 .sub_con .pop_con01_1 h4 {font-size: 20px; background: #a7c7e27d; padding: 7px 5px;}
  #sub0202 .sub_con .pop_con01_1 p {margin-top: 5px;}

  .tap ul li {width: 49%; background: #ddd; padding: 10px; text-align: center; margin-bottom: 1.8vw; border: none; display: inline-block;}
  .tap ul li:nth-child(2n) {float: right;}
  .tap ul li a {border: none; padding: 10px 6.8vw;}
  .tap ul li.active {background: #bbb;}
  .tap ul li.active a {background: transparent; color: #333;}
  .tap ul li:hover a { background: transparent; color:#333;}

  #sub0302 .sub_con {padding: 0;}
  #sub0302 .sub_con h3 {font-size: 30px;}
  #sub0302 .con01 h3::before {display: none;}

  #sub0401 h3 {padding: 0 10px; margin: 30px 0 0;}

  #sub0402 h3 {font-size: 36px; text-align: center; margin: 50px 0 10px;}

  #sub0501 .sub_con .title h3 {margin: 10px 0 10px;}
  #sub0501 .sub_con .title h3::before {display: none;}
  #sub0501 .sub_con .title p {font-size: 12px;}
  #sub0501 .sub_con .title p span {font-size: 14px;}
  #sub0501 .con01 .content {width: 100%; margin-top: 50px;}
  #sub0501 .con01 .content .sub0501_text {display: block;}
  #sub0501 .con01 .content .left {width: 100%; margin-bottom: 50px;}
  #sub0501 .con01 .content .right {width: 100%;}
  #sub0501 .con02 .container {padding: 120px 0;}

  #sub0502 {padding-bottom: 0;}
  #sub0502 h3 {font-size: 32px; text-align: center;}
  #sub0502 h3:before {display: none;}
  #sub0502 .title p {font-size: 12px; text-align: center; margin-bottom: 50px;}
  #sub0502 .title p span {font-size: 14px;}

  #footer .up {padding: 25px 10px;}
  #footer .up .ft_logo {width: 170px;}
  #footer .left p {font-size: 12px;}
  #footer .right {display: none;}
  #footer .down {padding: 15px 10px;}
}
