/* 공통 */

.sub_visual {position: relative; height: 600px; background: url("/images/sub/sub_vis_bg1.jpg") center no-repeat; background-size: cover;}
.sub_vis_txt {position: absolute; top: 50%; left: 50%; transform: translate(-50% , -50%); width: 100%; text-align: center;}
.sub_vis_txt h2 {font-size: 70px; color: #fff; font-weight: 800;}
.sub_vis_txt p {font-size: 20px; color: #fff; margin-top: 10px;}

.sub_pc_menu {height: 110px; border-bottom: 1px solid #ccc;}
.sub_pc_menu ul {display: flex; align-items: center; justify-content: center; height: 100%;}
.sub_pc_menu ul li {position: relative; height: 100%; display: flex; align-items: center; margin: 0 30px;}
.sub_pc_menu ul li.active a {color: #000; font-weight: bold;}
.sub_pc_menu ul li.active:before {content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: #000; }
.sub_pc_menu ul li a {position: relative; font-size: 20px; color: #737373; font-weight: 300;}
#sub_content {padding-top: 100px; margin-bottom: 120px;}
.sub_inner {max-width: 1400px; width: 100%; margin: 0 auto;}
.sub_txt_wrap {text-align: center;}
.sub_txt_wrap em {font-size: 20px; letter-spacing: 4px; color: #da291c; font-weight: 800;}
.sub_txt_wrap h2 {font-size: 50px; color: #000; font-weight: 800;}
.sub_menu {display: none;}

.coming_soon {margin: 50px 0; text-align: center; }

/* 오시는 길 */

.loc_wrap {margin-top: 100px;}
.loc_tp_txt {position: relative; text-align: center; padding-top: 100px;}
.loc_tp_txt:before {content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 1013px; height: 125px; background: url("/images/sub/loc_tp_txt.png") center no-repeat; background-size: 100%;}
.loc_tp_txt h2 {font-size: 40px; color: #000; font-weight: 800;}
.loc_tp_txt h2 span {color: #fd0115;}
.loc_map {margin-top: 40px; position: relative; height: 650px;}
.loc_map iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.loc_map .root_daum_roughmap .wrap_controllers {display: none;}
.loc_map .root_daum_roughmap .wrap_map {height: 650px;}
.loc_map_btn {margin-top: 40px; display: flex; align-items: center; justify-content: center;}
.loc_map_btn .loc_map_more {display: flex; align-items: center; justify-content: center; height: 85px; border-radius: 40px; background: #fd0115; color: #fff; font-size: 26px; color: #fff; font-weight: 800; padding: 0 50px;}
.loc_map_btn .loc_map_more .loc_ic {display: inline-block; vertical-align: middle; width: 20px; height: 25px; background: url("/images/sub/loc_btn1.png") center no-repeat; background-size: 100%; margin-right: 10px;}
.loc_menu {margin-top: 60px;}
.loc_menu ul {display: flex; align-items: center; margin-bottom: 20px;}
.loc_menu ul li {display: flex; align-items: center; margin-right: 0;}
.loc_menu ul li strong {position: relative; font-size: 32px;color: #000; font-weight: 800; margin-right: 30px; padding-left: 40px;}
.loc_menu ul li strong .add_txt {font-size: 25px;}
.loc_menu ul li span .add_txt {font-size: 24px;}
.loc_menu ul li span {font-size: 30px; color: #000;}
.loc_menu ul li .loc_ic {position: absolute; top: 5px; left: 0; width: 20px; height: 26px; background: url("/images/sub/loc_btn2.png") center no-repeat; background-size: 100%; }

/* 보관물류 */

.sto_sec{margin-top:130px}
.storage .hover{display:none}
.storage .title{font-size:38px; font-weight:800; margin-bottom:40px}
.sto_sec1{margin-top:110px}
.sto_sec1 .tit{font-size:38px; text-align:center; margin-bottom:70px}
.sto_sec1 ul{display:flex; justify-content:space-between;}
.sto_sec1 ul li{width:400px; height:400px; background:#f1f1f1; border-radius:100%; text-align:center; box-sizing:border-box; padding:75px 0}
.sto_sec1 ul li:hover {background:#da291c; color:#fff}
.sto_sec1 ul li:hover .basic{display:none}
.sto_sec1 ul li:hover .hover{display:inline-block}
.sto_sec1 ul li img{width:92px}
.storage ul li strong{display:block; font-size:32px; margin:30px 0 15px}
.storage ul li p{font-size:20px; font-weight:500; line-height:1.5}
.storage .mob_br{display:none}
.sto_sec2{width:100%; background:#f1f1f1; padding:105px 0}
.sto_sec2 .tit{text-align:center; font-size:38px; font-weight:500; line-height:1.4; margin-bottom:85px; position:relative}
.sto_sec2 .tit:before{content:'['; display:block; font-size:100px; font-weight:900;color:#da291c; position:absolute; left:310px; bottom:-6px}
.sto_sec2 .tit:after{content:']'; display:block; font-size:100px; font-weight:900;color:#da291c; position:absolute; right:310px; bottom:-6px}
.sto_sec2 .tit span{font-size:45px; display:block;}
.sto_sec2 .tit span em{font-weight:900; color:#da291c}
.sto_sec2 ul:after{content:''; display:block; clear:both}
.sto_sec2 ul li{float:left; width:33.3%; text-align:center; border-right: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8; padding:45px 0}
.sto_sec2 ul li img{width:138px}
.sto_sec2 ul li:nth-child(3), .sto_sec2 ul li:nth-child(6){border-right:none}
.sto_sec2 ul li:nth-child(n+4){border-bottom:none}
.sto_sec2 ul li:hover{background:#616161; color:#fff}
.sto_sec2 ul li:hover .basic{display:none}
.sto_sec2 ul li:hover .hover{display:inline-block}

.sto_sec3 table{width:100%; text-align:center; border-collapse: collapse; border-top:1px solid #d1d1d1}
.sto_sec3 table tr{border-bottom:1px solid #d1d1d1}
.sto_sec3 table th{font-size:27px; font-weight:600; padding:25px 0; width:20%}
.sto_sec3 table td{font-size:22px; padding:15px 0}

.storage .img_wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap: 60px 0;}
.storage .img_wrap .popup_inner img{width:670px}
.storage .img_wrap .popup_inner{position:relative;}
.storage .img_wrap .popup_inner::before {content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background:rgba(218,41,28,0.5); opacity:0; transition:all 0.3s}
.storage .img_wrap .popup_inner::after {content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50% , -50%); width: 70px; height: 70px; background: url("/images/sub/more-btn.png") no-repeat center / 100%; z-index:100; opacity:0; transition:all 0.3s}
.storage .img_wrap .popup_inner:hover:before {opacity:1}
.storage .img_wrap .popup_inner:hover:after {opacity:1}
.storage .img_wrap .popup_menu{display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 300;}
.storage .img_wrap .popup_menu.on {display: flex; align-items: center; justify-content: center;}
.storage .img_wrap .popup_menu_inner{position: relative; width: 1000px;}
.storage .img_wrap .popup_menu img{width:1000px}
.storage .img_wrap .popup_menu .popup_close{position: absolute; top: -40px; right: -60px; width: 30px; height: 30px; cursor: pointer;}
.storage .img_wrap .popup_menu .popup_close:before{content: ""; position: absolute; top: 0; left: 0; width: 2px; height: 30px; transform: rotate(45deg); background: #fff;}
.storage .img_wrap .popup_menu .popup_close:after{content: ""; position: absolute; top: 0; left: 0; width: 2px; height: 30px; transform: rotate(-45deg); background: #fff;}

#dpp_pic_list, #dpd_view, .dpp_bd_write, .dpp_basic_bd  {margin-top: 50px;}



@media screen and (max-width: 1420px) {
    
    /* 공통 */

    .sub_visual { height: 42.25vw;}
    .sub_vis_txt h2 {font-size: 4.93vw;}
    .sub_vis_txt p {font-size: 1.41vw; margin-top: 0.70vw;}

    .sub_pc_menu {height: 7.75vw;}
    .sub_pc_menu ul li {margin: 0 2.11vw;}
    .sub_pc_menu ul li a {font-size: 1.41vw;}
    #sub_content {padding-top: 7.04vw; margin-bottom: 8.45vw;}
    .sub_inner {max-width: 100%; padding: 0 3.52vw;}
    .sub_txt_wrap em {font-size: 1.41vw; letter-spacing: 0.28vw;}
    .sub_txt_wrap h2 {font-size: 3.52vw;}

	/* 오시는 길 */

	.loc_wrap {margin-top: 7.04vw;}
	.loc_tp_txt {  padding-top: 7.04vw;}
	.loc_tp_txt:before {width: 71.34vw; height: 8.80vw;}
	.loc_tp_txt h2 {font-size: 2.82vw;  }
	.loc_map {margin-top: 2.82vw; height: 45.77vw;}
	.loc_map .root_daum_roughmap .wrap_map {height: 45.77vw;}
	.loc_map_btn {margin-top: 2.82vw;}
	.loc_map_btn .loc_map_more {height: 5.99vw; border-radius: 2.82vw; font-size: 1.83vw;   padding: 0 3.52vw;}
	.loc_map_btn .loc_map_more .loc_ic {  width: 1.41vw; height: 1.76vw; margin-right: 0.70vw;}
	.loc_menu {margin-top: 4.23vw;}
	.loc_menu ul { margin-bottom: 1.41vw;}
	.loc_menu ul li {margin-right: 9.15vw;}
	.loc_menu ul li strong { font-size: 2.25vw;  padding-left: 2.82vw;}
	.loc_menu ul li strong .add_txt {font-size: 1.76vw;}
	.loc_menu ul li span .add_txt {font-size: 1.69vw;}
	.loc_menu ul li span {font-size: 2.11vw; }
	.loc_menu ul li .loc_ic { top: 0.35vw;  width: 1.41vw; height: 1.83vw;  }

	/* 보관물류 */

	.sto_sec{margin-top:9.15vw}
	.storage .title{font-size:2.68vw;  margin-bottom:2.82vw}
	.sto_sec1{margin-top:7.75vw}
	.sto_sec1 .tit{font-size:2.68vw;  margin-bottom:4.93vw}
	.sto_sec1 ul li{width:28.17vw; height:28.17vw; padding:5.28vw 0}
	.sto_sec1 ul li img{width:6.48vw}
	.storage ul li strong{ font-size:2.25vw; margin:2.11vw 0 1.06vw}
	.storage ul li p{font-size:1.41vw;}
	.sto_sec2{padding:7.39vw 0}
	.sto_sec2 .tit{ font-size:2.68vw; margin-bottom:5.99vw;}
	.sto_sec2 .tit:before{font-size:7.04vw; left:18.83vw; bottom:-0.42vw}
	.sto_sec2 .tit:after{font-size:7.04vw; right:18.83vw; bottom:-0.42vw}
	.sto_sec2 .tit span{font-size:3.17vw;}
	.sto_sec2 ul li{padding:3.17vw 0}
	.sto_sec2 ul li img{width:9.72vw}
	.sto_sec3 table th{font-size:1.90vw; padding:1.76vw 0;}
	.sto_sec3 table td{font-size:1.55vw; padding:1.06vw 0}
	.storage .img_wrap{gap: 3.43vw 0;}
	.storage .img_wrap .popup_inner img{width:44.18vw;}
	.storage .img_wrap .popup_inner::after {width: 4.93vw; height: 4.93vw;}
	.storage .img_wrap .popup_menu_inner{width: 70.42vw;}
	.storage .img_wrap .popup_menu img{width:65.42vw}
	.storage .img_wrap .popup_menu .popup_close{top: -2.82vw; right: 0.77vw; width: 2.11vw; height: 2.11vw;}
	.storage .img_wrap .popup_menu .popup_close:before{height: 2.11vw;}
	.storage .img_wrap .popup_menu .popup_close:after{height: 2.11vw;}

	#dpp_pic_list, #dpd_view, .dpp_bd_write, .dpp_basic_bd  {margin-top: 3.52vw;}

}

@media screen and (max-width: 1024px) {
   
    /* 공통 */

    .sub_visual { height: 58.59vw;}
    .sub_vis_txt h2 {font-size: 6.84vw;}
    .sub_vis_txt p {font-size: 1.95vw; margin-top: 0.98vw;}

    .sub_pc_menu {height: 10.74vw;}
    .sub_pc_menu ul li {margin: 0 2.93vw;}
    .sub_pc_menu ul li a {font-size: 1.95vw;}
    #sub_content {padding-top: 9.77vw; margin-bottom: 11.72vw;}
    .sub_inner {padding: 0 3.91vw;}
    .sub_txt_wrap em {font-size: 1.95vw; letter-spacing: 0.39vw;}
    .sub_txt_wrap h2 {font-size: 4.88vw;}

	/* 오시는 길 */

	.loc_wrap {margin-top: 9.77vw;}
	.loc_tp_txt {  padding-top: 9.77vw;}
	.loc_tp_txt:before {width: 98.93vw; height: 12.21vw;}
	.loc_tp_txt h2 {font-size: 3.91vw;  }
	.loc_map {margin-top: 3.91vw; height: 63.48vw;}
	.loc_map .root_daum_roughmap .wrap_map {height: 63.48vw;}
	.loc_map_btn {margin-top: 3.91vw;}
	.loc_map_btn .loc_map_more {height: 8.30vw; border-radius: 3.91vw; font-size: 2.54vw;   padding: 0 4.88vw;}
	.loc_map_btn .loc_map_more .loc_ic {  width: 1.95vw; height: 2.44vw; margin-right: 0.98vw;}
	.loc_menu {margin-top: 5.86vw;}
	.loc_menu ul { margin-bottom: 1.95vw; }
	.loc_menu ul li{align-items:flex-start; margin:0}
	.loc_menu ul li strong { font-size: 3.13vw;  margin-right: 2.93vw; padding-left: 3.91vw; width: 15%;}
	.loc_menu ul li strong .add_txt {font-size: 2.44vw;}
	.loc_menu ul li span .add_txt {font-size: 2.34vw;}
	.loc_menu ul li span {font-size: 2.93vw; white-space:nowrap}
	.loc_menu ul li .loc_ic { top: 0.49vw;  width: 1.95vw; height: 2.54vw;  }

	/* 보관물류 */

	.sto_sec{margin-top:9.18vw}
	.storage .title{font-size:2.64vw;  margin-bottom:2vw}
	.sto_sec1{margin-top:7.71vw}
	.sto_sec1 .tit{font-size:3.64vw;  margin-bottom:4.88vw}
	.sto_sec1 ul li{width:29.13vw; height:29.13vw; padding:5.27vw 0}
	.sto_sec1 ul li img{width:6.45vw}
	.storage ul li strong{ font-size:2.5vw; margin:2.15vw 0 1.07vw}
	.storage ul li p{font-size:1.6vw;}
	.sto_sec2{padding:7.42vw 0}
	.sto_sec2 .tit{ font-size:3.64vw; margin-bottom:5.96vw;}
	.sto_sec2 .tit:before{font-size:9.03vw; left:9.85vw; bottom:-0.39vw}
	.sto_sec2 .tit:after{font-size:9.03vw; right:9.85vw; bottom:-0.39vw}
	.sto_sec2 .tit span{font-size:4.13vw;}
	.sto_sec2 ul li{padding:3.13vw 0}
	.sto_sec2 ul li img{width:9.77vw}
	.sto_sec3 table th{font-size:2.2vw; padding:1.76vw 0;}
	.sto_sec3 table td{font-size:1.8vw; padding:1.07vw 0}
	.sto_sec3 table .tab_none{display: none;}
	.storage .img_wrap{gap: 1.8vw 0;}
	.storage .img_wrap .popup_inner img{width:44.14vw}
	.storage .img_wrap .popup_inner::after {width: 4.88vw; height: 4.88vw;}
	.storage .img_wrap .popup_menu_inner{width: 70.41vw;}
	.storage .img_wrap .popup_menu img{width:65.43vw}
	.storage .img_wrap .popup_menu .popup_close{top: -2.83vw; right: 0.78vw; width: 2.15vw; height: 2.15vw;}
	.storage .img_wrap .popup_menu .popup_close:before{height: 2.15vw;}
	.storage .img_wrap .popup_menu .popup_close:after{height: 2.15vw;}

	#dpp_pic_list, #dpd_view, .dpp_bd_write, .dpp_basic_bd  {margin-top: 4.88vw;}

}

@media screen and (max-width: 768px) {
    
    /* 공통 */

    .sub_visual { height: 78.13vw;}
    .sub_vis_txt h2 {font-size: 9.11vw;}
    .sub_vis_txt p {font-size: 3.13vw; margin-top: 1.30vw;}

    .sub_pc_menu {display: none;}
    .sub_menu {display: block; position: relative; z-index: 20;}
    .sub_menu > ul {position: relative; display: flex; align-items: center; height: 14.32vw; border-bottom: 1px solid #e5e5e5;}
    .sub_menu > ul > li {position: relative; height: 100%;}
    .sub_menu > ul > li + li:before {content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 1px; height: 2.60vw; background: #e5e5e5;}
    .sub_menu > ul > li > a {display: flex; height: 100%; align-items: center; padding-left: 2.60vw; color: #000; font-size: 3.26vw;}
    .sub_menu > ul > li.home {width: 11.72%}
    .sub_menu > ul > li.home > a {background: url("/images/sub/home_ic.png") center no-repeat; background-size: 3.52vw}
    .sub_menu > ul > li.menu_btn {width: 44.14%; background: url("/images/sub/sub_menu_arrow.png") right 2.60vw center no-repeat; background-size: 1.43vw;}
    .sub_menu > ul > li.menu_btn.on {background: #e60012 url("/images/sub/sub_menu_arrow_on.png") right 2.60vw center no-repeat; background-size: 1.43vw;}
    .sub_menu > ul > li.menu_btn.on > a {color: #fff;}

    .sub_menu_txt {display: none; position: absolute; left: 0; width: 100%; background: #fff; border: 1px solid #e5e5e5;}
    .sub_menu_txt li {height: 11.72vw; border-bottom: 1px solid #e5e5e5;}
    .sub_menu_txt li a {display: flex; align-items: center; padding-left: 2.60vw; font-size: 3.13vw; color: #000; height: 100%;}
    .sub_menu_txt li:hover a {color: #e60012;}


    #sub_content {padding-top: 13.02vw; margin-bottom: 15.63vw;}
    .sub_inner {padding: 0 2.60vw;}
    .sub_txt_wrap em {font-size: 2.60vw; letter-spacing: 0.52vw;}
    .sub_txt_wrap h2 {font-size: 6.51vw;}


	/* 오시는 길 */

	.loc_wrap {margin-top: 13.02vw;}
	.loc_tp_txt {  padding-top: 13.02vw;}
	.loc_tp_txt:before {width: 100%; height: 16.28vw;}
	.loc_tp_txt h2 {font-size: 5.21vw;  }
	.loc_map {margin-top: 5.21vw; height: 84.64vw;}
	.loc_map .root_daum_roughmap .wrap_map {height: 84.64vw;}
	.loc_map_btn {margin-top: 5.21vw;}
	.loc_map_btn .loc_map_more {height: 11.07vw; border-radius: 5.21vw; font-size: 3.39vw;   padding: 0 6.51vw;}
	.loc_map_btn .loc_map_more .loc_ic {  width: 2.60vw; height: 3.26vw; margin-right: 1.30vw;}
	.loc_menu {margin-top: 7.81vw;}
	.loc_menu ul { margin-bottom: 2.60vw;}
	.loc_menu ul li {flex-wrap: wrap;}
	.loc_menu ul li strong { font-size: 4.17vw;  margin-right: 3.91vw; padding-left: 5.21vw;}
	.loc_menu ul li strong .add_txt {font-size: 3.26vw;}
	.loc_menu ul li span .add_txt {font-size: 3.13vw;}
	.loc_menu ul li span {font-size: 3.91vw;  word-break: keep-all; margin-top: 2.60vw; line-height: 1.3; white-space:normal}
	.loc_menu ul li .loc_ic { top: 0.65vw;  width: 2.60vw; height: 3.39vw;  }

	/* 보관물류 */

	.sto_sec{margin-top:14.24vw}
	.storage .title{font-size:4.3vw;  margin-bottom:2.95vw}
	.sto_sec1{margin-top:7.68vw}
	.sto_sec1 .tit{font-size:4.3vw;  margin-bottom:4.82vw}
	.sto_sec1 ul{flex-direction:column; align-items: center;}
	.sto_sec1 ul li{width:50.17vw; height:50.17vw; padding:7.6vw 6vw; margin-bottom:3vw}
	.sto_sec1 ul li:last-child{margin-bottom:0}
	.sto_sec1 ul li img{width:10.51vw}
	.storage ul li strong{ font-size:4vw; margin:3.41vw 0 1.4vw}
	.storage ul li p{font-size:3.1vw; word-break:keep-all}
	.storage .mob_br{display:block !important}
	.sto_sec1 ul li p br{display:none}
	.sto_sec2{padding:10.42vw 0 11.42vw}
	.sto_sec2 .tit{ font-size:4.3vw; margin-bottom:7.99vw;}
	.sto_sec2 .tit:before{font-size:10.98vw; left:3.90vw; bottom:-0.39vw}
	.sto_sec2 .tit:after{font-size:10.98vw; right:3.90vw; bottom:-0.39vw}
	.sto_sec2 .tit span{font-size:5.5vw;}
	.sto_sec2 ul li{padding:5.13vw 0; width:50%}
	.sto_sec2 ul li:nth-child(even){border-right:none}
	.sto_sec2 ul li:nth-child(odd){border-right:1px solid #d8d8d8}
	.sto_sec2 ul li:nth-child(4){border-bottom:1px solid #d8d8d8}
	.sto_sec2 ul li img{width:10.77vw}
	.sto_sec3 .table_wrap{width:100%; overflow-x:scroll; white-space:nowrap; }
	.sto_sec3 table {width:150vw;}
	.sto_sec3 table th{font-size:3.4vw; padding:2.82vw 0;}
	.sto_sec3 table td{font-size:3.1vw; padding:2.04vw 0}
	.sto_sec3 table .tab_none{display: block;}
	.storage .img_wrap {flex-direction:column; gap: 3vw 0;}
	.storage .img_wrap .popup_inner img{width:100%;}
	.storage .img_wrap .popup_inner::after {display:none}
	.storage .img_wrap .popup_inner:before{display:none}
	.storage .img_wrap .popup_menu.on{display:none}

	#dpp_pic_list, #dpd_view, .dpp_bd_write, .dpp_basic_bd  {margin-top: 6.51vw;}
}