/* SMALL  가로 930xp일때 적용============================================= */
@media screen and (max-width:930px){
		
	/* bsHeaderClass */
	.bsHeaderClass {
        display:none !important; 
	}
	
	.topBSMargin {
        display:none !important; 
	}
 
    /* SMALL 헤더 (모바일) ============================================= */

    /* SMALL  메인  좌측 엔터큐브 로고 */
    .mainLogo {
        width: 30%;
        height: 100%;
    }

    /* SMALL 헤더 우측 로그인, 회원가입 영역 */
    .mainLogin{
        float:right;
        width:50%;
        height:100%;
    }
 
     /* SMALL 회원헤더 메뉴 */
    .menuHeaderMember {
        display: block;
        float: right;
    }

    /* SMALL  헤더메뉴  */
    .menuHeaderText {
        float:left;
        font-weight:bold;
        margin-right: 20px;
        line-height: 40px;
    }

    /* SMALL  헤더메뉴  :a태그 색상 지정 */
    .menuHeaderText a {
        color: #555555 !important;
        text-decoration:none !important;
        font-weight:bold !important; 
    }

    /* SMALL 헤더메뉴 상단이동  */
    .menuHeaderText a:hover {
        color: #31a2dc !important;
        text-decoration:none !important;
        font-weight: bold !important;
    }
 
    
    /* SMALL 화면상단제목글내용 */
    .mainHeaderTitleClass {
		padding-left:10px;
    }    
    
    /* SMALL 화면상단제목글내용 */
    .menuHeaderbulb {
        margin-right: 0px;
    }
    
    /* SMALL 헤더 우측사용중 아이콘 글씨는 모바일일때 안보임 */
    .mainHeaderTitleText b{
        display: none;
    }

}

/* BIG 가로 931xp일때 적용 (pc 등)============================================= */
@media screen and (min-width:931px){

    /* BIG 헤더 ============================================= */

    /* BIG 메인 우측 엔터큐브 로고 */
    .mainLogo {
        width: 17%;
        height: 100%;
    }
 
    /* BIG 헤더 중간부분 전체 영역 */
    .mainMenu{
    	display:block;
        text-align: center;
    }

    /* BIG 헤더 중간 4개 메뉴들 */
    .mainMenuInner {
        display: inline-block;
        font-size: 1.05em !important;
        font-weight:normal !important;
        color: #666666 !important;
        margin: 0 auto;
    }

    /* BIG 헤더 중간 4개 메뉴 :a태그 색상 지정 */
    .mainMenuInner a {
    	text-decoration: none !important;
        color: #555555 !important;
        font-weight:normal !important;
    }
 
     /* BIG 메인메뉴 이동 색상  */
    .mainMenuInner a:hover{
    	text-decoration: none !important;
        color: #31a2dc !important;
        font-weight: bold !important;
    }

    /* BIG 헤더 우측 로그인, 회원가입 영역 */
    .mainLogin{
        float:right;
        width:40%;
        height:100%;
    }

    /* BIG 헤더 우측 로그인, 회원가입 감싼 영역 : 모바일일때 숨김 */
    .loginMember{
        display: block; 
    }

    /* BIG 모바일 사이즈일때 우측 메뉴 pc일때 숨김 */
    .mobileLoginMember {
        display: none;
    }

     /* BIG 모바일 사이즈일때 우측 메뉴 pc일때 숨기지 않음  */
    .menuHeaderMember {
        display: block;
        float: right;
    }
    
    
    /* BIG 헤더 우측 '회원가입' 버튼 - id */
    #member {
        width: 90px;
        height: 32px;
        padding: 4px 17px;
   		color: #FFFFFF !important;
        border-radius: 5px;
        background: #31a2dc;
    }
 
     /* Big 회원가입 메뉴 :a태그 색상 지정 */
    .member a {
        color: #FFFFFF !important;
        text-decoration:none !important;
        font-weight:normal !important; 
    }

    /* Big 회원가입이동  */
    .member a:hover {
        color: #FFFFFF !important;
        text-decoration:none !important;
        font-weight: bold !important;
    }
 
 
    /* BIG 회원가입 버튼 내부 사람이미지 */
    #member img{
        float: left;
        width: 13px;
        height: 13px;
        margin: 10px 5px 0;
        vertical-align: middle;
    }    
    
    /* BIG 작명서비스 로그인 시 사용중 아이콘 표시 */
    .menuHeaderbulb{
        margin-right: 20px;
    }

}



