/* ************************ 공용 ************************ */
html,body {
	font-family:"TitilliumWeb-Regular",tahoma,arial,sans-serif; font-style:normal;
	-webkit-font-smoothing:antialiased;
}

#gotop {z-index:900; display:none; position:fixed; width:35px; height:35px; border-radius:3px; bottom:15px; right:15px; background:url(../images/common/arrow_up.png) no-repeat 50% #fff; box-shadow:0 0 3px rgba(0,0,0,.3) !important;}

/* sns등 아이콘 정의 / ~끝나는 것 */
[class $= "facebook"] {display:block; background-image:url(../images/common/icon_facebook_50.png);}
[class $= "instagram"] {display:block; background-image:url(../images/common/icon_instagram_50.png);}
[class $= "twitter"] {display:block; background-image:url(../images/common/icon_twitter_50.png);}
[class $= "youtube"] {display:block; background-image:url(../images/common/icon_youtube_50.png);}
[class $= "google"] {display:block; background-image:url(../images/common/icon_google_50.png);}
[class $= "kakaostory"] {display:block; background-image:url(../images/common/icon_kakaostory_50.png);}
[class $= "naver"] {display:block; background-image:url(../images/common/icon_naver_50.png);}
[class $= "weibo"] {display:block; background-image:url(../images/common/icon_weibo_50.png);}
[class $= "line"] {display:block; background-image:url(../images/common/icon_line_50.png);}


