@charset "utf-8";

#wrap {position:relative; width:100%; min-width:320px;}

/*header*/
#header {z-index:200; height:67px; background:#2f2f42; position:fixed; width:100%; top:0;}
.hd1_bx {width:303px; height:67px; padding-right:30px; background:#f5f5f5 url(../images/bg_h1_tra_cm.gif) no-repeat right 0;}
.hd1_bx>h1 {padding:14px 0 0 14px;}
.hd1_bx>h1>a {display:block; height:100%;}

.hd_search {position:absolute; top:14px; left:359px; width:336px; height:25px; padding:6px 10px; background:#454556; border-radius:6px;}
.hd_search>input[type="text"]{width:300px; margin:0; padding:0; height:25px; font-size:16px; color:#f5f5f5; border:none; background:#454556;}
.hd_search>a {position:absolute; top:2px; right:6px; overflow:hidden; width:25px; height:30px; padding-top:3px; text-align:center;}
.hd_search>a:hover>img {margin-top:-55px;}

.hd_link {position:absolute; top:15px; right:9px;}
.hd_link>a {display:inline-block;}
/*.hd_link>a>img {vertical-align:middle;}
.hd_link .sik {}
.hd_link .i-down {}*/

.gnb_mo_02 {display:none;}
.gnb_mo_tit {z-index:30; display:none;}

.gnb_mo {}
#gnb {z-index:30; position:absolute; top:0; right:131px; width:285px; height:67px;}
#gnb_mo {display:none;z-index:30; position:absolute; top:0; right:0; width:285px; height:67px;}
.gms {z-index:11; position:absolute; width:120px; height:67px;}
.gms.gm01 {right:184px;}
.gms.gm02 {right:92px;}
.gms.gm03 {right:0;}
.gms.gm04 {display:none;}
.gms.gm05 {display:none;}

.gms .bt_gm {position:relative; width:120px; height:67px; overflow:hidden;}
.gms .parallelogramLeft {position:absolute; top:0; left:15px; width:93px; height:67px; transform:skew(-20deg); -o-transform:skew(-20deg); -moz-transform:skew(-20deg);-webkit-transform:skew(-20deg);}
.gms.gm01 .bt_gm>.parallelogramLeft {background:#ba3737;}
.gms.gm02 .bt_gm>.parallelogramLeft {background:#2f2f42;}
.gms.gm03 .bt_gm>.parallelogramLeft {background:#608f2b;}
/*.gms.gm03, .gms.gm03 .bt_gm {width:93px;}*/

.gms .bt_gm>a {z-index:1;}
.gms .bt_gm>a:hover {z-index:100;}
.gms .bt_gm>a {position:absolute; top:0; left:28px; display:block; width:120px; height:67px; line-height:67px; height:100%;}
.gms .bt_gm>a>strong {display:block;}
.gms .bt_gm>a>strong>img {line-height:67px !important; vertical-align:middle !important}

.submenu {display:none; z-index:20; position:absolute; top:67px; right:24px; width:278px;}
.submenu .dep01 {padding:4px 0;}
.submenu .dep01>li {position:relative; padding:0 29px;}
.submenu .dep01>li>a {display:block; padding:10px 7px; color:#f5f5f5; font-size:14px;}
.submenu .dep01>li:hover .dep02 {display:block;}
.submenu .dep01>li:last-child a {border-bottom:none !important;;}

.submenu .dep02 {display:none; position:absolute; top:-4px; right:-155px; width:155px;}
.submenu .dep02>ul {padding:4px 14px;}
.submenu .dep02>ul>li {position:relative;}
.submenu .dep02>ul>li>a {display:block; padding:10px 6px; color:#f5f5f5; font-size:14px;}
.submenu .dep02>ul>li:last-child a {border-bottom:none !important;}

.submenu.gm01_sub {display:none; background:#ba3737;}
.submenu.gm01_sub .dep01 li>a{border-bottom:1px solid #d25b5b;}
.submenu.gm01_sub .dep01>li>a:hover {text-decoration:none;}
.submenu.gm01_sub .dep01>li:hover {background:url(../images/ic_gnb_sub_arr.png) no-repeat 110px 17px;}
.submenu.gm01_sub .dep02 {background:#d85555;}
.submenu.gm01_sub .dep02 li>a{border-bottom:1px solid #dd7272;}


.submenu.gm02_sub {display:none; background:#2f2f42;}
.submenu.gm02_sub>.dep01 li>a{border-bottom:1px solid #535362;}
.submenu.gm02_sub .dep01>li>a:hover {text-decoration:none;}
/*.submenu.gm02_sub .dep01>li:hover {background:url(../images/ic_gnb_sub_arr.png) no-repeat 110px 17px;}*/

.submenu.gm02_sub>.dep02 li>a{border-bottom:1px solid #535362;}
.submenu.gm02_sub .dep02 {background:#454560;}


.bg_gnb {display:none; z-index:20; position:absolute; top:67px; bottom:0; left:0; right:0; width:100%; height:1200px; background:rgba(0,0,0,0.88);}
.all_bg {display:none; z-index:10; position:absolute; top:0; bottom:0; left:0; right:0; width:100%; height:100%; background:rgba(255,255,255,0);}


#container {padding-top:67px; width:100%; background: rgba(234,234,234,1);
    background: -moz-linear-gradient(top, rgba(234,234,234,1) 0%, rgba(245,245,245,0.1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(234,234,234,1)), color-stop(100%, rgba(245,245,245,0.1)));
    background: -webkit-linear-gradient(top, rgba(234,234,234,1) 0%, rgba(245,245,245,0.1) 100%);
    background: -o-linear-gradient(top, rgba(234,234,234,1) 0%, rgba(245,245,245,0.1) 100%);
    background: -ms-linear-gradient(top, rgba(234,234,234,1) 0%, rgba(245,245,245,0.1) 100%);
    background: linear-gradient(to bottom, rgba(234,234,234,1) 0%, rgba(245,245,245,0.1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eaeaea', endColorstr='#f5f5f5', GradientType=0 );}

#footer {padding:32px 0; background:#fff; border-top:#eaeaea 1px solid;}
.ft_wrap {position:relative; width:1112px; margin:0 auto; *zoom:1;}
.ft_wrap:after {content:"";display:block;visibility:hidden;clear:both;}
.ft_logo, .ft_info {float:left;}
.ft_logo>a {display:block;}
.ft_info {margin-left:20px;}
.ft_info>p {padding-top:2px;}
.ft_info>p, .ft_info>p>span, .ft_info>p>span>a {font-size:12px; color:#929292;}
.ft_info>p>span {display:inline-block; vertical-align:top; letter-spacing:-0.1em;}
.ft_info .ft_bnr {padding-top:14px;}
.ft_info .ft_bnr a {display:inline-block; vertical-align:middle; margin:5px 15px 5px 0;}

.btn_api_img {position:absolute; top:0; right:20px;}
#footer.sub .btn_api_img {position: absolute; top:20px; right:0; width:147px;}
#footer.sub .ft_info>p>span {display:block;}

.pg_top {position:fixed; right:0; bottom:0; width:27px; height:49px; background:url(../images/bt_top.gif) no-repeat; text-align:-9999px; z-index:999;}

@media all and (max-width:1239px){
	.hd1_bx {width:302px; height:67px; padding-right:0; background:none;}
	.hd1_bx>h1 {padding:0; height:67px;}
	.hd1_bx>h1>a {display:block; height:100%; background:url(../images/h1_logo_cm768.png) no-repeat 14px 16px;}
	.hd1_bx>h1>a>img {display:none;}

	.hd_search {left:280px; width:265px; padding:6px 10px;}
	.hd_search>input[type="text"]{width:230px;}

	.hd_link {right:5px;}

	#gnb {width:285px; right:116px;}
	.gms {z-index:11; position:absolute; width:106px;}
	.gms.gm01 {right:152px;}
	.gms.gm02 {right:77px;}
	.gms.gm03 {right:0; }

	.gms .bt_gm {width:106px;}
	.gms .parallelogramLeft {position:absolute; top:0; left:15px; width:77px;}
	/*.gms.gm03 .bt_gm>.parallelogramLeft {width:89px; background:#608f2b;}
	.gms.gm03, .gms.gm03 .bt_gm {width:89px;}*/

	.gms .bt_gm img {margin-left:-6px;}

	.submenu {width:231px; right:25px;}
	.submenu .dep02 {right:-142px; width:142px;}

	.ft_wrap {width:949px;}
    .btn_api_img {top:0; right:10px; width:163px;}
}
@media all and (max-width:979px) {
	.hd_link {display:none;}

	.gnb_mo_02 {position:absolute; top:12px; right:56px; display:block; width:42px; height:42px; background:#608f2b url(../images/ic_gnb_mo_02.png) no-repeat center; border-radius:42px; text-indent:-99999px; overflow:hidden;}

	.gnb_mo_tit {display:block; position:absolute; top:0; right:0; display:block; width:55px; height:67px; line-height:67px; text-align:center;}
	.gnb_mo_tit>img {line-height:67px; vertical-align:middle;}

	#gnb {display:none;}

	#gnb_mo {top:67px; right:0; width:100%; height:auto;}

	.gms {z-index:11; position:absolute; width:107px; height:40px; line-height:40px;}
	.gms.gm01 {top:0; right:0;}
	.gms.gm02 {top:40px; right:0;}
	.gms.gm03 {display:none;}
	.gms.gm04 {top:80px; right:0; display:block;}
	.gms.gm05 {top:120px; right:0; display:block;}

	.gms .bt_gm {position:relative; width:110px; height:40px; line-height:40px; overflow:hidden;}
	.gms.gm03, .gms.gm03 .bt_gm {width:110px;}

	.gms .parallelogramLeft {display:none;}
	.gms.gm01 .bt_gm{background:#ba3737;}
	.gms.gm02 .bt_gm{background:#2f2f42;}
	.gms.gm03 .bt_gm{background:#608f2b;}
	.gms.gm04 .bt_gm{background:#5e5e75;}
	.gms.gm05 .bt_gm{background:#2f2f42;}

	.gms .bt_gm>a {z-index:1;}
	.gms .bt_gm>a:hover {z-index:100;}
	.gms .bt_gm>a {position:static; display:block; width:100%; height:100%; line-height:40px; text-align:center;}
	.gms .bt_gm>a>strong {display:block;}
	.gms .bt_gm>a>strong>img {line-height:40px !important; vertical-align:middle !important}

	.gm01 .bt_gm>a>strong {height:100%; background:url(../images/gnb_m01_320.png) no-repeat center;}
	.gm02 .bt_gm>a>strong {height:100%; background:url(../images/gnb_m02_320.png) no-repeat center;}
	.gm01 .bt_gm>a>strong>img, .gm02 .bt_gm>a>strong>img {display:none;}

	.submenu {z-index:20; position:absolute; top:0; right:107px; width:213px;}
	.submenu .dep01>li {padding:0;}
	.submenu .dep01>li>a {padding:10px 37px;}

	.submenu .dep02 {position:static; width:100%;}
	.submenu .dep02>ul {padding:4px 0;}
	.submenu .dep02>ul>li {position:relative;}
	.submenu .dep02>ul>li>a {padding:10px 0 10px 50px;}

	.submenu.gm01_sub .dep02 li>a{border-bottom:1px solid #a54b4b;}
	.submenu.gm01_sub .dep01>li:hover {background:url(../images/ic_gnb_sub_arr320.png) no-repeat 10px 17px;}
	.submenu.gm01_sub .dep02 {background:#942626;}

	.submenu.gm02_sub .dep01>li:hover {background:url(../images/ic_gnb_sub_arr320.png) no-repeat 10px 17px;}
	.submenu.gm02_sub .dep02 {background:#131325;}

	.bg_gnb {top:67px;}

	.ft_wrap {width:744px;}
}

@media all and (max-width:767px) {
	#wrap, #header {min-width:320px;}
	#header {height:48px;}
    #container {padding-top:48px;}

	.hd1_bx {width:44px; height:48px;}
	.hd1_bx>h1 {height:48px;}
	.hd1_bx>h1>a {background:url(../images/h1_logo_cm320.png) no-repeat 7px 8px;}

	.hd_search {top:7px; left:44px; width:183px; height:22px;}
	.hd_search>input[type="text"]{width:150px;  height:22px;}
	.hd_search>a {top:4px; right:4px; width:33px; height:25px; padding-top:0;}

	.gnb_mo_02 {top:12px; right:38px; width:26px; height:26px; background-size:60% 60%;}

	.gnb_mo_tit {width:37px; height:48px; line-height:48px;}
	.gnb_mo_tit>img {line-height:48px;}

	#gnb_mo {top:48px;}
	.bg_gnb {top:48px;}

	.submenu {left:0;width:auto;}

	.ft_wrap { width:100%; margin:0; padding:0;}
	.ft_logo {margin-top:20px;}
	.ft_logo, .ft_info {float:none;}
	.ft_info {padding-top:20px; margin-left:0;}	
	
	.btn_api_img {position:absolute; top:-70px; right:10px; width:140px;}
	.btn_api_img img {width:140px;}
	
	#footer.sub .btn_api_img {top:15px; right:0; width:140px;}
	#footer.sub .ft_logo {margin-top:55px;}
	
	.pg_top {width:14px; background:url(../images/bt_top_320.gif) no-repeat;}
}