/* 기기 '가로방향' 일때 적용============================================= */
@media screen and (orientation: landscape){

    /* 드롭리스트 메뉴 크기및 모양, 위치 설정 */
    .dropListMenu {
        width: 100%;
        height: 45px;
        z-index:10000;
        margin-top:-10px;
        padding: 0;
    }

    /* 드롭리스트 버튼 메뉴들 */
    .dropListMenu li{
        width: 18%;
        height: 45px;
        float: left;
    }
 
    /* 드롭리스트 메뉴 마지막 줄 하단 여백 */
    .dropListMenu li:last-child {
        margin-bottom: 0%;
    }
 
}



/* CommonNew 헤더============================================= */


    /* CommonNew 화면상단제목Wrap */
    .mainHeaderTitleClass {
        width:60%;
        position:fixed;
        top:0;left:18%;
        right:22%;
        background:transparent;
        text-align:center;
    }
    
    /* CommonNew 화면상단제목글내용 */
    .mainHeaderTitleText {
        background:transparent;
        color:#ffffff;
        display:inline-block;
        line-height:60px;
        font-size:1.1em;
        font-weight:bold;
    }

    /* CommonNew 헤더글씨 메뉴 */ 
	 .headerText {
	 	display:inline-block;
	    margin-right: 20px;
	    line-height: 40px;
	    font-weight:bold !important;
	}
 
    /* CommonNew 헤더글씨 메뉴 :a태그 색상 지정 */
    .headerText a {
     	text-decoration: none !important;
        color: #555555 !important;
        font-weight:bold !important;
     }

    /* CommonNew 로그인이동  */
    .headerText a:hover {
    	text-decoration: none !important;
        color: #31a2dc !important;
        font-weight: bold !important;
    }
 
    /* CommonNew 헤더반전 메뉴 */ 
	 .headerRevText {
	    float: left;
	    line-height: 40px;
	    font-weight:bold !important;
	}
 
    /* CommonNew 헤더반전 :a태그 색상 지정 */
    .headerRevText a {
     	text-decoration: none !important;
        color: #FFFFFF !important;
        font-weight:bold !important;
     }

    /* CommonNew 헤더반전 이동  */
    .headerRevText a:hover {
    	text-decoration: none !important;
        color: #FFFFFF !important;
        font-weight: bold !important;
    }
 
    /* CommonNew 작명서비스 로그인 시 사용중 아이콘 표시 */
    .menuHeaderbulb{
        float: right;
        margin-top: -11px;
    }

    /* CommonNew 드롭리스트 메뉴 위치 */
    .dropList{ 
        width: 20px;
        height: 20px;
        float: right;
        margin-top: 9px !important;
        /* 버튼 위치 상하조절 가능 */
    }

    /* CommonNew 드롭리스트 버튼 크기 설정 */
    .menuTrigger {                
        position: relative;
        top: 0;
        left: 0;
    }

    /* CommonNew 메뉴트리거 */
    .menuTrigger, .menuTrigger span {
        display: block;
        transition: all .2s; /* 동작 속도 조절 */
        box-sizing: border-box;
    }

    /* CommonNew 드롭리스트 버튼 줄 모양 */
    .menuTrigger span {
        position: absolute;
        right: 0; /* 줄 정렬에 사용. */

        width: 100%;
        height: 4px; /* 선 두께 */

        background-color: #ffffff; /* 선 색깔 */
        border-radius: 0; /* 끝 모양 둥글게 */
    }

    /* CommonNew 첫째 줄 간격 및 위치(맨위) */
    .menuTrigger span:nth-of-type(1) { 
        top: 0;
    }

    /* CommonNew 둘째 줄 간격 및 위치(중간) */
    .menuTrigger span:nth-of-type(2) { 
        width: 80%; /* 줄 길이 조절 */
        top: 8px;
    }

    /* CommonNew 셋째 줄 간격 및 위치(끝) */
    .menuTrigger span:nth-of-type(3) { 
        bottom: 0;
    }

    /* CommonNew 첫번째 줄 애니메이션 */
    .menuTrigger.active-1 span:nth-of-type(1) {
        transform: translateY(8.5px) rotate(-45deg);
        /* translateY: X자로 변했을때 위치 지정(수직방향_상하) */
        /* roate: 기울기 조절 */
    }

    /* CommonNew 두번째 줄 애니메이션 */
    .menuTrigger.active-1 span:nth-of-type(2) {
    	/* 투명해 지면서 사라짐 */
        opacity: 0; 
    }

    /* CommonNew  세번째 줄 애니메이션 */
    .menuTrigger.active-1 span:nth-of-type(3) {
        transform: translateY(-7.5px) rotate(45deg); 
    }

    /* CommonNew 커서 */
    .dropList a {cursor:pointer;}
    
    /* CommonNew 평소 드롭리스트 메뉴 숨겨놓음 */
    .dropList .hide {display:none;}

    /* CommonNew 드롭리스트 메뉴 크기및 모양, 위치 설정 */
    .dropListMenu {
        position: absolute;
        top:70px;
        right:0px;
        width: 220px;
        height: auto;
        border-radius: 0px;
        background: #201026;
        color:#FFFFFF;
        text-align: center !important;
        z-index: 10000;
        margin-top:-10px;
        border-top: 1px solid #594D4D;
        border-bottom: 1px solid #594D4D;
        padding: 0;
    }

    /* CommonNew 드롭리스트 버튼 메뉴들 */
    .dropListMenu li{
        width: 100%;
        height: 45px;
        font-size: 1.1em;
        line-height: 45px;
        list-style-type: none !important;
        text-align:left;
        padding-left:10px;
        border-bottom:1px solid #594D4D !important; 
    }

    /* CommonNew  드롭리스트 메뉴들 링크 연결 */
    .dropListMenu a {
        display: block;
        width: 100% !important;
        height: 100% !important;
        color: #ffffff !important;
        font-weight: normal !important;
        cursor: pointer;
        text-decoration:none;
    }

    /* CommonNew 호버 */
    .dropListMenu li:hover,
    .dropListMenu li:active{
        background: #D8A228;
		text-decoration:none;
    }


    /*  CommonNew  드롭리스트 메뉴 마지막 줄 하단 여백 및 색상변경 및 높이 크게 */
    .dropListMenu li:last-child {
        background: #201026 !important;
		text-decoration:none !important;
        margin-bottom: 0% !important;
        height: 45px;
        line-height: 45px;
    }

 


