@charset "utf-8";
/* CSS Document */


.skipmenu_list {position:relative;}
.skipmenu_list a {position:absolute; top:0; left:0; right:0; display:block; height:0; font-size:0; background:#4682e6; color:#fff; }
.skipmenu_list a:active, .skipmenu_list a:focus {height:auto; padding:1em 0; font-size:1em; text-align:center; z-index: 9999;}
a {color:#333;}
.sg-wrap {width:100%;  margin:0 auto;}
.sg-topm{width:100%; height:35px; border-bottom:1px solid #e4e4e4; box-sizing: content-box;}
.sg-topm ul{ max-width:1200px; margin:0 auto; overflow: hidden; text-align:right;}
.sg-topm ul li {display:inline-block; float:left; overflow:hidden;}
.sg-topm ul li.softbowl{float:right;width:100px; height:35px; background:url(../images/common/softbowl.png) center no-repeat; }
.sg-topm ul li.blog{float:right;width:54px; height:35px; background:url(../images/common/sg-sns4.jpg) center no-repeat; }
.sg-topm ul li.facebook {float:right;width:85px; height:35px; background:url(../images/common/sg-sns3.gif) center #3b5998 no-repeat; }
.sg-topm ul li.kakao {float:right;width:199px; height:35px; background:url(../images/common/top-kakao.png) center #3b5998 no-repeat; }
.sg-topm ul li.kakao1 {float:right;width:110px; height:35px; background:url(../images/common/kakao1.png) center  no-repeat; border-right:1px solid #cfc5c5; box-sizing:border-box; }
.sg-topm ul li.kakao2 {float:right;width:126px; height:35px; background:url(../images/common/kakao2.png) center  no-repeat; }
.sg-topm ul li.pdf-down {width:auto; float:left; margin-top:5px; padding: 3px 15px 3px 0;}
.sg-topm ul li.pdf-down img{vertical-align: top;}
.sg-topm ul li span {display:inline-block; margin: 0 2px; font-size:13px; text-shadow:0.5px 0;}
.sg-topm ul li.li-text {padding-top:4px;}
.sg-topm ul li.pdf-down span span.red{color:#ef4638;}
.sg-topm ul li.pdf-down a:hover {color:#ef4638; text-decoration: underline;}
.sg-topm ul li a {display:block; width:100%; height:100%; font-size:0;}
.sg-topm ul li:nth-child(2){margin-left:-12px;}



.sg-topm ul li.sbgrid_v3 {float:right;width:auto;height:35px; }
.sg-topm ul li.sbgrid_v3 img {width:20px;display:inline-block; margin-right:7px; }
.sg-topm ul li.sbgrid_v3 a {font-size:15px; text-decoration:none;background:#f8f8f8;
display:flex; align-items:center; justify-content:center; padding:0 20px;color: #000;font-weight: bold;letter-spacing: -1px;
border-bottom: 1px solid #e4e4e4;
}
.sg-topm ul li.sbgrid_v3 a span {margin:0 3px;    color: #40bcd3;font-size: 15px;
    font-weight: 400;}
.sg-topm ul li.sbgrid_v3 a span.tit {color:#000;font-size: 15px;}

.sg-gnb-wrap {display:table; width:100%; max-width:1200px; margin:0 auto;}
.sg-gnb-wrap h1 {display:table-cell; padding:25px 0 20px 0; vertical-align: middle;}
.sg-gnb-wrap h1 a{display:block; width:190px; height:30px; /*margin-left:10px; */background: url(../images/common/SBGridLogo.png) left center no-repeat; /*background-size:160px;*/ font-size:0;}

/*quick*/
.fixed-nav {
	position: fixed;
	bottom: 5%;
	left: 30px;
	z-index: 9999;
  }
  .fixed-nav > span {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 70px;
	height: 70px;
	cursor: pointer;
	border-radius: 50%;
	box-sizing: border-box;
  }
  .fixed-nav > span a {
	position: relative;
	z-index: 9999;
	display: inline-block;
	width: 100%;
	height: 100%;
	text-align: center;
	padding-top: 18px;
	box-sizing: border-box;
	text-decoration:none;
  }
  .fixed-nav > span.demo-nav {
	position: relative;
	background: linear-gradient(45deg, #2979ef, #29c9ef);
	transition: 0.3s all;
	overflow: hidden;
  }
  .fixed-nav > span.demo-nav ul.sublink {
	position: absolute;
	left: 0;
	top: 0;
	width: 150px;
	height: 70px;
	opacity: 0;
  }
  .fixed-nav > span.demo-nav ul.sublink li {
	position: relative;
	display: inline-block;
	float: left;
	width: 100%;
	color: #fff;
	padding-left: 20px;
	box-sizing: border-box;
	text-align: center;
	height: 100%;
	padding: 10px 0;
  }
  .fixed-nav > span.demo-nav ul.sublink li:before {
	position: absolute;
	right: 0;
	left: 0;
	display: inline-block;
	width: 46px;
	height: 31px;
	margin: 0 auto;
	background: url(/images/common/demo-nav.png) no-repeat;
	text-align: center;
	content: '';
  }
  .fixed-nav > span.demo-nav ul.sublink li:hover {
	background: #2979ef;
	border-radius: 20px;
  }
  .fixed-nav > span.demo-nav ul.sublink li:hover a {
	padding-top: 36px;
	color: #fff;
	font-size: 14px;
	color: #93faff;
  }
  .fixed-nav > span.demo-nav ul.sublink li .demo-link {
	color: #fff;
  }
  .fixed-nav > span.demo-nav:hover {
	background: #2979ef;
	width: 150px;
	border-radius: 20px;
	transition: 0.3s all;
  }
  .fixed-nav > span.demo-nav:hover img {
	display: none;
  }
  .fixed-nav > span.demo-nav:hover ul.sublink {
	opacity: 1;
  }
  .fixed-nav > span.kakao-nav {
	position: relative;
	background: linear-gradient(45deg, #ffbe32, #ffe942);
	transition: 0.3s all;
	overflow: hidden;
  }
  .fixed-nav > span.kakao-nav ul.sublink {
	position: absolute;
	left: 0;
	top: 0;
	width: 200px;
	height: 70px;
	opacity: 0;
  }
  .fixed-nav > span.kakao-nav ul.sublink li {
	position: relative;
	display: inline-block;
	float: left;
	width: 100px;
	color: #000;
	padding-left: 20px;
	box-sizing: border-box;
	text-align: center;
	height: 100%;
	padding: 10px 0;
  }
  .fixed-nav > span.kakao-nav ul.sublink li:before {
	position: absolute;
	right: 0;
	left: 0;
	display: inline-block;
	width: 33px;
	height: 29px;
	margin: 0 auto;
	background: url(/images/common/subkakao.png) no-repeat;
	text-align: center;
	content: '';
  }
  .fixed-nav > span.kakao-nav ul.sublink li:first-child {
	border-right: 1px solid #ffef71;
  }
  .fixed-nav > span.kakao-nav ul.sublink li:last-child {
	padding-right: 0;
  }
  .fixed-nav > span.kakao-nav ul.sublink li a {
	display: block;
	font-size: 14px;
	padding-top: 2px;
	text-shadow: 0.5px 0 0 black;
	color: #391b1b;
  }
  .fixed-nav > span.kakao-nav ul.sublink li a span {
	display: inline-block;
	padding-top: 30px;
  }
  .fixed-nav > span.kakao-nav ul.sublink li:hover {
	background: #ffc932;
  }
  .fixed-nav > span.kakao-nav ul.sublink li:hover a {
	text-shadow: 0.5px 0 0 black;
	font-weight: 400;
  }
  .fixed-nav > span.kakao-nav:hover {
	background: #ffd541;
	width: 200px;
	border-radius: 20px;
	transition: 0.3s all;
  }
  .fixed-nav > span.kakao-nav:hover img {
	display: none;
  }
  .fixed-nav > span.kakao-nav:hover ul.sublink {
	opacity: 1;
  }
  .fixed-nav .kakao-nav {
	margin-top: 12px;
  }



header.sh {position:fixed; background:#2259b2;width:100%; height:60px; z-index:9990; -webkit-transition: All 0.2s ease;transition: All 0.2s ease; -webkit-transition: All 0.3s ease;-moz-transition: All 0.3s ease; -o-transition: All 0.3s ease;}
header.sh .sg-gnb-wrap {height:100%;}
header.sh .sg-gnb-wrap h1 {padding:0;}
header.sh .sg-gnb-wrap h1 a{width:190px; height:28px;/* margin-left:10px; */background:url(../images/common/SBGridLogo-white.png) left center no-repeat; background-size: 85%; font-size: 0; font-weight:600; letter-spacing: 1px;}
header.sh .sg-topm{display:none;}
header.sh .sg-gnb-box {position:relative; display:table; width:100%; height:100%;}
header.sh .sg-top-search {padding-top:0;overflow:visible;}
header.sh nav { vertical-align: middle;}
header.sh nav>ul>li {height:60px;  padding-top:0; padding-bottom:0;line-height:60px;}
header.sh nav>ul>li>a {color:#fff;font-size:17px;}
header.sh .subm {top:60px;}
header.sh .sg-top-search>div {padding-top:13px; padding-left:3em;}
header.sh .sg-top-search input {width: 220px; border: 0;}
header.sh .sg-top-search button{    background: url(../images/common/sg-search-btn.jpg) #fff center no-repeat;    border: 0;}

.sg-gnb-wrap .sg-gnb-box {display:table-cell; text-align:right;}
.sg-top-search {padding-top:20px; text-align:right;}
.sg-top-search input {width:270px; height:34px; padding-left:10px; background: #f8fafd; border: 1px solid #386ec7;}
.sg-top-search input::placeholder{color:#828b9a;font-size:13px;}
.sg-top-search button {float:left;display:block; width:33px; height:34px;  background: url(../images/common/sg-search-btn.jpg) center no-repeat; font-size:0; border:0; border:1px solid #d9d9d9; border-left:0;}
.sg-top-search>div {float:right; text-align:right;overflow:hidden;}

::-webkit-input-placeholder { font-size:14px; color: #b5bdcb; font-weight: 300; } /* Chrome/Opera/Safari */ 
::-moz-placeholder { font-size:14px; color: #b5bdcb;font-weight: 300; } /* firefox 19+ */ 
:-ms-input-placeholder {font-size:14px; color: #b5bdcb;font-weight: 300; } /* ie */ 
:-moz-placeholder {font-size:14px; color: #b5bdcb;font-weight: 300; } /*below firefox 19 */ 

header.sh .sg-search-box {position:absolute; right:0; padding:0.9em 0;}
header.sh nav>ul {text-align:right;}
header.sh .aa-input-icon {top:17px; right:13px;}

nav {display:block; width:100%;}
nav>ul {text-align:right;}
nav>ul>li {position:relative; display:inline-block; padding:25px 50px; }
nav>ul>li>a {display:block; width:100%; height:100%; font-size:17px; font-weight:400; text-shadow:0.5px 0;}
nav>ul>li:hover>a{text-decoration:none; text-shadow:0.5px 0; color:#386ec7;}
nav>ul>li:hover .subm{display:block;}
.subm {display:none; position:absolute; top:74px; left:-15px; width:190px;   background-color:#fff; border:1px solid #e4e4e4; border-top:none; z-index: 9990;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;}
.subm>li {height:45px; line-height:45px;}
.subm>li a {display:block; width:100%; height:100%; text-align:center;}
.subm>li.letter3 a{letter-spacing: -1px;}
.subm>li a:hover {text-decoration:none;}
.subm>li:hover {background:#386ec7;}
.subm>li:hover a {color:#fff;}

header.sh .sg-search-box {display:none;}

.rm-btn {display:none; width:60px; height:100%; background:url(../images/common/rm-btn.png) no-repeat center #2259b2; text-align:right; font-size:0;}
.rm-menu.block {display:block;}
.rm-menu {display:none; position:absolute; top:0; right:0;  width:70%; height:100%; background:#2259b2;z-index:9990;}
.rm-menu .close-btn { float:right; display:block; width:70px; height:70px; background:url(../images/common/rm-close.png) center no-repeat; font-size:0;}
.rm-menu a {text-decoration:none;}
.rm-menu>ul {padding-top:4em;}
.rm-menu>ul>li {border-bottom:1px solid #4f80cc; cursor:pointer;}
.rm-menu>ul>li:first-child {border-top:1px solid #4f80cc; cursor:pointer;}
.rm-menu>ul>li.plus>a{background: url(../images/main/rm-more.png) center right #2259b2 no-repeat;}
.rm-menu>ul>li>a{display:block; width:100%; height:50px; padding-left:39px;  line-height:50px; background:#2259b2;color:#fff; font-size:15px;}
.rm-menu>ul>li>ul>li {border-bottom:1px solid #e5e5e5;}
.rm-menu>ul>li>ul>li>a{display:block; width:100%; height:50px; padding-left:40px; line-height:50px; 
	background:#fff; color:#000; font-size:15px; text-shadow: 0.7px 0;}
.rm-subm {display:none;}
.rm-ssubm>li.more>a{background:url(../images/main/rm-more2.png) right no-repeat;}
.rm-ssubm {display:none; background:#f8f8f8;}
.rm-ssubm>li>ul {display:none; background: #e4e4e4}
.rm-ssubm>li>ul>li>a {display:block; width:100%; height:40px; padding-left:50px; line-height:40px; color:#444; font-size:14px; letter-spacing: -1px;
border-bottom:1px solid #d5d5d5;}
.rm-ssubm>li>a {display:block; width:100%; height:40px; padding-left:40px; line-height:40px; color:#444; font-size:14px; letter-spacing: -1px;
border-bottom:1px solid #e1e1e1;}
.rm-search-wrap {display:none;/*display:table;*/ width:100%; padding:20px; text-align:center;}
.rm-search {display:inline-block; width:80%; height:40px; padding-left:20px; background:#2b5fb3; border:0; color:#fff; vertical-align: top;}
.rm-sbtn {display:inline-block; width:40px; height:40px; background:url(../images/common/rm-sbtn.png) center no-repeat #2b5fb3; font-size:0; vertical-align: top;border:0; }

.sg-sub-wrap {border-top:1px solid #e4e4e4;}
.sg-sub-con {display:table; width:100%; max-width:1200px; margin:0 auto; }
.sg-left-wrap h3{ width:100%; height:150px; background:#386ec7; color:#fff; line-height:150px; text-align:center; letter-spacing: 3px; font-size:18px;}
.sg-left-wrap{ display:inline-table;width:240px; background:#fbfbfb;vertical-align:top;}
.sg-left-wrap>ul>li {border-bottom:1px solid #d9d9d9;}
.sg-left-wrap>ul>li:hover span {background:rgb(234, 234, 234);}
.sg-left-wrap>ul>li.plus span {/*background: url(../images/sub/lm-plus.png) center right no-repeat;*/}
.sg-left-wrap>ul>li>a {text-decoration:none;}
.sg-left-wrap>ul>li>a:hover {color:#386ec7; text-shadow:1px 0;}
.sg-left-wrap>ul>li.active a{position:relative; display:block; color:#386ec7; text-shadow:1px 0; /*background:url(../images/common/lm-active.jpg) center right no-repeat #fff;*/}
.sg-left-wrap>ul>li.active a:after {position:absolute; top: 0; right:10px; display:block; content:"▶";font-size:15px;}
.sg-left-wrap>ul>li span{display:block; width:100%; height:40px; padding-left:25px; background:#f4f4f4; line-height:40px; color:#000; text-shadow: 0.3px 0; font-size:15px; cursor: pointer; }
.sg-left-wrap>ul>li span.active{background: rgb(228, 228, 228)}
.sg-left-wrap>ul>li>a{display:block; width:100%; height:40px; padding-left:20px; line-height:40px; font-size:14px; letter-spacing: -1px;}
.sg-left-wrap>ul>li span>a {display:block; width:100%; height:100%; text-decoration: none;}
.sg-left-wrap>ul>li>ul {}
.sg-left-wrap>ul>li>ul>li {line-height:40px;border-bottom:1px solid #f1f1f1;background:#fff; }
.sg-left-wrap>ul>li>ul>li em {vertical-align: middle;}
.sg-left-wrap>ul>li>ul>li em.a {display:inline-block;width:15px; height:15px; margin:0 5px; background:url(../images/common/mark-a.png) no-repeat; font-size:0;}
.sg-left-wrap>ul>li>ul>li em.m{display:inline-block;width:15px; height:15px; margin:0 5px; background:url(../images/common/mark-m.png) no-repeat; font-size:0;}
.sg-left-wrap>ul>li>ul>li em.c{display:inline-block;width:15px; height:15px; margin:0 5px; background:url(../images/common/mark-c.png) no-repeat; font-size:0;}
.sg-left-wrap>ul>li>ul>li.active a:after {position:absolute; top: 0; right:10px; display:block; content:"▶";font-size:14px; }
.sg-left-wrap>ul>li>ul>li.active>a{position:relative; display:block; width:100%;color:#386ec7; background:#fff; text-shadow:0.7px 0;}
.sg-left-wrap>ul>li>ul>li.plus>a {background: url(../images/sub/lm-plus.png) #fff center right no-repeat; text-decoration: none;}
.sg-left-wrap>ul>li>ul>li>a {display:inline-block; width:100%; padding-left:20px; color:#000; font-size:15px; letter-spacing:-1px;}
.sg-left-wrap>ul>li>ul>li>a:hover {color:#386ec7; text-shadow:1px 0;}
.sg-left-wrap>ul>li>ul>li>a:hover em.a {background:url(../images/common/markb-a.png) no-repeat; font-size:0;}
.sg-left-wrap>ul>li>ul>li.active em.a {background:url(../images/common/markb-a.png) no-repeat; font-size:0;}
.sg-left-wrap>ul>li>ul>li>a:hover em.c {background:url(../images/common/markb-c.png) no-repeat; font-size:0;}
.sg-left-wrap>ul>li>ul>li.active em.c {background:url(../images/common/markb-c.png) no-repeat; font-size:0;}
.sg-left-wrap>ul>li>ul>li>a:hover em.m {background:url(../images/common/markb-m.png) no-repeat; font-size:0;}
.sg-left-wrap>ul>li>ul>li.active em.m {background:url(../images/common/markb-m.png) no-repeat; font-size:0;}
.lm-subm {display:none;}
.lm-ssubm {display:none; padding-bottom:15px;}
.lm-ssubm li {height:25px; line-height:25px;}
.lm-ssubm li a {display:block; width:100%; height:100%; padding-left:30px; font-size:13px; text-decoration: none; color:#888;}
.lm-ssubm li.active a {position:relative; color:#386ec7; text-shadow: 0.7px 0;}
.lm-ssubm li.active a:after {position:absolute; top: 0; right:20px; display:block; content:"▶";font-size:9px; }
.lm-ssubm li a:hover {color:#386ec7;text-shadow: 0.7px 0;}
.sg-subcon {display:table-cell; width:100%;/*padding-left:30px; */padding-bottom:5em; vertical-align: top;}
.sg-subcon02 {position: relative; padding: 0 0 5em 0;}
.sg-left-wrap>ul>li>ul>li>a:hover {text-decoration:none;}
.sg-sub-tit {padding-top:40px; padding-bottom:10px; font-size:30px; letter-spacing: -1px; font-weight:600; line-height:35px;}
.sg-sub-span {display:block; padding:0; font-size:15px; color:#000; letter-spacing: -1px;}
.sg-sub-tit-wrap {display:table; padding-left:30px; width:100%;}
.sg-sub-tit-wrap>div {display:table-cell; vertical-align:bottom;}
.sg-sub-tit-wrap>div:last-child {width:auto;  padding:0; text-align:right;}
.sg-sub-tit02 {position:relative; padding-left:40px; padding-top:40px; font-size:17px;color:#000; }
.sg-sub-tit02:before {position:absolute;  left:30px; bottom:0; display:block; width:4px; height:14px; content:""; background:#386ec7;}
.sg-sub-tit03 {display:none; position:relative; padding: 0 0 20px 0; text-shadow:0.5px 0; /*color:#000;*/ color:#1855b9; font-size:23px; }
.sg-sub-tit03:before {position:absolute; left:0; display: block; width:100%; height:100%; content: ""; /*background: url(../images/sub/s-bullet02.gif) 0 4px no-repeat;*/}
.sg-sub-tit04 {color:#333; padding: 30px 0 20px 0; font-size:17px; letter-spacing: -1px;}
.sg-con-box {max-width:930px; margin-top:20px;  margin-left:30px; padding:20px; border:1px solid #e6e6e6; border-radius: 5px; font-size:14px; }
.sg-con-box h4:first-child {padding-top:0;}
.sg-tag span{float:right; display:inline-block;line-height:22px; padding:0.2em; background:#e8f0fb; border-radius: 5px;}
.sg-tag span a {display: inline-block; padding:0 5px; color:#5f8ccc; font-size:13px; cursor: pointer; vertical-align: top;}
.sg-sub-tab {position:absolute; margin-top:1px; margin-left:30px;}
.sg-sub-tab li a {display:block; height:35px; padding:0.5em 2em;  background: #fbfbfb;  color:#949494; line-height:20px; font-size:15px;border-radius: 10px 10px 0 0; text-decoration: none; border: 1px solid rgb(226, 226, 226); }
.sg-sub-tab li.active a {color:#555; background:#fff; border:1px solid #e2e2e2; border-bottom:none; -webkit-box-sizing: border-box; box-sizing: border-box; text-shadow:0.5px 0; text-decoration: none;}
.sg-sub-tab li {padding-top:30px; display:inline-block;}
.sg-subcon>div.con-div {width:100%; max-width:905px; margin-top: 65px; margin-left:30px; padding:1em 0; font-size:14px;border-top:1px solid #e2e2e2;border-top: 1px solid #e2e2e2;}

.sg-ul01 { color:#000; font-size:15px;}
.sg-ul01>li{position:relative; line-height:25px; padding-left:20px; text-shadow:0.2px 0; color:#222; }
.sg-ul01>li:before {position:absolute; display:block; top:6px; left:0; width:12px; height:13px; border-radius: 3px; background: url(../images/sub/s-bullet01.gif); content: "";}
.sg-ul01>li>ul {padding:0 0 1em 0; margin-left:0;}
.sg-ul01>li>ul>li {position:relative; padding-left:10px; margin-top:5px; line-height: 22px; text-shadow:none;}
.sg-ul01>li>ul>li:before {position:absolute; display:block; left:0; width:100%; height:100%; background: url(../images/sub/s-bullet.gif) 0 11px no-repeat; content: "";}
.sg-ul01>li>ul>li>ul {padding:1em; margin-top:5px; font-size:14px; color:#777;background:#f6f6f6; border-radius: 5px; }
.sg-ul01>li>ul>li>ul>li {position:relative; padding-left:10px; letter-spacing: 0;}
.sg-ul01>li>ul>li>ul>li:before {position:absolute; display:block; top:0; left:0; width:4px; height:4px; content: "-"; color:#000;}

.sg-p01 {line-height:20px; font-size:14px;}
.sg-p02 {padding:30px 0 10px 0; line-height:20px; color:#999; font-size:14px;}

.s-strong-black{display:inline-block; padding-left:5px; padding-right:5px; color:#000; text-shadow: 0.5px 0; vertical-align: top;} 
.s-strong-blue {display:inline-block; padding-left:5px; padding-right:5px; color:#143b93; text-shadow: 0.7px 0; vertical-align: top;}
.s-strong-red {display:inline-block; padding-left:5px; padding-right:5px; color:#e52727; text-shadow: 0.5px 0; vertical-align: top;}
.s-strong-green {display:inline-block; padding-left:5px; padding-right:5px; color:#039a80; text-shadow: 0.5px 0; vertical-align: top;}

.sb-hgroup {display:none;}
.sb-hgroup>ul{display:table; width:100%; max-width:1200px; height:30px; margin:5px auto 0; text-align:right;}
.sb-hgroup>ul>li {position:relative; display:inline-block; padding:0 13px; vertical-align: top;}
.sb-hgroup>ul>li:after {position:absolute; top:10px; left:0; display:block; width:1px; height:10px; background:url(../images/common/hgroup-bar.png) no-repeat; content:""; }
.sb-hgroup>ul>li>a {text-decoration: none;}
.sb-hgroup>ul>li.home {background:none; margin:0;}
.sb-hgroup>ul>li.home>a{width:15px; height:30px; background:url(../images/common/hgroup-home.png) no-repeat center; font-size:0; }
.sb-hgroup>ul>li {background:url(../images/common/hgroup-arrow.png) right center no-repeat;}
.sb-hgroup>ul>li.current{ background:url(../images/common/hgroup-arrow2.png) no-repeat right 10px center;color: #386ec7;text-shadow: 0.3px 0;}
.sb-hgroup>ul>li.current>a {color:#386ec7;}
.sb-hgroup>ul>li.current2{ background:none; color: #386ec7;text-shadow: 0.3px 0;}
.sb-hgroup>ul>li.current2>a {color:#386ec7;}
.sb-hgroup>ul>li:first-child:after {background:none;}
.sb-hgroup>ul>li>a {display:block; width:100%; height:100%; line-height:30px; font-size:13px; color: #717586;}
.sb-hgroup>ul>li{position:relative;margin-right:13px;}
.sb-hgroup>ul>li:last-child {margin-right:0;}
.sb-hgroup>ul>li>ul {display:none; position:absolute; top:35px; left:0; width:170px; padding:0.5em; font-size:13px; background:#f5f5f5; /*border:1px solid #eaeaea;*/ text-align:left; z-index:999; border-radius: 10px;}
.sb-hgroup>ul>li>ul>li {padding:0.2em 0;}
.sb-hgroup>ul>li>ul>li>a {display:block; color:#777; text-decoration: none; padding-left:5px;}
.sb-hgroup>ul>li>ul>li>a:hover {color:#4c76bb; text-shadow: 0.3px 0;}

footer {width:100%; background: #1b2025;}
.sg-footer-wrap {display:table; width:100%; max-width:1200px; padding:60px 10px; margin:0 auto;}
.sg-footer-wrap>div {display:table-cell; vertical-align: top;}
.sg-footer-wrap>div:first-child {text-align:left;}
.sg-footer-wrap>div:last-child {text-align:right;}
.sg-footer-wrap p {padding-top:50px; color:#aaa; font-size:14px; line-height:25px;}
.sg-footer-wrap p span {text-shadow:1px 0;color:#c9c9c9;} 
.sg-footer-copyright {height:74px; background: #101315; text-align:center; line-height:74px; font-size:14px; color:#5a5c62;}
.sg-footer-wrap .footer-menu {}
.sg-footer-wrap .footer-menu>ul>li{display:inline-block;padding-left:40px; padding-right:40px; text-align:left; border-left:1px solid #393b3d; vertical-align: top;}
.sg-footer-wrap .footer-menu>ul>li>a {display:block; width:100%; height:100%; color:#c9c9c9; font-size:16px; text-shadow:1px 0; }
.sg-footer-wrap .footer-menu>ul>li>a:hover {text-decoration:none;}
.sg-footer-wrap .footer-menu>ul>li>ul>li {line-height:30px; }
.sg-footer-wrap .footer-menu>ul>li>ul>li>a{color:#737272; font-size:14px; text-decoration: none;}
.sg-footer-wrap .footer-menu>ul>li>ul {padding-top:20px;}
.sb-sns-wrap {padding:5px 20px 20px 0;}
.footer-sns {padding-right:0.5em;}

#popup_wrap {position:fixed; top:0; bottom:0; right:0; left:0; display:none; width:997px; height:auto; padding:0;  margin:auto; z-index:9999; } 
#mask {width:100%; height:100%; padding:0; margin:0; position:fixed; background:rgba(0,0,0,0.7) repeat; top:0; left:0; z-index:999; display:none;  border-radius: 0; } 
.popup-cont01 {position:absolute; top: 8em; bottom: 5em; left: 0; right: 0; width:100%; height:100%; max-height:650px;}
#popup_close {position: absolute; width:14px; height:13px; top:25px; right:25px; background: url(../images/common/pop-close.jpg) no-repeat; font-size:0; border:0;}
#popup_wrap .sg-subcon {display: block; max-height: 750px; padding:2em;background: #fff;border:1px solid #ccc; overflow-y: scroll;}
#popup_wrap .sg-subcon .sg-sub-tit-wrap { padding-left: 0;}
#popup_wrap .sg-subcon .sg-con-box {margin-left:0;}
#popup_wrap .sg-subcon .sg-sub-tit02 {padding-left:10px;}
#popup_wrap .sg-subcon .sg-sub-tit02:before{left:0; bottom:1px;}

.no-page {padding:10em 0;}
.no-page img {display:block; margin:0 auto;}
.no-page p {padding-top:2em;font-weight:600; font-size:30px; color:#343434; text-align:center;}
.no-page>span {display:block; padding-top:10px; font-weight:300; font-size:23px; color:#515151; text-align:center;}
.no-page>a {display:block; margin:3em auto 0;  text-align:center;}
.no-page>a:hover {text-decoration:none;}
.no-page>a span {padding:0.5em 2em; color:#386ec7; text-decoration: none; border:1px solid #7ea8ef; border-radius:30px;  cursor: pointer; font-size:15px;}

a.jcm-top {position: fixed; right: 35px; bottom: 35px; border-radius: 5px; color: #ffffff; text-align: center; width: 45px; height: 45px; font-size: 40px; /*background-color: rgba(50,50,50,0.5);*/ content:"top";background-color:#323232; opacity:0.5; filter:alpha(opacity=50); z-index: 999;display: none;}
a.jcm-top:hover{background-color:#000}
a.jcm-top span {display:block; width:100%; height:100%; font-size:0; background: url(../images/sub/top-btn.png) center no-repeat; font-size:0;}

div .syntaxhighlighter {overflow-y: hidden !important;}
.response_syntax{padding:1em;margin-top:5px;color:#777;background-color:#f6f6f6;border-radius:5px;}
.new-sg-li02:before {background:none !important;}

@media (max-width:768px) {
	.sg-gnb-wrap h1 {padding:0;}
	.sg-gnb-wrap h1 a {background-size: 160px;}
	.sg-sub-span {font-size:14px;}
	.sb-hgroup>ul>li>a {font-size:14px;}
	.sb-hgroup>ul>li>ul {background:#fff; border:1px solid #e5e5e5; border-top:0;}
	.sb-hgroup>ul>li>ul>li {padding:0.1em 0;}
	.sb-hgroup>ul>li>ul>li>a{font-size:14px;}
	.sg-ul01 {font-size:14px;}
	.sg-sub-tab li a {font-size:14px;}
	.sg-sub-tit-wrap {padding:0 10px;}
	.sg-sub-tit {font-size:1.3em; padding-top:15px; padding-bottom:0;}
	.sg-sub-tit02 {padding-left:20px; padding-top:20px;}
	.sg-sub-tit02:before {left:10px;}
	.sg-ul01>li {line-height:18px;}
	.sg-ul01>li>ul>li {margin-top:0; line-height:18px;}
	.sg-con-box {padding:15px; margin:10px;}
	.sg-sub-tab {padding:0 10px;}
	#SBGridArea , #SBGridArea1 , #SBGridArea2 {padding:0 10px;}
	.guide_div {padding:0 10px;}
	.sg-gnb-wrap {height:60px;}
	.sg-sub-wrap {border:1px solid #e4e4e4;} 
	.release-con>div {margin-top:20px;}
	.tit-wrap span {display:none;}
	.sg-wrap a.jcm-top {right:5px;}
	.sg-footer-wrap p {padding:20px 0;}
	.sb-sns-wrap {padding:5px 20px 20px 20px;}
	.api-con>.api-div {padding:0 10px}
	.article-more {margin:10px;}
	
}

@media (min-width: 1199px){
    .rm-menu {visibility:hidden;}
}

@media (max-width: 1200px) {
    .sg-subcon>div.con-div {max-width:100%;}
    .rm-btn {display:table-cell;}
    header.sh .aa-input-icon {top:17px; right:33px;}
    .sg-subcon02 {}
    .sg-sub-tit-wrap {padding-left:0;}
    .sg-sub-tit02 {padding-left:10px;}
    .sg-sub-tit02:before {left:0;}
    .sg-con-box{margin-left:0;}
    .sg-subcon>div.con-div {margin-left:0;}
    .sg-sub-tab{margin-left:0;}
    .sg-sub-tit {padding-top:30px;}
    .sb-hgroup>ul>li>ul {top:30px; border-radius: 0;}
}