/* sns,공유 */
.quick {margin:30px 0; text-align:left;}
.quick>ul>li {float:left;}
.quick>ul>li.clear {clear:both;}
.quick>ul>li>a {
	width:40px; height:40px; margin:10px 10px 0 0; font-size:0; opacity:.5;
	background-color:#fff; background-position:50%; background-repeat:no-repeat; background-size:70%; border-radius:50%; border:1px solid #ddd;
}
.quick>ul>li>a:hover {opacity:1; border:1px solid #999;}
.quick>ul>li:last-child a {margin-right:0;}

/* 공유버튼 */
.shareWrap {z-index:889; visibility:hidden; display:table; left:0; top:0; width:100%; height:100%; text-align:center; opacity:0; background:rgba(0,0,0,.8);}
.shareWrap.on {visibility:visible; opacity:1;}
.shareWrap .wrap {position:relative; display:table-cell; vertical-align:middle; text-align:center;}
.shareWrap .wrap .title {width:100%; text-align:center; margin-bottom:30px; font-size:18px; color:#fff;}
.shareWrap .wrap li {display:inline-block; margin:5px 10px;}
.shareWrap .wrap li a {
	display:block; width:60px; height:60px; border-radius:50%;
	background-color:#fff;
	background-repeat:no-repeat;
	background-position:50%;
	background-size:60%;
}
.shareWrap .wrap li a:hover {
	transform:scale(1.1);
	-webkit-transform:scale(1.1);
	-moz-transform:scale(1.1);
	-o-transform:scale(1.1);
}
.shareWrap .wrap a.btn_close {display:inline-block; margin-top:30px; text-align:center; padding:12px 40px; color:#fff; font-size:16px; line-height:1; border:2px solid #fff; border-radius:8px;}

/* ************************ 데스크탑 (992~) ************************ */
@media (min-width: 992px){	
	.mobile {display:none !important;}
	body {width:100%; background-color:#000; background-image:url(../images/common/bg2.png)}

	/*헤더*/
	.pHeader {top:0; left;0; padding:0; background-color:#fff; text-align:center;}
	.pHeader h1 {width:100%; margin:0; padding-top:40px; text-align:center;}
	
	/*gnb*/
	.pHeader .wrap {display:inline-block; text-align:left; padding:70px 20px 0 20px;}
	.pHeader .gnb>ul>li {margin-bottom:20px;}
	.pHeader .gnb>ul>li a {font-family:"TitilliumWeb-SemiBold"; font-size:24px; line-height:1.2;}

	/*footer*/
	.bottom {position:fixed; bottom:0; right:0; height:auto !important; padding:0 !important; margin:0; background-color:#1d1d1d; border-top:1px solid #333;}
	.bottom address {display:block; margin:0; text-align:right; font-size:12px; color:#ccc;}
	.bottom address .language {display:inline-block; height:40px; margin-right:20px; padding:10px 20px 0 20px; border:1px solid #333; border-top:0; border-bottom:0; }
	.bottom address .language a {display:inline-block; padding:0 5px;  line-height:1; color:#888; font-size:12px;}
	.bottom address .language a.on {color:#fff; cursor:default;}
	.bottom address .language a:hover {color:#fff;}
	.bottom .cafe {
		padding:0; color:#333;
		background-color:transparent;
		background-image:url(../images/common/icon_cafelist.png);
		background-size:24px;
		background-repeat:no-repeat;
		background-position:10px 50%;
	}
	.bottom .cafe:hover {background-color:#000;}
	.bottom .cafe button {
		padding-left:40px; font-size:14px;
	}
	
	.bottom .dropdown-toggle {
		width:100%; height:40px; padding-left:15px; text-align:left; color:#fff; border:0; border-right:1px solid #333; border-radius:0px; background:transparent;}
	.bottom .dropdown-toggle .glyphicon {position:absolute; right:15px; top:13px;}
	.bottom .dropdown-menu {width:100%; margin:0; padding:0; max-height:500px; overflow-y:auto; border-radius:0px; border:1px solid #333;}
	.bottom .dropdown-menu a {font-size:14px; padding:10px 15px !important; border-bottom:1px solid #f0f0f0;}
	.bottom .btn_share {padding:0;}
	.bottom .btn_share .dropup {
		padding-left:25px; font-size:14px;
		height:40px; color:#fff;
		background-image:url(../images/common/icon_share_50w.png);
		background-repeat:no-repeat;
		background-position:12px 50%;
		background-size:25px;
		border-radius:0;
	}
	.bottom .btn_share:hover {background-color:#000;}
	.bottom .btn_share .dropdown-menu a {
		padding-left:40px !important; font-size:14px; color:#000;
		background-size:25px;
		background-repeat:no-repeat;
		background-position:10px 50%;
	}
	
	
	/* 컨텐츠*/
	section.contents {float:right; padding:0; margin:0;}
	
	.more {padding-bottom:70px !important;}
}


/* ************************ 태블릿 이하(~991) ************************ */
@media (max-width: 991px) {
	.pc {display:none !important;}
	body {width:100%; background-color:#000; background-image:url(../images/common/bg.png)}
	
	/*헤더*/
	.mHeader .head {position:relative; width:100%; height:50px; background-color:#fff;}
	.mHeader .head .gnbView {position:absolute; display:block; width:50px; height:50px; left:0; top:0; border-right:1px solid #eee; background:url(../images/common/icon_allmenu.png) 50% 50% no-repeat; background-size:35%; border-radius:0;}
	.mHeader .head .share {position:absolute; display:block; width:50px; height:50px; right:0; top:0; border:0; border-left:1px solid #eee; background:url(../images/common/icon_share_50.png) 50% 50% no-repeat; background-size:55%; border-radius:0;}
	.mHeader .head h1 {margin:0 !important; position:absolute; display:block; width:100%; height:60px; left:0; top:0; text-align:center;}
	.mHeader .head h1 a {display:inline-block; height:50px; padding:10px 0; text-align:center;}
	.mHeader .head h1 a img {display:block; height:100%;}
	
	/*gnb*/
	.mHeader nav.mobile {z-index:9999; position:fixed; visibility:hidden; top:0; height:100%; overflow:hidden; background:#fff; box-shadow:5px 0px 10px rgba(0,0,0,.7) !important;}
	.mHeader .closeWrap {position:relative; height:50px; background-color:#f5f5f5;}
	.mHeader .closeWrap .gnbClose {display:block; width:50px; height:50px; background:url(../images/common/icon_gnbclose.png) 50% 50% no-repeat; background-size:40%;}
	.mHeader .closeWrap .home {position:absolute; display:block; right:20px; top:18px; font-size:12px; color:#888;}
	.mHeader .gnbCover {z-index:9998; position:fixed; left:0; top:0; display:none; width:100%; height:100%; background:rgba(0,0,0,.8);}
	.mHeader .gnb * {/* width:100% !important; */}
	.mHeader .gnb .home {display:block; width:100%; font-size:12px; background-color:#f0f0f0; padding:12px 20px; border-bottom:1px solid #333;}
	.mHeader .gnb {position:relative; width:100%; padding-top:10px; height:100%; overflow-y:auto;}
	.mHeader .gnb>ul>li {clear:both; position:relative;}
	.mHeader .gnb>ul>li>a {display:block; padding:7px 20px; color:#000; font-family:"TitilliumWeb-SemiBold"; font-size:24px; background:#fff;}
	.mHeader .gnb>ul>li>a:hover {color:#42b4bb;}	
	nav .quick {margin-top:30px; padding:0 0 30px 20px; text-align:left;}
	
	/*footer*/
	.bottom {clear:both; padding:0;margin:0; background:#222;}
	.bottom address {display:block; padding:20px; margin:0; text-align:center; font-size:12px; color:#666;}
	.bottom address .language {display:block;}
	.bottom address .language a {display:inline-block; padding:7px 20px; margin:0 5px 5px 5px; line-height:1; color:#888; font-size:12px; border:1px solid #444;}
	.bottom address .language a.on {color:#fff; cursor:default;}
	.bottom address .language a:hover {color:#fff;}
	.bottom .cafe {padding:0;}
	.bottom .cafe .view {
		display:block; padding:17px 15px; color:#fff; font-size:16px; line-height:1; background:#333; padding-left:40px;
		border:1px solid #3a3a3a; border-left:0; border-right:0;
		background-image:url(../images/common/icon_cafelist.png);
		background-size:24px;
		background-repeat:no-repeat;
		background-position:13px 50%;
	}
	.bottom .cafe .popup {
		z-index:888; visibility:hidden; position:fixed; left:0; top:0; width:100%; height:100%; padding:15px; background:rgba(0,0,0,.8); opacity:0;}
	.bottom .cafe .popup.on {visibility:visible; opacity:1;}
	.bottom .cafe .popup .cover {width:100%; height:100%;}
	.bottom .cafe .popup .list {position:absolute; top:30px; width:80%; overflow-y:auto; background:#fff; padding:0; border-radius:8px;}
	.bottom .cafe .popup .list li {margin:0 10px; border-bottom:1px solid #f5f5f5;}
	.bottom .cafe .popup .list a {display:block; padding:12px 15px; font-size:16px;}
	.bottom .cafe .popup .btn_close {position:absolute; display:block; bottom:30px; text-align:center; padding:12px 40px; color:#fff; font-size:16px; line-height:1; border:2px solid #fff; border-radius:8px; background:rgba(0,0,0,.8);}

	/* 컨텐츠*/
	section.contents {padding:0; margin:0;}
}