@charset "utf-8";

body{position:relative;/*background-color:#e5e5e5*/}
#wrap{min-width:900px;width:900px;margin:0 auto}
#header{position:relative;width:900px;height:286px}
.header_wrap{position:absolute;left:0;top:0;right:0}
.head_bg{height:220px}
.logo a{position:relative;left:0;display:block;width:901px;height:221px;background:url(../img/logo_m.png) no-repeat 0 0;text-indent:-9999px}
.lang{position:absolute;right:4px;top:240px;z-index:10;}
.lang ul{overflow:hidden}
.lang li{float:left;padding:0 3px}
.lang li a{line-height:20px;font-family:Gotham-Bold;color:#bcbec0}
.lang li a.on{color:#020000}
.nav{position:relative;margin-top:15px}
.nav  ul{overflow:hidden}
.nav li{float:left;height:30px;margin-right:38px}
.nav li a{position:relative;display:block;height:30px;line-height:30px;font-family:Gotham-Bold;font-size:14px;color:#020000}
.nav li a.on i{width:100%;}
.nav li a i{position:absolute;left:0;bottom:0;height:2px;background-color:#000;width:0%;-webkit-transition: 0.2s;transition: 0.2s;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}
.nav li a:hover i{width:100%}
.nav li.btn_brief a{width:144px;height:22px;margin:4px 0 0 -10px;background:url(../img/btn_brief.png) no-repeat 0 0;text-indent:-9999px}
.btn_menu{display:none}

.header_srcolled{position:fixed;width:900px;height:120px;background-color:rgba(255,255,255,0.95);z-index:100;opacity: 0.95; filter: alpha(opacity=95);}
.header_srcolled .lang{right:auto;left:360px;top:48px}
.header_srcolled .nav{margin-top:0;position:absolute;right:4px;top:43px}
.header_srcolled .nav li{margin-right:0;margin-left:25px}
.header_srcolled .logo a{width:250px;height:120px;background:url(../img/logo_o.png) no-repeat 0 -20px;background-size:250px auto}

.swiper-container-horizontal>.swiper-pagination .swiper-pagination-bullet{width:12px;height:12px;background:url(../img/sp.png) no-repeat 0 0;opacity:1}
.swiper-container-horizontal>.swiper-pagination .swiper-pagination-bullet-active{background-position:-13px 0}

.main_visual{position:relative;margin-bottom:30px}
.main_tx_bx{position:relative;padding-top:60px;}
.main_tx_bx#work{padding-bottom:40px}
.main_tx_bx h2{padding-bottom:20px;font-family:DINPro-Black;font-size:38px;color:#030000;text-transform:uppercase;line-height:42px}
.main_tx_bx .tit{font-size:17px;font-family:NanumGothicBold;color:#020000;line-height:32px;text-transform:uppercase;}
.main_tx_bx .tx{width:670px;padding:5px 0;font-size:14px;line-height:22px;color:#58595b}
.main_tx_bx .tx + .tx{padding-top:10px}
.main_tx_bx .tx + img{margin-top:10px}
.main_tx_bx h3{padding-bottom:10px; text-transform:uppercase;font-family:DINPro-Black;font-size:24px;color:#020000;}
.main_tx_bx .info_tx{font-size:15px;line-height:22px;color:#58595b}
.main_tx_bx .tel {padding-top:10px;font-size:16px;color:#020000}
.main_tx_bx .email {padding-top:10px;font-size:16px;color:#020000}
.main_tx_bx.w750 .tx{width:750px}
.main_tx_bx.w700 .tx{width:700px}
.main_tx_bx i{display:block;font-style:normal}
.btn_area{padding:10px 0;text-align:center}
.btn_area .btn_more{display:inline-block;width:87px;height:87px;background:url(../img/btn_more.png) no-repeat 0 0;text-indent:-9999px;outline:none}
.pad_t0{padding-top:0}
.main_visual .text__title{display:block;margin-top:30px}

.main_img{position:relative;overflow:hidden;margin-top:30px}

.portfolio_list_wrap{overflow:hidden}
.portfolio_list_wrap .pf_list{margin-left:-15px;overflow:hidden }
.pf_list li{float:left;width:290px;margin-left:15px;text-align:center}
.pf_list li .desc{display:block;padding:10px 0;height: 70px;}
.pf_list li .tit{display:block;max-height:42px;overflow:hidden;font-family:Gotham-Bold;color:#020000;font-size:14px;line-height:21px}
.pf_list li .tx{font-family:Gotham-Book;color:#59595c;font-size:14px;line-height:20px}
.pf_list li img{width:100%}
.pf_tx{position:absolute;right:0;top:50px;font-size:12px;text-align:right;color:#939598;line-height:16px}
.pf_tx span{display:block}

.main_skill_list{padding:30px 0 70px 0;background:url(../img/bg_obj03.png) no-repeat 50% 0;}
.skill_list{overflow:hidden}
.skill_list li{float:left;width:158px;margin-left:45px}
.skill_list li.dvs_1{width:158px}
.skill_list li.dvs_2{width:180px}
.skill_list li .tit{display:block;height:70px;font-family:DINPro-Black;font-size:23px;line-height:28px;text-decoration:none;border-bottom:2px solid #e6e6e6;text-transform:uppercase;}
.skill_list li .depth2{padding-top:12px;overflow:hidden}
.skill_list li .depth2 li{padding-left:10px;margin-left:0;font-family:DINPro-Medium;font-size:15px;color:#747373;text-transform:uppercase;background:url(../img/bullet.jpg) no-repeat 0 50%}

.map{width:900px;height:390px;margin-top:30px;background-color:#000}

#footer{position:relative;}
.f_logo{position:absolute;right:0;bottom:6px;width:467px;height:70px;background:url(../img/logo_f.png) no-repeat 0 0;background-size:467px 70px;text-indent:-9999px}
.f_info_wrap{padding:46px 0 80px;text-align:right}
.f_info_wrap address, .f_info_wrap .f_info{font-size:11px;color:#939598;line-height:16px;}
.f_info_wrap .f_info .text_number{color:#000}
.f_info_wrap .f_info.v2{padding-top:5px}

.sld_sec{position:relative;width:900px;height:530px;overflow:hidden;}
.sld_sec .swiper-slide{overflow:hidden;}
.sld_sec img{/*position:absolute;top:50%;margin-top:-265px;*/width:100%;height:530px;}
.sld_sec .box_video{position:absolute;left:0;top:0;width:100%;height:100%;background-color: #000;}

.swiper-button-prev1{position:absolute;top:50%;left:0;width:100px;height:100px;margin-top:-130px;background:url(../img/btn_prev.png) no-repeat 0 0;z-index:10;}
.swiper-button-next1{position:absolute;top:50%;right:0;width:100px;height:100px;margin-top:-130px;background:url(../img/btn_next.png) no-repeat 0 0;z-index:10;}

.box__layer-portfolio{position: fixed;left:0;top:0;width:100%;height:100%;z-index:1000;}
.box__layer-portfolio .box_layer-content{position:absolute;left:50%;top:50%;transform: translate(-50%, -50%);width:1970px;z-index:1010;}
.box__layer-portfolio .box_layer-content img{width:100%}
.box__layer-portfolio .box_layer-content.double--img img{width:50%}
.box__layer-portfolio .box_layer-content .btn_close{position:absolute;right:-60px;top:0;width:50px;height:50px;background:url(../img/btn_close.png) no-repeat 0 0;text-indent:-9999px;}
.box__layer-portfolio::after{content:'';opacity:0.5;position: fixed;left:0;top:0;width:100%;height:100%;background-color:#000;}

.bgObj1{padding-top:20px;margin-bottom:50px;background:url(../img/bg_obj01.png) no-repeat 228px 0;}
.bgObj1 h2{padding-bottom:30px;}
.bgObj2{padding-top:52px;background:url(../img/bg_obj02.png) no-repeat 715px 0;text-align:right;}
.bgObj2 h2{padding-bottom:60px;padding-right:70px;}
.bgObj2.main_tx_bx .tx{display:inline-block;}

/* en */

.en .main_tx_bx .tx{width:750px}

@media screen and (min-width: 900px){
	.nav{display:block !important}
}

@media screen and (max-width: 900px){
	#wrap{width:auto;min-width:auto;overflow:hidden}
	img{width:100%}
	
	#header{width:100%;height:90px}
	.header_wrap{width:100%;height:90px;background-color:rgba(255,255,255,0.95);z-index:100}
	.head_bg{height:55px}
	.logo a{left:0;top:0;width:100%;height:90px;background:url(../img/logo_mobile.png) no-repeat 50% 32px;background-size:360px 74px}
	.btn_menu{display:block;position:absolute;right:10px;top:10px;width:32px;height:32px}
	.btn_menu .ico{display:block;width: 32px;height: 32px;background:url(../img/btn_menu.png) no-repeat 0 0;background-size:32px 32px;text-indent:-9999px}
	.nav{display:none;background-color:#000;margin-top: 0;position: absolute;top: 90px;left:0;right:0;width: 100%;}
	.nav:before{content: none;}
	.nav li{float:none;height:auto;margin:0;border-bottom: 1px solid #242424;text-align:center}
	.nav li:last-child{border-bottom:1px solid #fff}
	.nav li a{padding:5px 0;color:#fff;}
	.nav li a i{display:none}
	.nav li.btn_brief a{width:auto;height:auto;margin:0;background:none;text-indent:0}
	.lang{display:block;left:auto;top:16px;right:50px}
	.nav{display:none;}
	.header_srcolled{width:100%;height:74px;left:0;top:0;}
	.header_srcolled .logo a{width:160px;height:70px;background-size:130px auto;background-position:7px -5px;}
	.header_srcolled .lang{display:block;left:auto;top:26px;right:50px}
	.header_srcolled .nav{top: 74px}
	.header_srcolled .btn_menu{display:block;position:absolute;right:10px;top:20px;width:32px;height:32px}
	
	.sld_sec{width:100%;height:auto}
	.sld_sec img{width:100%;height:auto;position:static;top:0;margin:0}

	.main_cont{padding:0 10px}
	.main_visual{margin-bottom:0;overflow: hidden;}
	.main_tx_bx{padding-top:0;padding-bottom:40px;background-size:50px 3px}
	.main_tx_bx#about{padding-top:30px;padding-bottom:0;}
	.main_tx_bx h2{font-size:24px;line-height:26px;}
	.main_tx_bx h3{font-size:21px}
	.main_tx_bx .tit{font-size:16px;line-height:22px}
	.main_tx_bx .tx{width:auto;font-size:13px;line-height:21px}
	.main_tx_bx.w750 .tx{width:auto}
	.main_tx_bx.w700 .tx{width:auto}
	.main_tx_bx i{display:inline}
	.main_tx_bx .info_tx{font-size:13px;line-height:18px}
	.main_tx_bx i + i{margin-left:6px}
	.main_tx_bx .tel{font-size:13px;padding-top:5px}
	.main_tx_bx .email{font-size:12px;padding-top:5px}
	.main_visual .text__title{margin-top:15px}

	.main_img{position:relative;height:auto;overflow:hidden;margin-top:10px}
	.main_img img{position:static;top:0;margin-top:0}
	.btn_area .btn_more{width:48px;height:48px;background-size:48px 48px;background-position:50% 0}
	
	.portfolio_list_wrap{}
	.portfolio_list_wrap .pf_list{margin:0 -5px;}
	.pf_list li{float:none;width:90%;padding:0 5px;margin:0 auto;box-sizing:border-box}
	.pf_list li .tit{font-size:13px;line-height:19px}
	.pf_list li .tx{font-size:13px;line-height:18px}
	.pf_tx{position:static;padding-bottom:15px;text-align:left}
	
	.main_skill_list{padding:0;background:none;}
	.skill_list li{float:none;width:auto;margin:0}
	.skill_list li.dvs_1, .skill_list li.dvs_2, .skill_list li.dvs_3, .skill_list li.dvs_4{width:auto}
	.skill_list li .tit{height:35px;margin-top:15px;font-size:18px;padding-left:20px;}
	.skill_list li .depth2{padding-top:0;padding-left:20px}
	.skill_list li .depth2 li{font-size:13px}
	
	.map{display:none}
	#footer{padding:0 10px}
	.f_logo{top:auto;bottom:8px;right:8px;width:267px;height:40px;background:url(../img/logo_f.png) no-repeat 0 0;background-size:267px 40px}
	.f_info_wrap{padding:0 0 60px}
	.dimmed{background-color: #000;opacity: 0.5;width: 100%;height: 100%;position: absolute;overflow: hidden;z-index: 1;top: 0;left: 0;display: none;}
	
	.swiper-button-prev1{display:none}
	.swiper-button-next1{display:none}
	
	.bgObj1{margin-bottom:50px;background:none;}
	.bgObj1 h2{padding-bottom:20px}
	.bgObj2{padding-top:0;background:none}
	.bgObj2 h2{padding-bottom:20px;padding-right:0;}

	/* en */

	.en .main_tx_bx .tx{width:auto}

	.box__layer-portfolio .box_layer-content{width:100%}
	.box__layer-portfolio .box_layer-content .btn_close{right: 5%;top: -29px;width: 25px;height: 25px;background-size: 25px 25px;}
	.box__layer-portfolio .box_layer-content.double--img img{width:100%}
	
}