@charset "utf-8";
/*********************
main_visual */
.haro{display: inline-block;font-style: normal;text-indent: -999em;width: 40px;height: 6px;position: relative;border-bottom: 1px solid #333;transition:all .25s ease-out;}
.haro::after{display: block;content: '';border-style: solid; border-color: #333;border-width: 0 0 0 1px; padding: 4px;transform: rotate(135deg);position: absolute;top: 2px;right:2px;transition: .25s ease-out;}
#main_slider .wrapper.control{position: absolute;top: 560px;left: 0;right: 0;overflow: hidden;}
.swiper-pagination-bullets{}
.swiper-pagination-bullets .swiper-pagination-bullet{margin: 0 !important;width: 16px;height: 16px;position: relative;background: none;opacity: .5;transition:all .35s ease-out;display: inline-block;vertical-align: middle;text-align: center;}
.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active{background: none;background: none;opacity: 1;width: 34px;}
.swiper-pagination-bullets .swiper-pagination-bullet::before{display: block;content:'' ;background: #fff;position: absolute;top: 0;left: 0;width: 8px;height: 8px;border-radius:4px;transition:all .35s ease-out; }
.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active::before{background: #fff;width: 24px;}
.swiper-button-wrap .swiper-pagination{position: relative;top: auto;left: auto;right: auto;bottom: auto;line-height: 20px;text-align: center;padding-top: 2px;}
.swiper-button-wrap{position: relative;height: 20px;width: auto;padding-left: 25px;padding-right: 18px;display: inline-block;}
.swiper-button-wrap .swiper-button-next{right: 0;}
.swiper-button-wrap .swiper-button-prev {left: 0;}
.swiper-button-wrap .swiper-button-next, .swiper-button-wrap .swiper-button-prev {background:none;width: 20px;height: 20px;text-indent: -999em;font-size: 0;transition:background-color .25s ease-out !important;outline:none;border-radius: 0;margin-top: 0;top: 0;}
.swiper-button-wrap .swiper-button-next::after, .swiper-button-wrap .swiper-button-prev::after {display: none;}
.swiper-button-wrap .swiper-button-next::before, .swiper-button-wrap .swiper-button-prev::before {content:'';display:block;position:absolute;border-style:solid;border-color:#fff;border-width:2px 0 0 2px;padding:3px;transform:rotate(-45deg);top:50%;left:2px;margin-top: -4px;transition:all .25s ease-out}
.swiper-button-wrap .swiper-button-next::before{border-width:0 2px  2px 0;left: auto;right: 2px;}
.main_visual{position: relative;}
.main_visual::before{display: block;content: '';position: absolute;background: url(../img/main/scrollbtn.png) center bottom no-repeat;width: 41px;height: 97px;bottom: 0;left: 50%;margin-left: -20px;z-index: 2;opacity: 1;transition:all .5s ease-out;animation-duration:1.5s;  animation-name: scroll-bounce;  animation-iteration-count: infinite;  animation-delay: 2s;}
.main_visual.off::before{opacity: 0;bottom: -20px;}
@keyframes scroll-bounce {
0% {bottom: 0;}
50%{bottom: -20px; }
}
#main_slider {height: 950px;background-color: #ccc;overflow: hidden;}
#main_slider .wrapper{max-width: 1400px;}
#main_slider .swiper-slide .wrapper{position: absolute;top: 260px;left: 0;right: 0;}
#main_slider .swiper-slide{background-repeat: no-repeat;background-position: center 0;background-size:cover ;}
#main_slider .bg_txt{color: #fff;z-index: 2;}

.cover{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; right: 0; bottom: 0; object-fit: cover;}

#main_slider .swiper-slide img{ -webkit-transform: scale(1.1); transform: scale(1.1); -webkit-transition: opacity 1s ease, -webkit-transform 3s linear; transition: opacity 1s ease, -webkit-transform 3s linear; transition: transform 3s linear, opacity 1s ease; transition: transform 3s linear, opacity 1s ease, -webkit-transform 3s linear; opacity: 0; }
#main_slider .swiper-slide.swiper-slide-active img{ -webkit-transform: scale(1); transform: scale(1); opacity: 1; }


.bg_txt .tag{font-size: 70px;margin-bottom:20px;letter-spacing: -3px;font-family:'Gmarket Sans';line-height: 1;}
.bg_txt .ch{line-height: 1.1;}
.bg_txt .tag b{display: block;font-weight: 700;}
.bg_txt .tag_txt{font-size: 18px;opacity: .8;}
@media screen and (max-width:1340px) {
#main_slider {height: 780px;}
#main_slider .swiper-slide{background-size: auto 100%;}
}
@media screen and (max-width:1024px) {
#main_slider {height: 660px;}
#main_slider .swiper-slide .wrapper{top: 240px;}
.bg_txt .tag{font-size: 50px;letter-spacing: -1px;}
.bg_txt .tag_txt{font-size: 18px;}
#main_slider .wrapper.control{top: auto;bottom: 80px;}
}
@media screen and (max-width:815px) {
#main_slider {height: 480px;}
#main_slider .swiper-slide .wrapper{top: 170px;}
.bg_txt{text-align: center;}
.bg_txt .tag{font-size: 40px;}
.bg_txt .tag_txt{font-size: 14px;}
.main_visual::before{background-size:30px auto ;}
#main_slider  .wrapper.control{overflow: visible;text-align: center;}

}
@media screen and (max-width:360px) {
.bg_txt .tag{font-size: 30px;}
.bg_txt .tag_txt{font-size: 13px;}
#main_slider {height: 410px;}
#main_slider .swiper-slide .wrapper{top: 130px;}
}


/* 공통 */
.mainTit{position: relative;font-family:'Gmarket Sans';font-size: 60px;letter-spacing: -2px;font-weight: 700;padding-top: 120px;text-transform: uppercase;text-align: center;margin-bottom: 25px;}
.mainTit::before{width: 2px;height: 70px;display: block;margin: 0 auto 32px;background-color: #333;content: '';}
p.mainTitSub{font-size: 40px;font-family:'Gmarket Sans';margin-bottom: 45px;line-height: 1.2;letter-spacing: -1.5px;}
p.mainTitSub span{display: block;}

.arrow {background: #f00;height: 1px;width: 15px;position: relative;cursor: pointer;display: inline-block;vertical-align: middle;}
.arrow::before, .arrow::after {content: "";background: #f00;position: absolute;height: 1px;width: 7px;}
.arrow::before {right: -1px;bottom: -2px;transform: rotate(-45deg);}
.arrow::after {right: -1px;top: -2px;transform: rotate(45deg);}

.bdl{overflow: hidden;}
a.moreTxt{float: right;display: inline-block;position: relative;line-height: 40px;padding-right: 30px;padding-left: 10px;height: 40px;}
a.moreTxt .dots{display:block;position: absolute;top: 50%;margin-top: -2px;right: 0;width: 4px;height: 4px;background-color: #333;border-radius:50% ;transition: .25s ease-out}
a.moreTxt .dots::after,a.moreTxt .dots::before{display: block;position: absolute;top: 0;width: 4px;height: 4px;background-color: #333;border-radius:50%;content: '';transition: .25s ease-out}
a.moreTxt .dots::before{right: 14px;}
a.moreTxt .dots::after{right: 7px;}
/* .bdl .dots a{display: block;position: absolute;top: -12px;right: 0;text-indent: -999em;height: 30px;width: 30px;} */
a.moreTxt:hover{color: #ed1c24;}
a.moreTxt:hover .dots::after,a.moreTxt:hover .dots::before,a.moreTxt:hover .dots{background-color: #ed1c24;}





/* mainProd */
.mainProd{padding: 0 0 100px 0;position: relative;}
.mainProd .wrapper{max-width: 1400px;}

.mainProd.preload .thmLst li{opacity: 0;}
.swiper_nav{height: 0;text-align: center;padding-top: 0;position: absolute;top: calc(50% - 35px);right: -115px;left: -115px;}
.thmLstTab .swiper-button-next{right: 0;}
.thmLstTab .swiper-button-prev {left:  0;}
.thmLstTab .swiper-button-next,
.thmLstTab .swiper-button-prev {background:rgba(0,0,0,.05);width: 70px;height: 70px;text-indent: -999em;font-size: 0;transition:background-color .25s ease-out !important;top: 50%;margin-top: -35px;bottom: auto;border-radius:50% ;}
.thmLstTab .swiper-button-next::after,.thmLstTab .swiper-button-prev::after {display: none;}
.thmLstTab .swiper-button-next::before,.thmLstTab .swiper-button-prev::before {content:'';display:block;position:absolute;border-style:solid;border-color:#333;border-width:2px 0 0 2px;padding:7px;transform:rotate(-45deg);top:50%;left:50%;margin-top: -8px;margin-left: -6px;transition:all .25s ease-out;opacity:.95;right: auto;}
.thmLstTab .swiper-button-next::before{border-width:0 2px 2px 0;margin-left: -9px;}
.thmLstTab .swiper-button-next:hover,.thmLstTab .swiper-button-prev:hover {background:#111;}
.thmLstTab .swiper-button-next:hover::before, .thmLstTab .swiper-button-prev:hover::before{opacity: 1;border-color: #fff;}
.thmLstTab{position:relative;margin: 0;padding-top:60px;}
.thmLstTab h3{position: absolute;top: 0;font-weight: 400;letter-spacing: -1px;}
.thmLstTab h3 a{font-size: 16px;color: #555;display: block;position: relative;height: 40px;line-height: 38px;border-radius:2.5em ;background-color: #f4f4f5;text-align: center;}
.thmLstTab h3 a:hover{background-color:#333; color:#fff;}
.thmLstTab h3.on a{background-color:#333; color:#fff;}
.thmLstTab h3:nth-of-type(1) {left: 0;width: 72px;}
.thmLstTab h3:nth-of-type(2) {left: 82px;width: 114px;}
.thmLstTab h3:nth-of-type(3) {left: 206px;width: 104px;}
.thmLstTab h3:nth-of-type(4) {left: 320px;width: 104px;}
.thmLstTab h3:nth-of-type(5) {left: 434px;width: 115px;}
.thmLstTabCont{display: none;position: relative;}
.thmLstTabCont.on{display: block;}
.thmLstTabCont .nothing{text-align: center;background: #fff url(../img/main/thm_no.png) center 45% no-repeat;position: relative;height: 0;padding-bottom:744px;}
.thmLstTabCont .nothing::before{display: block;content: '';position: absolute;border: 10px solid #eee;top: 0;bottom: 0;left: 0;right: 0;}
.thmLstTabCont .nothing p{position: absolute;top: 60%;left: 0;right: 0;}
.ovh{overflow: hidden;}
.thmLst{overflow: hidden !important;position: relative;height: 0;padding-top: 53.22%;}
.thmLst ul{list-style-type: none;/* display: flex; */margin: 0;padding: 0;position: absolute;top: 0;left: 0;right: 0;bottom: 0;}
.thmLst ul::after{display: block;content: '';clear: both;}
.thmLst li{margin: 0;padding: 0;list-style-type: none;height: calc((100% - 25px) / 2) !important;font-size: 0;transition:all .25s ease-out;}
.thmLst li a{display: block;}
.thmLst li a .imgDiv{text-indent: -999em;display: block;background-color: #fff;background-position: center;background-repeat: no-repeat;background-size:cover ;position: relative;height: 0;padding-bottom: 100%;overflow: hidden;border: 1px solid #e0e0e0;border-radius:20px ;}
/* .thmLst li a .imgDiv.noImg{background: #f9f9f9 url(../img/main/thm_no.png) center 55% no-repeat;background-size:100px auto} */
.thmLst li a .imgDiv.noImg{background: #f9f9f9 ;}
.thmLst li a .imgDiv.noImg::before{display: block;content: '';position: absolute;top: 0;bottom: 0;left: 0;right: 0;background:  url(../img/common/logo2.png) center 52% no-repeat;background-size:120px auto; filter: grayscale(100%);opacity: .3;}
/* .thmLst li a img{width: 100%;height: 100%;font-size: 0;display: block;position: absolute;top: 0;left: 0;} */
.thmLst li a img{width: 80%;font-size: 0;display: block;position: absolute;top: 10%;left: 10%;}
.thmLst li a span.txtDiv{display: block;position: relative; margin-top: 20px;font-size: 0;padding-left: 10px;}
.thmLst li a span.txtDiv b{display: block;font-weight: 700;font-size: 18px; line-height: 1.25; letter-spacing: -1px; overflow:hidden; text-overflow:ellipsis; white-space: nowrap;margin-bottom: 5px;}
.thmLst li a span.txtDiv .prdSize{display: block;font-size: 16px;overflow:hidden; text-overflow:ellipsis;white-space:nowrap;opacity: .8;line-height: 1.1;font-family:,'Noto Sans KR'}
.thmLstTabCont a.moreTxt{float: none;position: absolute;top: -60px;right: 0;}

@media screen and (max-width:1640px) {
body{overflow-x: hidden;}
.swiper_nav{right: -50px;left: -50px;}
}
@media screen and (max-width:1450px) {
.swiper_nav{right: -25px;left: -25px;}
}
@media screen and (max-width:1200px) {
.thmLst{padding-top: 65.22%;}
.thmLst li a span.txtDiv {margin-top: 1.3666666667vw;}
.thmLst li a span.txtDiv b{font-size: 17px;font-size: 1.6666666667vw;}
.thmLst li a span.txtDiv .prdSize{font-size: 14px;font-size: 1.4666666667vw;}
}
@media screen and (max-width:1000px) {
.mainProd{padding: 0 0 50px 0;}
.thmLst{padding-top: 67.32%;}
.thmLst li a span.txtDiv b{font-size: 1.8666666667vw;}
.thmLst li a span.txtDiv .prdSize{font-size: 1.6666666667vw;}
}
@media screen and (max-width:820px) {

.thmLstTabCont {margin-bottom: 50px;}
.thmLstTabCont a.moreTxt{top:auto;right: 50%;transform:translateX(50%);bottom: -60px;border: 1px solid #ccc;border-radius:2.5em ;padding: 0 ;max-width: 250px;width: 60%;text-align: center;}
.thmLstTabCont a.moreTxt .dots{display: none;}
.thmLst{padding-top: 86.66%;}
.thmLst li a span.txtDiv b{font-size: 2.1666666667vw;}
.thmLst li a span.txtDiv .prdSize{font-size: 1.8666666667vw;}

}
@media screen and (max-width:580px) {
.thmLstTab {padding-top: 70px;}
.thmLstTab h3{width: 20% !important;}
.thmLstTab h3 a {font-size: 15px;line-height: 1.2;height: 40px;padding-top: 10px;padding-bottom: 10px;border-radius:5px ;margin-left: 3px;}
.thmLstTab h3 a span{display: block;}
.thmLstTab h3:nth-of-type(1) {left: 0;}
.thmLstTab h3:nth-of-type(2) {left: 20%;}
.thmLstTab h3:nth-of-type(3) {left: 40%}
.thmLstTab h3:nth-of-type(4) {left: 60%}
.thmLstTab h3:nth-of-type(5) {left: 80%}
.thmLstTab h3:nth-of-type(1) a{line-height: 40px;}

.thmLst{padding-top: 131.22%;}
.thmLst li{height: calc((100% - 10px) / 2) !important;}
.thmLst li a span.txtDiv b{font-size:calc(14px + 1.1vw)}
.thmLst li a span.txtDiv .prdSize{font-size: calc(12px + 0.5vw)}
}
@media screen and (max-width:450px) {
.thmLst{padding-top: 135%;}
.thmLst li a span.txtDiv b{font-size:calc(13px + 1.1vw)}
.thmLst li a span.txtDiv .prdSize{font-size: calc(11px + 0.5vw)}
}
@media screen and (max-width:370px) {
.thmLstTab h3 a{font-size: 14px;}
.thmLst{padding-top: 140%;}
.thmLst li a span.txtDiv b{font-size: 16px;}
.thmLst li a span.txtDiv .prdSize{font-size: 13px;}
}

/* mainAbout */

/* .mainAbout{background-color: #f6f6f6; text-align: center;padding-bottom: 120px;}
.mainAbout .more a{border: 1px solid #f00;color: #f00;font-weight: 400;text-align: left;padding-left: 20px;width: 164px;height: 39px;line-height: 37px;margin: 0 auto;display: block;background-color: #fff;position: relative;}
.mainAbout .more a .arrow {position: absolute;right: 12px;top: 50%;}

.mainAbout .dls{max-width: 1100px;margin: 0 auto;padding-top: 100px;overflow: hidden;}
.mainAbout dl{float: left;text-align: center;width: calc(100%/3 - 7px);margin-right: 10px;padding-top: 180px;background-repeat: no-repeat;background-position: center 0;}
.mainAbout dl dt{font-family:'Gmarket Sans';font-size: 14px;font-weight: 500;padding-bottom: 25px;}
.mainAbout dl dt b{display: block;font-size: 70px;font-weight: 700;padding-top: 18px;letter-spacing: -2px;color: #6c5b59;}
.mainAbout dl dd{padding-top: 32px;position: relative;line-height: 1.3;}
.mainAbout dl dd span{display: block;}
.mainAbout dl dd::before{position: absolute;top: 0;left: 50%;width: 30px;height: 6px;background-color: #555;margin-left: -15px;content: '';}
.mainAbout dl:last-child{margin-right: 0;}
.mainAbout dl.about1{background-image: url(../img/main/about_1.jpg);}
.mainAbout dl.about2{background-image: url(../img/main/about_2.jpg);}
.mainAbout dl.about3{background-image: url(../img/main/about_3.jpg);} */


.mainAbout{background-color: #f6f6f6; text-align: center;padding-bottom: 120px;}
.mainAbout .more a{border: 1px solid #f00;color: #f00;font-weight: 400;text-align: left;padding-left: 20px;width: 164px;height: 39px;line-height: 37px;margin: 0 auto;display: block;background-color: #fff;position: relative;}
.mainAbout .more a .arrow {position: absolute;right: 12px;top: 50%;}
.dls{max-width: 1100px;margin: 0 auto;padding-top: 100px;overflow: hidden;}
.dls dl{float: left;text-align: center;width: calc(100%/3 - 7px);margin-right: 10px;padding-top: 180px;background-repeat: no-repeat;background-position: center 0;position: relative;background-size:100% auto;}
.dls dl dt{font-family:'Gmarket Sans';font-size: 14px;font-weight: 700;padding-bottom: 25px;position: relative;z-index: 3;color: #583c39;}
.dls dl::before{display: block;content: '';position: absolute;height: 100%;left: 0;right: 0;z-index: 1; top: 0;
background: linear-gradient(to bottom,  rgba(246,246,246,0) 25%,rgba(246,246,246,.80) 50%,rgba(246,246,246,1) 63%);
}
.dls dl dt b{display: block;font-size: 70px;font-weight: 700;padding-top: 18px;letter-spacing: -2px;color: #6c5b59;}
.dls dl.about3 dt b{font-weight: 900;font-size: 80px;}
.dls dl dd{padding-top: 32px;position: relative;line-height: 1.3;z-index: 3;}
.dls dl dd span{display: block;}
.dls dl dd::before{position: absolute;top: 0;left: 50%;width: 30px;height: 6px;background-color: #555;margin-left: -15px;content: '';z-index: 4;}
.dls dl:last-child{margin-right: 0;}
.dls dl.about1{background-image: url(../img/main/about_1_1.jpg);}
.dls dl.about2{background-image: url(../img/main/about_1_2.jpg);}
.dls dl.about3{background-image: url(../img/main/about_1_3.jpg);}


/* mainGlobal */
.mainGlobal{background: #1d1410 url(../img/main/global_bg.jpg) center 0 no-repeat;height: 930px;text-align: center;position: relative;}
.mainGlobal .mainTit,.mainGlobal p.mainTitSub{color: #fff;}
.mainGlobal .mainTit::before{background-color: #fff;opacity: .45;}
.mainGlobal .more{position: absolute;bottom: 0;left: 0;right: 0;}
.mainGlobal .more a{color: #fff;font-weight: 400;text-align: left;padding-left: 34px;width: 206px;height: 60px;line-height: 58px;margin: 0 auto;display: inline-block;background-color: #ed1c24;position: relative;}
.mainGlobal .more a .arrow{position: absolute;right: 26px;top: 50%;}
.mainGlobal .more a .arrow,.mainGlobal .more a .arrow::before,.mainGlobal .more a .arrow::after{background-color: #fff;}
.globalMap{opacity: .5;font-size: 0;}
.globalMap img{display: block;position: relative;left: 50%;transform:translateX(-50%)}

/* mainNews */
.mainNews{padding-bottom: 80px;}
ul.newsLst,
ul.newsLst li{margin: 0;padding: 0;list-style-type: none;}
ul.newsLst {overflow: hidden;margin-left: -90px;padding-top: 20px; }
ul.newsLst li{float: left;width: calc(100%/3 - 90px);margin-left: 90px;}
ul.newsLst a{display: block;border-top: 2px solid #333;transition:.25s ease-out;position: relative;padding-bottom: 40px;}
ul.newsLst a::after{opacity: 0;content: '';position: absolute;bottom: 0;left: 50%;width: 1px;border-bottom: 1px solid #ed1c24;transition:.25s ease-out;}
ul.newsLst a:hover{margin-top: -20px;border-top-color: #ed1c24;border-top-width: 5px;}
ul.newsLst a:hover::after{opacity: 1;bottom: 0;width: 100%;left: 0;}
/* ul.newsLst a *{transition:.25s ease-out} */
ul.newsLst b{font-size: 30px;display: -webkit-box;overflow: hidden; text-overflow: ellipsis;-webkit-box-orient: vertical; -webkit-line-clamp: 2;height:calc(1em * 1.2 * 2);line-height:1.2;letter-spacing: -1px;padding: 45px 10px 0;}
ul.newsLst em{font-style: normal;font-size: 22px;padding: 20px 10px 33px;display: block;color: #777;font-weight: 400;line-height: 1.1;}
ul.newsLst em img{display: inline-block;vertical-align: middle;width: 18px;margin-top: -2px;}
ul.newsLst .thm{display: block;overflow: hidden;background-color: #f1f1f1;border-radius:15px ;height: 240px;position: relative;text-align: center;font-size: 0;}
ul.newsLst .thm img{position: absolute;top: 50%;left: 50%;transform:translate(-50%,-50%)}
/* mainRoad */
.mainRoad{position: relative;background-color: #333;padding: 130px 0;height: 700px;box-sizing: border-box;}
.mainRoad h2{color: #fff;font-size: 42px;font-family:'Gmarket Sans';letter-spacing: -2px;margin-bottom: 38px;}
.roadInfo p {color: #fff;font-size: 22px;font-family:'Gmarket Sans';letter-spacing: -1px;padding-bottom: 20px;line-height: 1.3;}
.roadBtn{overflow: hidden;padding-top: 5px;width: 370px;}
.roadBtn a{display: block;background-color: #fff;height: 60px;line-height: 58px;padding-left: 27px;font-size: 18px;font-weight: 400;position: relative;margin-top: 10px;}
.roadBtn a.i3{color: #fff;background-color: #f40475;}
.roadBtn a::after{display: block;content: '';position: absolute;background-repeat: no-repeat;top: 0;bottom: 0;right: 0;background-position: 0 center;width: 60px;}
.roadBtn a.i1::after{background-image: url(../img/main/road_i_1.png);}
.roadBtn a.i2::after{background-image: url(../img/main/road_i_2.png);}
.roadBtn a.i3::after{background-image: url(../img/main/road_i_3.png);}
.mainRoad .wrapper{position: static;}
.roadMap{position: absolute;top: 0;right: 0;bottom: 0;width: calc(50% + 190px);}
.roadMap .root_daum_roughmap{border:0;width: 100% ;position: absolute;top: 0;right: 0;left: 0;bottom: 0;}
@media screen and (max-width:1250px) {
.mainRoad h2{font-size: 37px;}
.mainRoad p{font-size: 18px;}
.roadBtn{width: 315px;}
}

@media screen and (max-width:1200px) {
.mainTit{font-size: 50px;padding-top: 50px;;margin-bottom: 15px;}
.mainTit::before{height: 40px;margin: 0 auto 25px;}
p.mainTitSub{font-size: 30px;margin-bottom: 35px;}

.mainAbout{padding-bottom: 60px;}
.dls{padding-top: 60px;}

.mainGlobal{background-size:cover;height: 740px;}
.mainNews{padding-bottom: 40px;}
ul.newsLst {margin-left: -60px; }
ul.newsLst li{width: calc(100%/3 - 60px);margin-left: 60px;}
ul.newsLst b{font-size: 24px;padding-top: 25px;}
ul.newsLst em{font-size: 18px;padding-bottom: 15px;}
ul.newsLst em img{width: 16px;}
}
@media screen and (max-width:1100px) {
ul.newsLst {margin-left: -30px; }
ul.newsLst li{width: calc(100%/3 - 30px);margin-left: 30px;}
.dls dl{background-size: auto;}
.mainRoad{padding: 50px 0 2.5%;height: auto;}
.roadBtn{width: auto;width: auto;margin-bottom: 2.5%;}
.roadBtn a{float: left;width: calc((100% - 27px * 2)/2);margin: 0;}
/* .roadBtn a.i2{margin: 0 1%;} */
.roadMap{width: auto;position: relative;top: auto;bottom: auto;left: auto;right: auto;padding-top: 66%;height: 0;}
}
@media screen and  (min-width:501px) and (max-width:1200px) {
.dls dl::before{background: linear-gradient(to bottom,  rgba(246,246,246,0) 20%,rgba(246,246,246,.80) 40%,rgba(246,246,246,1) 53%);}
}

@media screen and  (min-width:681px) and (max-width:900px) {
ul.newsLst b{font-size: 20px;}
ul.newsLst em{font-size: 16px;}
}
@media screen and (min-width:501px) and (max-width:820px) {

.dls dl dt b{font-size: 40px;}
.dls dl dd {font-size: 14px;}
.dls dl dd span{display: inline;}
}
@media screen and (max-width:680px) {
ul.newsLst {margin-left: 0;}
ul.newsLst li{margin-left: 0;width: auto;float: none;}
ul.newsLst b{height: auto;display: block;text-overflow: initial;-webkit-box-orient: initial; -webkit-line-clamp: initial;}
}
@media screen and (max-width:580px) {

.roadBtn a{font-size: 16px;padding-top: 50px;line-height: 20px;height: 20px;padding-bottom: 10px;text-align: center;padding-left: 0;width: calc(100%/2);}
.roadBtn a::after{top: 0;bottom: auto;height: 45px;right: 0;background-position: center 15px;width: auto;left: 0;}
}
@media screen and (max-width:500px) {
.mainTit{font-size: 40px;}
p.mainTitSub{font-size: 20px;margin-bottom: 20px;}

.dls dl{float: none;margin-right: 0;width: auto;margin-bottom: 30px;background-size:100% auto;}
.mainGlobal{height: 520px;}
.globalMap {opacity: .35;}
.globalMap img{top: -60px;}
}

@media screen and (max-width:390px) {
.mainTit{font-size: 38px;}
p.mainTitSub{font-size: 18px;}
}
@media screen and (max-width:350px) {
p.mainTitSub{font-size: 16px;}
.roadBtn a{font-size: 14px;}
}