/* Common 헤더============================================= */


/* Common breadScrum  헤더 전체영역 */
.bsHeaderClass {
    width: 100%;
    height: 34px;
    position: fixed;
    z-index:300;
    top:60px;
    left:0;
    background:#555555 !important;
    border-top: 1px solid #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
    box-shadow:none;
 	display:inline-block
 	
}

 /* Common breadScrum 메뉴 영역 */
 .bsMenu {
	display:block;
	text-align: left;
 }

 /* Common breadScrum 메뉴 내부 */
 .bsMenuInner {
     display: inline-block;
     background:transparent !important; 
     font-size:0.95em;
 }
 
 /* Common breadScrum 메뉴 내부 링크 */
.bsMenuInner a { 
    font-weight:normal !important;
    text-decoration: none !important; 
    text-shadow:none !important; 
    cursor:pointer !important; 
    color:#FFFFFF !important; 
    font-size:0.95em !important; 
}


.bsMenuInner a:hover { 
    font-weight:bold !important;
}
 
 /* Common breadScrum 종단마크  */
.bsmarkClass {
	height:34px;
	vertical-align:middle; 
	width:auto;
	margin-left:7px;
}
 
 
/* 개별 BS상자 박스  */
.bsBoxFirst {
	display:inline-block;
	padding-left:5px;
}
 
/* 개별 BS상자 박스 중간  */
.bsBoxMiddle {
	display:inline-block;
}
 
/* 개별 BS상자 박스 최종 : yellow */
.bsBoxEnd {
	display:inline-block;
}
 
.bsBoxEnd a {
	color:#C4E7FE !important; 
	display:inline-block;
	padding-left:7px;
}
 
 
/* Common 헤더 전체영역 */
.headerClass {
    width: 100%;
    height: 60px;
    position: fixed;
    top:0;
    left:0;
    z-index: 1000;
    background: #201026 !important;
    border-bottom: 1px solid #594D4D;
    text-shadow:none; 
 	text-decoration: none; 
}

.headerClass a { 
    text-decoration: none !important; 
}

/* Common 메인 우측 엔터큐브 로고 */
.mainLogo {
    float:left;
}

 

/* Common 헤더 내부 : 상하 패딩값으로 가운데 정렬 */
.headerInner{
    width:  100%;
    height: 40px;
    padding: 10px 0;
}

/* Common 메인 우측 엔터큐브 로고 a태그 영역 크기*/
.headerInner a {
    width: 100%;
    height: 100%;
}

/* Common 로고 이미지 크기 */
.logo_image {
    float:left;
    margin-top:6px;
    width:30px;
    height:auto;
}

/* Common 헤더 중간부분 전체 영역 */
.mainMenu{
    float:left;
    width:30%;
    height:100%;
}

/* Common 헤더 우측 로그인, 회원가입 감싼 영역(ul) */
.loginMember {
    float: right;
    margin: 0 auto;
}