@charset "utf-8";

@import url(base.css);
@import url(common.css);

#sb_wrap {float:left; width:100%; min-width:1200px;}

#sb_wrap header {position:relative; float:left; width:100%; height:210px;}
#sb_wrap header.bg01 {background:url("../img/common/subVisual01.jpg") 50% 50% / cover no-repeat;}
#sb_wrap header.bg02 {background:url("../img/common/subVisual02.jpg") 50% 50% / cover no-repeat;}
#sb_wrap header.bg03 {background:url("../img/common/subVisual03.jpg") 50% 50% / cover no-repeat;}
#sb_wrap header.bg04 {background:url("../img/common/subVisual04.jpg") 50% 50% / cover no-repeat;}
#sb_wrap header h1 {position:absolute; left:70px; top:57px;}
#sb_wrap header > p {position:absolute; left:70px; top:120px; font-size:18px; line-height:36px; font-family:"notoBlack"; color:white;}
#sb_wrap header div {width:100%; height:100%; padding-top:70px; box-sizing:border-box; text-align:center;}
#sb_wrap header div h2 {font-size:48px; font-family:"notoMedium"; color:white;}

.sb_navBtn {position:fixed; right:0; top:0; width:90px; height:100%; border-left:1px solid #e5e5e5;}

.sb_nav {float:left; width:100%; padding-right:120px; box-sizing:border-box; background:#f5f5f5;}
.sb_nav a {display:block; float:left; width:100%; height:60px; padding-top:18px; box-sizing:border-box; font-size:16px; font-family:"notoDemiLight"; text-align:center; color:#000 !important; border-left:1px solid #fff;}
.sb_nav a:first-child {border-left:none;}
.sb_nav a.on {color:#fff !important; background:#223771;}
.sb_nav.num6 a {width:16%;}
.sb_nav.num6 a:first-child {width:20%;}
.sb_nav.num3 a {width:33.3%;}
.sb_nav.num3 a:first-child {width:33.4%;}
.sb_nav.num4 a {width:25%;}
.sb_nav.num2 a {width:50%;}
.sb_nav.num1 a {width:100%; padding-left:110px;}

#sb_wrap article {width:1200px; margin:0 auto;}
#sb_wrap article > div {float:left; width:100%; padding:50px 0 120px;}
#sb_wrap article h3 {position:relative; float:left; width:100%; margin-bottom:25px; padding-bottom:25px; font-size:32px; font-family:"notoMedium"; text-align:center;}

#sb_wrap aside {position:fixed; right:0; top:0; width:120px; height:100%; background:#223771;}
#sb_wrap aside button {position:absolute; left:43px; top:35px; width:31px; height:22px; background:url("../img/common/btnNav.png") no-repeat;}
#sb_wrap aside a:nth-child(2) {position:absolute; left:35px; top:80px; width:60px; height:22px; font-size:14px; font-family:"notoDemiLight"; color:#fff;}
#sb_wrap aside a:nth-child(3) {position:absolute; left:35px; top:110px; width:60px; height:22px; font-size:14px; font-family:"notoDemiLight"; color:#fff;}
#sb_wrap aside a:nth-child(4) {position:absolute; left:35px; top:140px; width:60px; height:22px; font-size:14px; font-family:"notoDemiLight"; color:#fff;}
#sb_wrap aside a:nth-child(5) {position:absolute; left:35px; top:170px; width:60px; height:22px; font-size:14px; font-family:"notoDemiLight"; color:#fff;}
#sb_wrap aside a:nth-child(6) {position:absolute; left:50%; top:50%; display:block; width:29px; height:30px; margin:-15px 0 0 -15px;background:url("../img/common/topLink.png") no-repeat; }

footer {position:relative; float:left; width:100%; min-width:1200px; height:80px; padding:20px 0 0 70px; box-sizing:border-box; font-family:"notoLight"; font-size:12px; letter-spacing:1px; color:white; background:#111111;}
footer address {margin-bottom:5px; }
footer img {position:absolute; right:93px; top:27px;}

/*---------------------*/
/* contents */
/*---------------------*/

.sb_location {position:relative; float:left; width:100%; margin-bottom:30px;}
.sb_location #map01 {float:left; width:100%; height:590px; margin-bottom:45px;}
.sb_location #map02 {float:left; width:100%; height:590px; margin-bottom:45px;}
.sb_location .box {position:relative; float:left; width:100%; margin-bottom:70px; padding:10px 0 0 600px; box-sizing:border-box;}
.sb_location .box.icon01 {background:url("../img/sub01/icon_location01.jpg") 4px 74px no-repeat;}
.sb_location .box.icon02 {background:url("../img/sub01/icon_location02.jpg") 13px 60px no-repeat;}
.sb_location .box h4 {position:absolute; left:0; top:0; font-size:36px; font-family:"notoMedium";}
.sb_location .box li {position:relative; margin-bottom:15px; padding-left:80px; box-sizing:border-box; font-family:"notoDemiLight"; font-size:16px;}
.sb_location .box li em {position:absolute; left:0; top:0; color:#223771; font-family:"notoMedium";}



/*-----------------*/
/* 사엽영역 */
/*-----------------*/

.sb_tab {float:left; width:100%; margin-bottom:70px; text-align:center;}
.sb_tab a {display:inline-block; width:300px; height:50px; padding-top:10px; box-sizing:border-box; font-size:18px; border:1px solid #dddddd;}
.sb_tab a.on {color:#fe7e00; border:1px solid #fe7e00;}

.sb_list {float:left; width:100%;}
.sb_list .box {position:relative; float:left; width:100%; min-height:320px; margin-bottom:40px; padding:0 0 40px 450px; box-sizing:border-box; font-size:16px; line-height:28px; font-family:"notoDemiLight"; border-bottom:1px solid #e8e8e8;}
.sb_list .box img {position:absolute; left:0; top:0; width:410px; height:280px;}
.sb_list .box p {position:relative; width:100%; box-sizing:border-box;}
.sb_list .box p em {position:absolute; left:0; top:0; color:#888888;}
.sb_list .box .title {margin-bottom:30px; padding-bottom:30px; font-size:26px; border-bottom:1px solid #e8e8e8;}
.sb_list .box .date {margin-bottom:15px; padding-left:80px;}
.sb_list .box .order {margin-bottom:30px; padding:0 0 30px 80px; border-bottom:1px solid #e8e8e8;}
.sb_list .box .product {padding-left:80px;}
.sb_list .box a {position:absolute; right:0; top:0; display:block; width:90px; height:35px; padding-top:2px; box-sizing:border-box; text-align:center; color:#fe7e00; border:1px solid #fe7e00;}
.sb_list .view {float:left; width:100%; margin-bottom:30px; padding:80px 0; text-align:center; border-bottom:1px solid #e8e8e8;}
.sb_list .btn {float:left; width:100%; text-align:center;}
.sb_list .btn a {display:inline-block; width:90px; height:35px; padding-top:5px; box-sizing:border-box; font-size:16px; color:#fe7e00; border:1px solid #fe7e00;}



/* list */
.sb_build {float:left; width:100%; margin-bottom:70px;}

.sb_build .search {float:left; width:100%; margin-bottom:26px;}
.sb_build .search .category {float:left; width:100%; margin-bottom:15px;}
.sb_build .search .category a {float:left; display:block; width:16.6%; padding-top:35px; font-family:"notoDemiLight"; font-size:16px; text-align:center;}
.sb_build .search .category a:nth-child(1) {width:17%; background:url("../img/sub03/icon_category01.jpg") 50% 0 / 19px no-repeat;}
.sb_build .search .category a:nth-child(2) {background:url("../img/sub03/icon_category02.jpg") 50% 1px / 36px no-repeat;}
.sb_build .search .category a:nth-child(3) {background:url("../img/sub03/icon_category03.jpg") 50% 0 / 24px no-repeat;}
.sb_build .search .category a:nth-child(4) {background:url("../img/sub03/icon_category04.jpg") 50% 0px / 26px no-repeat;}
.sb_build .search .category a:nth-child(5) {background:url("../img/sub03/icon_category05.jpg") 50% 0 / 26px no-repeat;}
.sb_build .search .category a:nth-child(6) {background:url("../img/sub03/icon_category06.jpg") 50% 8px / 24px no-repeat;}
.sb_build .search .category a span {display:block; width:100%; height:30px; padding-top:2px; box-sizing:border-box;}
.sb_build .search .category a span.on {color:white; background:black;
	-webkit-border-radius:20px;/*Safari, Chrome*/
	-moz-border-radius:20px;/*Firefox*/
	border-radius:20px;
}
.sb_build .search .select {width:100%; margin-bottom:5px; box-sizing:border-box; }
.sb_build .search .select.left {float:left; width:170px; margin:0 20px 0 0; }
.sb_build .search .select.right {float:left; width:170px; padding:0 0 0 5px;}
.sb_build .search .select select {width:100%; height:45px; font-family:"notoDemiLight"; background:url("../img/sub03/arrowSelect.jpg") 100% 50% / 8px no-repeat; border-bottom:1px solid black; font-family:"notoDemiLight"; font-size:16px;}
.sb_build .search .text {position:relative; float:right; width:781px; height:45px; padding-right:50px; box-sizing:border-box; border-bottom:1px solid black; }
.sb_build .search .text input[type="text"] {width:100%; height:100%; font-family:"notoDemiLight"; font-family:"notoDemiLight"; font-size:16px;}
.sb_build .search .text input[type="submit"] {position:absolute; right:0; top:0; width:45px; height:45px; font-size:0; text-indent:-99999px; background:url("../img/sub03/search.jpg") 50% 50% / 20px no-repeat; font-family:"notoDemiLight"; font-size:16px;}

.sb_build .all {float:left; width:100%; margin-bottom:10px; font-family:"notoDemiLight"; font-size:16px;}

.sb_build .list {float:left; width:100%;}
.sb_build .list > div {float:left; width:360px; height:460px; margin-bottom:20px; margin:0 60px 0 0;}
.sb_build .list > div:nth-child(3n+0) {margin:0;}
.sb_build .list > div a {display:block; width:100%; font-family:"notoRegular";}
.sb_build .list img {width:360px; height:270px; margin-bottom:10px;}
.sb_build .list dd:nth-child(2) {margin-bottom:8px; font-size:16px; color:#223771; }
.sb_build .list dd:nth-child(2) span {position:relative; display:inline-block; margin-right:20px; padding-left:16px; background:url("../img/sub03/icon_location.jpg") 0 1px / 12px no-repeat;}
.sb_build .list dd:nth-child(2) span::after {position:absolute; right:-10px; top:4px; display:block; width:1px; height:10px; content:""; background:#e5e5e5;}
.sb_build .list dt {overflow:hidden; max-height:50px; margin-bottom:8px; font-size:18px; line-height:24px;}
.sb_build .list dd:nth-child(3) {font-size:16px; color:#777777;}

.sb_build .paging {position:relative; float:left; width:100%; margin-top:-20px; padding:20px 60px 0; box-sizing:border-box; text-align:center; border-top:1px solid #e5e5e5;}
.sb_build .paging .first {position:absolute; left:0; top:20px; display:block; width:30px; height:30px; background:url("../img/sub03/paging_first.jpg") 50% 50% / auto 14px no-repeat;}
.sb_build .paging .prev {position:absolute; left:30px; top:20px; display:block; width:30px; height:30px; background:url("../img/sub03/paging_prev.jpg") 50% 50% / auto 14px no-repeat;}
.sb_build .paging .next {position:absolute; right:30px; top:20px; display:block; width:30px; height:30px; background:url("../img/sub03/paging_next.jpg") 50% 50% / auto 14px no-repeat;}
.sb_build .paging .last {position:absolute; right:0; top:20px; display:block; width:30px; height:30px; background:url("../img/sub03/paging_last.jpg") 50% 50% / auto 14px no-repeat;}
.sb_build .paging div em, .sb_build .paging div a {display:inline-block; min-width:30px; height:30px; padding:5px 2px 0; box-sizing:border-box; font-family:"notoRegular"; font-size:14px;}
.sb_build .paging div em {color:white; background:black;}



/* view */
.sb_buildView {float:left; width:100%; margin-bottom:70px;}

.sb_buildView h4 {float:left; width:100%; margin-bottom:25px; padding-bottom:25px; font-family:"notoRegular"; font-size:28px; border-bottom:1px solid black;}

.sb_buildView dl {margin-bottom:25px; font-family:"notoDemiLight"; }
.sb_buildView dl dt {margin-bottom:10px; font-family:"notoDemiLight"; font-size:16px;}
.sb_buildView dl dd {float:left; color:#777777; font-family:"notoDemiLight"; font-size:16px; margin-bottom:25px;}
.sb_buildView dl dd::after {content:"  │  ";}
.sb_buildView dl dd em {display:inline-block; margin-right:10px; color:#000; font-family:"notoRegular"; font-size:16px;}

.sb_buildView .contents {float:left; width:100%; margin-bottom:25px; padding-bottom:25px; padding-top:30px; font-family:"notoRegular"; font-size:16px; border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5;}
.sb_buildView .contents img {width:100%;}

.sb_buildView .btn {position:relative; float:left; width:100%; text-align:center;}
.sb_buildView .btn .prev {position:absolute; left:0; top:0; display:block; height:40px; padding:11px 0 0 18px; box-sizing:border-box; font-family:"notoRegular"; font-size:16px; line-height:18px; background:url("../img/sub03/paging_prev.jpg") 0 50% / auto 14px no-repeat;}
.sb_buildView .btn .list {display:inline-block; width:200px; height:50px; padding-top:10px; box-sizing:border-box; font-family:"notoRegular";  font-size:16px; line-height:25px; border:1px solid black;}
.sb_buildView .btn .next {position:absolute; right:0; top:0; display:block; height:40px; padding:11px 18px 0 0; box-sizing:border-box; font-family:"notoRegular"; font-size:16px; line-height:18px; background:url("../img/sub03/paging_next.jpg") 100% 50% / auto 14px no-repeat;}