@charset "utf-8";
@import url(./common.css);
@import url(./layout.css);
@import url(./swiper.min.css);
/* 20211124 추가 */
.scroll-none{width: 100%;height: 100%;overflow: hidden;}
.dim{background:#333; width:100%; height:100%; opacity: 0.6; position:absolute; z-index:899;}
.black_overlay { display: none; position: fixed; top: 0%; left: 0%; width: 100%; height: 100%; background-color: black; z-index:1001; -moz-opacity: 0.89; opacity:.80; filter: alpha(opacity=90); }

.white_content { position: fixed; top: 0; left: 0; width: 100%; height: 100%; min-height: 1380px; z-index:800; }
.white_content .iframe{ position: fixed; width: 1260px; height:710px; z-index:900; left: 50%; margin-left: -630px; top: 120px; }

a.main_pop_clo { color:#fff; top: 50px; position: fixed; z-index: 900; width:140px; height:50px; line-height:50px; border:1px solid #fff; text-align:center; left: 50%; margin-left:-80px; }
a.main_pop_clo span img { vertical-align: middle; height: 14px; margin: -3px 0 0 18px; }
a.main_pop_clo span { 
	position:absolute; top:50%; left:0; width:100%; height:auto;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
a.main_pop_clo:before { 
	content: '';  position: absolute;  background: #E33046;  border-color: #E33046;  width: 0;  height: calc(100% + 2px);  left: -1px;  top: -1px;
	-webkit-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	-moz-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	-ms-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	-o-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
a.main_pop_clo:hover:before{ width: calc(100% + 2px); }
.main .movie { z-index:10;position:absolute; bottom:6vh; right:4.4%;}
.main .movie a	{display:block;font-size:14px; background:#fff; border:1px solid #E33046; width:183px; line-height:50px;color:#E33046;text-align: center;}
.main .movie a span	{vertical-align:middle; margin-top:-2px; margin-left:4px; display:inline-block; border:1px solid #E33046; border-radius:2px; width:30px; height:22px;background:#fff url("/assets/images/main/01_view.png") 50% 50% no-repeat; background-size:6px;}
.main .movie a:hover span	{background:#E33046 url(/assets/images/main/01_view_on.png) 50% 50% no-repeat; background-size:6px;}

.main{width:100%;overflow:hidden}

.play-hide{opacity:0;transform: translate(0,20px);transition: all 1s ease-in-out;}
.play-hide.show{opacity:1;transform: translate(0,0);}

.visual{position:relative;padding-left:6.25%;animation:visual 1s ease-out;animation-fill-mode: backwards;}
.visual > div{position:relative;width:100%;}
.visual .visual-con{display:flex;align-items:center;justify-content:flex-start;position:relative;height:852px;padding:0 10% 0 11.83%;border-radius:50px 0 0 50px;overflow:hidden}
.visual .visual-con > *{position:relative;z-index:1}
.visual .visual-con .bg{display:block;position:absolute;top:0;left:0;z-index:0;width:100%;height:100%;overflow:hidden}
.visual .visual-con .bg img{width:auto;max-width:none}
.visual .visual-con p{width:100%;color:#fff;text-align:left}
.visual .visual-con .sub-title{font-size:22px;}
.visual .visual-con .title{font-size:46px;margin:10px 0 40px;font-weight:300;line-height:1.4em}
.visual .visual-con  .title strong{display:inline-block;vertical-align:top;position:relative;font:inherit;font-weight:700}
.visual .visual-con  .title strong span{position:relative;font:inherit;z-index:5}
.visual .visual-con  .title strong::before{position:absolute;bottom:3px;left:0;width:100%;height:14px;background:#DF132C;content:'';z-index:1}
.visual .visual-con .description{font-size:18px;}

.visual .swiper-button-next,
.visual .swiper-button-prev {text-align:center;line-height:0;width:60px;height:60px;background:transparent;z-index:1;text-indent:-999px;overflow:hidden}
.visual .swiper-button-next::after,
.visual .swiper-button-prev::after{display:inline-block;width:100%;height:100%;background:url(../images/main/ico-siwper-arr.png) no-repeat 0 0}
.visual .swiper-button-next:hover::after,
.visual .swiper-button-prev:hover::after{background:url(../images/main/ico-siwper-arr-on.png) no-repeat 0 0}
.visual .swiper-button-next::after{transform:rotate(180deg)}
.visual .swiper-button-prev{left:4.44%}
.visual .swiper-button-next{right:4.44%}
.visual::before{display:none;position:absolute;top:168px;left:70px;width:79px;height:79px;border-radius:50%;background:transparent;border:1px dashed #FF8E26;content:'';z-index:5}
.visual::after{position:absolute;bottom:-78px;right:-20px;width:200px;height:200px;border-radius:50%;background:#DF132C;opacity:.2;content:'';z-index:5}

.main-visual .swiper-pagination{bottom:60px;z-index:10}
.swiper-pagination-bullet{width:10px;height:10px;border-radius:5px;background:#C0C0C0;opacity:1;vertical-align: middle;transition:all .3s}
.swiper-pagination-bullet-active{width:20px;height:10px;background:#DF132C}

.main-visual{overflow:hidden}

.title-box{position:relative}
.title-box .title{display:inline-block;position:relative;font-size:40px;letter-spacing:-0.03em;font-weight:700;color:#222;line-height:50px}
.title-box .title::after{position:absolute;width:8px;height:8px;background:#DF132C;border-radius:50%;content:'';}
.title-box p{font-size:16px;letter-spacing:-0.03em;}
.title-box p strong{font-weight:700;color:#DF132C}

.ourservice {position:relative;margin:80px 0 0;padding-bottom:130px;padding-left:6.25%;}
.ourservice::after{position:absolute;bottom:-106px;left:107px;width:180px;height:180px;border-radius:50%;background:transparent;border:1px dashed #DF132C;content:'';z-index:10}
.ourservice .bg{position:absolute;bottom:0;right:0;width:100%;height:732px;padding-left:6.25%;}
.ourservice .bg::before{display:block;width:100%;height:100%;background:url(../images/main/bg-service.png) no-repeat 0 0;content:'';border-radius:50px 0 0 50px;overflow:hidden}
.ourservice .title-box {margin:0 0 27px}
.ourservice .title-box .title::after {top:9px;right:43px}
.ourservice .title-box .keywords{position:absolute;top:50%;transform: translate(0,-50%);right:0;display:inline-flex;}
.ourservice .title-box .keywords li{width:116px;}
.ourservice .title-box .keywords li + li{margin-left:10px;}
.ourservice .title-box .keywords li a{display:block;width:100%;height:44px;line-height:44px;background:#fff;text-align:Center;border:1px solid #D1D1D1;border-radius:30px;font-size:14px;color:#222;overflow:hidden;word-break:break-all;white-space:nowrap;text-overflow: ellipsis;}
.ourservice .title-box .keywords li a:hover{background:#E33046;border-color:#E33046;color:#fff;font-weight:500}
.ourservice .search-box{position:relative;width:100%;padding-left:85px;border:2px solid #DF132C;background:#fff}
.ourservice .search-box .select-box{position:absolute;top:0;left:0;width:84px}
.ourservice .search-box .select-box label{width:100%;font-size:14px;height:54px;line-height:54px}
.ourservice .search-box .select-box::after{position:absolute;top:50%;left:84px;width:1px;height:22px;background:#DEDEDE;transform:translate(0,-50%);content:''}
.ourservice .search-box .input-box{border:0;width:100%;height:54px;}
.ourservice .search-box .input-box label,
.ourservice .search-box .input-box input{font-size:14px;height:54px;line-height:54px}
.ourservice .search-box .input-box .btn-srch{background-image:url(../images/btn-srch.png)}
.ourservice  .quickmenus{margin:100px 0 0;height:472px;overflow:hidden}
.ourservice  .quickmenus .swiper-wrapper .swiper-slide{display:inline-block;width:50%}
.ourservice  .menus-con{width:100%}
.ourservice  .menus-con ul{width:100%;display:flex;flex-flow:row wrap;}
.ourservice  .menus-con ul li{width:50%;height:236px;background:#fff}
.ourservice  .menus-con ul li a{position:relative;display:inline-flex;width:100%;height:100%;padding-top:153px;justify-content: center;align-items: flex-start;background:transparent;font-size:16px;color:#222}
.ourservice  .menus-con ul li a::before{position:absolute;top:59px;left:50%;width:68px;height:63px;background-repeat:no-repeat;background-position:0 0;content:'';transform: translate(-50%,0);}
.ourservice  .menus-con ul li a:hover{background:#DF132C;color:#fff}
.ourservice  .menus-con ul li.quick02 ,.menus-con ul li.quick04 ,.menus-con ul li.quick05 ,.menus-con ul li.quick07 {background:#F9F9F9}

.quick01 a::before{background-image:url(../images/main/ico-service01.png)}
.quick01 a:hover::before{background-image:url(../images/main/ico-service01-on.png)}
.quick02 a::before{background-image:url(../images/main/ico-service02.png)}
.quick02 a:hover::before{background-image:url(../images/main/ico-service02-on.png)}
.quick03 a::before{background-image:url(../images/main/ico-service03.png)}
.quick03 a:hover::before{background-image:url(../images/main/ico-service03-on.png)}
.quick04 a::before{background-image:url(../images/main/ico-service04.png)}
.quick04 a:hover::before{background-image:url(../images/main/ico-service04-on.png)}
.quick05 a::before{background-image:url(../images/main/ico-service05.png)}
.quick05 a:hover::before{background-image:url(../images/main/ico-service05-on.png)}
.quick06 a::before{background-image:url(../images/main/ico-service06.png)}
.quick06 a:hover::before{background-image:url(../images/main/ico-service06-on.png)}
.quick07 a::before{background-image:url(../images/main/ico-service07.png)}
.quick07 a:hover::before{background-image:url(../images/main/ico-service07-on.png)}
.quick08 a::before{background-image:url(../images/main/ico-service08.png)}
.quick08 a:hover::before{background-image:url(../images/main/ico-service08-on.png)}
.ourservice  .quickmenus .swiper-pagination {display:none}

.menus {margin:90px 0 135px}
.menus .inner_wrapper::after{display:none;position:absolute;top:459px;left:10px;width:40px;height:40px;border-radius:50%;background:#FF8E26;opacity:.2;content:'';z-index:10}
.menus ul{display:flex;flex-flow:row wrap;width:calc(100% + 20px);margin:0 -10px;}
.menus ul li{width:calc(33.3% - 20px);height:560px;margin:0 10px}
.menus ul li a{position:relative;top:0;display:block;width:100%;height:100%;transition:all .3s}
.menus ul li a > div{position:absolute;bottom:0;left:0;padding:40px 0 40px 40px;transition:all .3s}
.menus ul li a::before{position:absolute;top:0;left:0;width:100%;height:100%;background: linear-gradient(0deg, #000000 1.39%, rgba(0, 0, 0, 0.5) 42.99%);opacity:.65;transition:all .3s;content:''}

.menus ul li:nth-child(1) > a{background:url(../images/main/bg-menu1.png) no-repeat 0 0}
.menus ul li:nth-child(2) > a{background:url(../images/main/bg-menu2.png) no-repeat 0 0}
.menus ul li:nth-child(3) > a{background:url(../images/main/bg-menu3.png) no-repeat 0 0}
.menus ul li .title{display:inline-block;position:relative;font-size:36px;font-weight:700;color:#fff;padding:4px 11px 0 0;line-height:1.2em}
.menus ul li .title::before{position:absolute;top:0;right:0;width:8px;height:8px;border-radius: 50%;background:#DF132C;overflow:hidden;content:'';}
.menus ul li .btn-area{margin:20px 0 0}
.menus ul li .btn-area .btn-more{position:relative;width:130px;height:44px;line-height:44px;border-radius:22px;font-size:13px;color:#fff;border:1px solid #fff;background:transparent;text-align:center;padding-right:10px}
.menus ul li .btn-area .btn-more::after{position:absolute;top:50%;right:10px;width:16px;height:16px;transform: translate(0,-50%);background: url(../images/ico-more-arr.png) no-repeat center;content:''}
.menus ul li  .description {font-size:18px;color:#fff;line-height:26px;max-height:0;overflow:hidden;transition:all .3s ease-in-out}
.menus ul li  .description .effect{display:inline-block;overflow:hidden}
.menus ul li  .description .effect > span{display:block;transform: translate(0,100%)}
.menus ul li.on a ,
.menus ul li a:hover  {top:-50px}
.menus ul li.on a::before,
.menus ul li a:hover::before{opacity:0}

.menus ul li.on a > div .description,
.menus ul li a:hover > div .description {margin:30px 0 0;max-height:999px}

.menus ul li.on a > div .description .effect > span,
.menus ul li a:hover > div .description .effect > span{animation: fadeIn .8s ease-out .3s;animation-fill-mode: both;}

.menus ul li.on a > div .btn-more,
.menus ul li a:hover > div .btn-more {background:#DF132C;border-color:#DF132C}

.newsroom .title-box .list{position:absolute;top:50%;transform: translate(0,-50%);right:0;display:inline-flex;}
.newsroom .title-box .list li{width:120px;}
.newsroom .title-box .list li + li{margin-left:8px;}
.newsroom .title-box .list li a{display:block;width:100%;height:44px;line-height:44px;text-align:Center;border:1px solid #D1D1D1;border-radius:30px;font-size:16px;color:#222}
.newsroom .title-box .list li.on a,
.newsroom .title-box .list li a:hover{background:#E33046;border-color:#E33046;color:#fff;font-weight:500}
.newsroom .title-box .title::after {top:2px;right:-8px}

.newsroom  .board-preview ul{margin:15px -10px 100px;width:calc(100% + 20px);display:flex;flex-flow:row wrap}
.newsroom  .board-preview li{position:relative;margin:10px;padding:30px 27px;width:calc(33.3% - 20px);height:180px;border:1px solid #E3E3E3;background:#F9F9F9}
.newsroom  .board-preview .ico-new{position:absolute;top:0;right:0;width:60px;height:30px;text-align:center;line-height:30px;color:#Fff;font-weight:700;font-size:13px;font-family: 'Roboto';background:#FF8E26}
.newsroom  .board-preview li .date{font-size:14px;color:#888}
.newsroom  .board-preview li .title{margin:12px 0 0;font-size:18px;color:#222;font-weight:500;line-height:25px;letter-spacing:-0.05em}
.newsroom  .board-preview li .btn-area{position:absolute;bottom:25px;left:27px;}
.newsroom  .board-preview li .btn-area .btn-more{font-size:13px;color:#9B9B9B}
.newsroom  .board-preview li .btn-area .btn-more::after{margin-left:10px;display:inline-block;vertical-align: middle;border:1px solid #CECECE;border-radius:50%;width:24px;height:24px;background:#fff url(../images/ico-more-arr2.png) no-repeat center;content:''}

/* animation */
.visual::before{animation:moveTo 10s infinite linear }
.visual::after{animation:moveTo 15s infinite linear }
.menus .inner_wrapper::after {animation:moveTo 11s infinite linear 1s}
.ourservice::after {animation:moveTo 10s infinite linear }

.menus.play-hide.show ul li:nth-child(1) {animation:fadeIn2 1s ease-out .3s;animation-fill-mode: backwards;}
.menus.play-hide.show ul li:nth-child(2) {animation:fadeIn2 1s ease-out .6s;animation-fill-mode: backwards}
.menus.play-hide.show ul li:nth-child(3) {animation:fadeIn2 1s ease-out .9s;animation-fill-mode: backwards}
@keyframes moveTo{
    0%{
        left:0;
    }
    100%{
        left:100%
    }
}
@keyframes fadeIn{
    0%{
        transform: translate(0,100%)
    }
    100%{
        transform: translate(0,0)
    }
}
@keyframes fadeIn2{
    0%{
        opacity:.5;
        transform: translate(0,30px)
    }
    100%{
        opacity:1;
        transform: translate(0,0)
    }
}
@keyframes visual{
    0%{
        opacity:0;
      top:30px
    }
    100%{
        opacity:1;
        top:0
    }
}
/* 211124 추가 */
@media screen and (max-width:1280px){
	.white_content .iframe { position: relative; width: 1000px;height:593.49px;z-index:900; left: 50%; margin-left: -500px; top: 140px; }
	a.main_pop_clo { color:#fff; top: 70px; position: absolute; z-index: 900; width:140px; height:50px; line-height:50px; border:1px solid #fff; text-align:center; left: 50%; margin-left:-80px; }
	a.main_pop_clo span img { vertical-align: middle; height: 14px; margin: -3px 0 0 18px; }
}


@media screen and (max-width:1080px){
    .visual::before{display:block}
    .section .inner_wrapper{padding-left:20px;padding-right:20px}
	  /* 20211124 추가 */

    .main .movie { bottom:6vh; right:16px; }
    .main .movie a { font-size:16px; width:156px; line-height:43px; }
}
@media screen and (max-width:768px){
    
.visual{position:relative;padding-left:30px}
.visual .visual-con{height:760px;padding:0 0 0 113px;}
.visual .visual-con .bg img{width:100%}
.visual .visual-con p{width:100%;color:#fff;text-align:left}
.visual .visual-con .sub-title{font-size:22px;}
.visual .visual-con .title{font-size:42px;margin:10px 0 40px;font-weight:300;line-height:1.4em}
.visual .visual-con  .title strong::before{bottom:3px;height:12px}
.visual .visual-con .description{display:none}
/* .visual .swiper-button-next,
.visual .swiper-button-prev{width:60px;height:60px} */
.visual .swiper-button-next::after,
.visual .swiper-button-prev::after{background:url(../images/main/ico-siwper-arr-m.png) no-repeat 0 0/contain}
.visual .swiper-button-next:hover::after,
.visual .swiper-button-prev:hover::after{background:url(../images/main/ico-siwper-arr-on-m.png) no-repeat 0 0/contain}
.visual .swiper-button-prev{left:30px}
.visual .swiper-button-next{right:30px}
.visual::after{width:172px;height:172px}

.title-box {width:100%;text-align:center}
.title-box .title{font-size:42px;text-align:center}
.title-box p{font-size:22px;text-align:center}

.ourservice {margin:63px 0 0;padding:0 32px 50px;}
.ourservice::after{bottom:20px;left:30px;width:137px;height:137px;}
.ourservice .bg{height:792px;padding-left:30px;}
.ourservice .bg::before{background:url(../images/main/bg-service-t.png) no-repeat 0 0/100% 100%;}

.ourservice .title-box {margin:0 0 27px;}
.ourservice .title-box .title::after {top:8px;right:45px}
.ourservice .title-box .keywords{position:static;transform: translate(0,0);display:flex;width:100%;justify-content: center;margin:17px 0 40px;}
.ourservice .title-box .keywords li{width:120px;}
.ourservice .title-box .keywords li a{height:48px;line-height:48px;font-size:16px}
/* .ourservice .title-box .keywords li a:hover{background:#E33046;border-color:#E33046;color:#fff;font-weight:500} */
.ourservice .search-box{padding-left:97px}
.ourservice .search-box .select-box{width:96px}
.ourservice .search-box .select-box label{width:100%;font-size:14px;height:76px;line-height:76px}
.ourservice .search-box .select-box::after{left:96px;width:1px;height:42px}
.ourservice .search-box .input-box{height:76px;}
.ourservice .search-box .input-box label,
.ourservice .search-box .input-box input{font-size:16px;height:76px;line-height:76px}
.ourservice .search-box .input-box .btn-srch{background-image:url(../images/btn-srch-m.png)}
.ourservice  .quickmenus{margin:60px 0 0;height:640px}
.ourservice  .quickmenus .swiper-wrapper .swiper-slide{display:inherit;width:100%}
.ourservice  .menus-con ul li{height:295px}
.ourservice  .menus-con ul li a{padding-top:199px;font-size:18px}
.ourservice  .menus-con ul li a::before{top:70px;left:50%;width:96px;height:89px;background-size:100% auto;}
.ourservice  .menus-con ul li a:hover{background:#DF132C;color:#fff}
.quick01 a::before{background-image:url(../images/main/ico-service01-m.png)}
.quick01 a:hover::before{background-image:url(../images/main/ico-service01-on-m.png)}
.quick02 a::before{background-image:url(../images/main/ico-service02-m.png)}
.quick02 a:hover::before{background-image:url(../images/main/ico-service02-on-m.png)}
.quick03 a::before{background-image:url(../images/main/ico-service03-m.png)}
.quick03 a:hover::before{background-image:url(../images/main/ico-service03-on-m.png)}
.quick04 a::before{background-image:url(../images/main/ico-service04-m.png)}
.quick04 a:hover::before{background-image:url(../images/main/ico-service04-on-m.png)}
.quick05 a::before{background-image:url(../images/main/ico-service05-m.png)}
.quick05 a:hover::before{background-image:url(../images/main/ico-service05-on-m.png)}
.quick06 a::before{background-image:url(../images/main/ico-service06-m.png)}
.quick06 a:hover::before{background-image:url(../images/main/ico-service06-on-m.png)}
.quick07 a::before{background-image:url(../images/main/ico-service07-m.png)}
.quick07 a:hover::before{background-image:url(../images/main/ico-service07-on-m.png)}
.quick08 a::before{background-image:url(../images/main/ico-service08-m.png)}
.quick08 a:hover::before{background-image:url(../images/main/ico-service08-on-m.png)}
.ourservice  .quickmenus .swiper-pagination {display:block;bottom:0}
.ourservice  .quickmenus  .swiper-pagination-bullet{background-color:#A9A9A9}
.ourservice  .quickmenus .swiper-pagination-bullet-active{background:#DF132C}

.menus {margin:80px 0}
.section.menus .inner_wrapper {padding:0 64px;}
.menus ul{width:100%;margin:0}
.menus ul li{width:100%;height:310px;margin:0}
.menus ul li + li{margin:30px 0 0 }
.menus ul li a::before{display:none}
.menus.play-hide.show ul li:nth-child(1) ,
.menus.play-hide.show ul li:nth-child(2) ,
.menus.play-hide.show ul li:nth-child(3) {animation:none}
.menus ul li:nth-child(1) > a{background:url(../images/main/bg-menu1-t.png) no-repeat 0 0/contain}
.menus ul li:nth-child(2) > a{background:url(../images/main/bg-menu2-t.png) no-repeat 0 0/contain}
.menus ul li:nth-child(3) > a{background:url(../images/main/bg-menu3-t.png) no-repeat 0 0/contain}
.menus ul li .btn-area{margin:16px 0 0}
.menus ul li .btn-area .btn-more{font-size:16px;padding-right:10px}
.menus ul li .btn-area .btn-more::after{background: url(../images/ico-more-arr-m.png) no-repeat center/contain}
.menus ul li.on a > div .description,
.menus ul li a:hover > div .description ,
.menus ul li  .description {margin:15px 0 0;max-height:999px;}
.menus ul li.on a ,
.menus ul li a:hover  {top:0}

.play-hide.show li:nth-child(1) .description .effect > span,
.play-hide.show li:nth-child(1) .description .effect > span{animation: fadeIn .8s ease-out .3s;animation-fill-mode: forwards;}

.play-hide.show li:nth-child(2) .description .effect > span,
.play-hide.show li:nth-child(2) .description .effect > span{animation: fadeIn .8s ease-out .9s;animation-fill-mode: forwards;}

.play-hide.show li:nth-child(3) .description .effect > span,
.play-hide.show li:nth-child(3) .description .effect > span{animation: fadeIn .8s ease-out 1.2s;animation-fill-mode: forwards;}

.newsroom .title-box .list{position:static;width:100%;top:0;transform: translate(0,0);justify-content: center;margin:26px 0 30px}
.newsroom  .board-preview{padding:0 64px}
.newsroom  .board-preview ul{margin:15px -15px 100px;width:calc(100% + 30px);}
.newsroom  .board-preview li{margin:15px;padding:30px;width:calc(50% - 30px);height:200px}
.newsroom  .board-preview li .title{margin:11px 0 0;font-size:20px;}
.newsroom  .board-preview li .btn-area{bottom:30px;left:30px;}
.newsroom  .board-preview li .btn-area .btn-more::after{background:#fff url(../images/ico-more-arr2-m.png) no-repeat center/contain}

/* 20211124 추가 */
.white_content .iframe { position: relative; width: 95vw;height:53.5vw; z-index:900; left: 2.5vw; margin-left:0; top: 210px; }

a.main_pop_clo { color:#fff; top: 140px; position: absolute; z-index: 900; width:116px; font: 11px; height:32px; line-height:32px; border:1px solid #fff; text-align:center; left: 50%; margin-left:-70px; }
/*a.main_pop_clo span { line-height: 48px; }*/
a.main_pop_clo span{ font-size: 12px;}
a.main_pop_clo span img { vertical-align: middle; height: 10px; margin: -3px 0 0 18px; }
.main .movie	{ bottom:6vh; right:16px; }
.main .movie a { font-size:11px; width:116px; line-height:30px; }
.main .movie a span { margin-top:-2px; margin-left:4px; width:22px; height:16px; background-size:5px; }
.main .movie a:hover span	{ background-size:5px; }

}
@media screen and (max-width:640px){
    .section .inner_wrapper{padding-left:16px;padding-right:16px}
    .visual{padding-left:16px}
    .visual .visual-con{height:480px;padding:0 0 0 62px;}
    .visual .visual-con .bg img{height:100%;}
    .visual .visual-con .sub-title{font-size:12px;}
    .visual .visual-con .title{font-size:20px;margin:10px 0 0;line-height:27px}
    .visual .visual-con  .title strong::before{bottom:3px;height:6px}
    .visual .visual-con .description{display:none}
    .visual .swiper-button-next,
    .visual .swiper-button-prev{width:32px;height:32px}
    .visual .swiper-button-prev{left:17px}
    .visual .swiper-button-next{right:17px}
    .main-visual .swiper-pagination{bottom:40px}
    .swiper-pagination-bullet{width:8px;height:8px;margin:0 3px}
    .swiper-pagination-bullet-active{width:20px;height:8px;}
    .visual::before{top:92px;left:-23px;width:50px;height:50px;left:50px;}
    .visual::after{bottom:-56px;right:-18px;width:100px;height:100px;}
    .title-box .title{font-size:22px}
    .title-box p{font-size:14px;line-height:20px}
    
    .ourservice {margin:24px 0 0;padding:0 32px 33px;}
    .ourservice::after{bottom:-266px}
    .ourservice .bg{height:392px;padding-left:16px;}
    .ourservice .bg::before{background:url(../images/main/bg-service-m.png) no-repeat 0 0/100% 100%;}
    
    .section.ourservice .inner_wrapper{padding:0}
    .ourservice .title-box {margin:0 0 15px;}
    .ourservice .title-box .title::after {width:5px;height:5px;top:16px;right:24px}
    .ourservice .title-box .keywords{margin:15px 0 0;}
    .ourservice .title-box .keywords li{width:74px;}
    .ourservice .title-box .keywords li a{height:30px;line-height:30px;font-size:12px}

    .ourservice .search-box{padding-left:63px}
    .ourservice .search-box .select-box{width:62px}
    .ourservice .search-box .select-box label{padding:0 10px}
    .ourservice .search-box .input-box.search, 
    .ourservice .search-box .input-box.search label{padding-right:30px}
    .ourservice .search-box .input-box.search .btn-srch{  background: url(../images/btn-srch-m.png) no-repeat center/18px;}
    .ourservice .search-box .select-box label{font-size:11px;height:48px;line-height:48px}
    .ourservice .search-box .select-box::after{left:62px;height:22px}
    .ourservice .search-box .input-box{height:48px}
    .ourservice .search-box .input-box label,
    .ourservice .search-box .input-box input{padding-left:10px;font-size:11px;height:48px;line-height:48px}
    
    .ourservice  .quickmenus{margin:24px 0 0;height:310px}
    .ourservice  .menus-con ul li{height:136px}
    .ourservice  .menus-con ul li a{padding-top:90px;font-size:12px}
    .ourservice  .menus-con ul li a::before{top:33px;width:45px;height:45px;}
    
    .menus {margin:40px 0 25px}
    .menus .inner_wrapper::after{display:block}
    .section.menus .inner_wrapper {padding:0 16px;}
    .menus ul li{height:220px}
    .menus ul li + li{margin:14px 0 0 }
    .menus ul li .title {font-size:20px;line-height:30px;padding-right:10px}
    .menus ul li .title::before{width:6px;height:6px}
    .menus ul li:nth-child(1) > a{background:url(../images/main/bg-menu1-m.png) no-repeat 0 0/100% 100%}
    .menus ul li:nth-child(2) > a{background:url(../images/main/bg-menu2-m.png) no-repeat 0 0/100% 100%}
    .menus ul li:nth-child(3) > a{background:url(../images/main/bg-menu3-m.png) no-repeat 0 0/100% 100%}

    .menus ul li .btn-area{margin:10px 0 0}
    .menus ul li .btn-area .btn-more{width:96px;font-size:12px;padding-right:10px;height:30px;line-height:30px;}
    .menus ul li .btn-area .btn-more::after{right:5px}
    .menus ul li.on a > div .description,
    .menus ul li a:hover > div .description ,
    .menus ul li  .description {font-size:12px;margin:7px 0 0;line-height:18px}
    
    .newsroom .title-box .list{margin:17px 0 20px}
    .newsroom .title-box .list li{width:74px}
    .newsroom .title-box .list li a{font-size:12px;height:30px;line-height:30px}

    .newsroom  .board-preview{padding:0 0 40px}
    .newsroom  .board-preview ul{margin:0;width:100%;}
    .newsroom  .board-preview li{margin:15px 0 0;padding:20px 30px;width:100%;height:120px}
    .newsroom  .board-preview li .date{font-size:12px;}
    .newsroom  .board-preview li .title{margin:3px 0 0;font-size:14px;line-height:20px}
    .newsroom  .board-preview li .btn-area{bottom:15px;}
    .newsroom  .board-preview li .btn-area .btn-more{font-size:11px}
    .newsroom  .board-preview li .btn-area .btn-more::after{width:16px;height:16px}
    .newsroom  .board-preview .ico-new{right:16px;font-size:11px;width:46px;height:23px;line-height:23px;}
    
		/*.white_content .iframe{height:280px;}*/
}