/* ===  HEADER === */

@import url(https://fonts.googleapis.com/css2?family=Tinos:wght@400,700&display=swap);
@import url(https://cdn.rawgit.com/innks/NanumSquareRound/master/nanumsquareround.min.css);//나눔스퀘어라운드
@import url(https://fonts.googleapis.com/css2?family=Cal+Sans&family=Raleway:ital,wght@0,100..900,1,100..900&display=swap);//main_t

a {
	color: #fff;
	text-decoration: none;
	-webkit-transition: all .1s cubic-bezier(.645,.045,.355,1);
    transition: all .1s cubic-bezier(.645,.045,.355,1);
}
a:hover {
	text-decoration: none;
	color: #aaaaaa;
}
a:focus {
	text-decoration: none;
}
.header {
	background-color: rgb(255, 255, 255);
    transition: all 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
    top: 0;
    left: 0;
    position: fixed;
    width: 100%;
}
.header.header-transparent {
	background-color: rgb(255, 255, 255);;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    width: 100%;
}
.header > .container-fluid > .row > div, 
.header > .container > .row > div {
    width: 100%;
}

.header-column-icon-container {
    text-align: right;
    padding-top: 27px;
}
.header-column-icon-container .header-icon {
    float: none;
    margin-top: 0;
    margin-right: 0;
    margin-left: 20px;
    color: #222;
    cursor: pointer;
}
.header-column-icon-container .header-icon.header-icon-cart, 
.header-column-icon-container .header-icon.header-icon-search i {
    font-size: 20px;
}
.header-column-icon-container .header-icon.header-icon-canvas {
    margin-bottom: 2px;
}
.header-white .header-column-icon-container .header-icon {
    color: #fff;
}
.header-white .menu-button:before,
.header-white .menu-button span,
.header-white .menu-button:after {
	background-color: rgb(255, 255, 255);;
}
.headroom--not-top.header-transparent {
    background: #fff;
}
.header-white.headroom--not-top .main-navigation .main-menu > li > a {
    color: #222;
}
.header-white.bg-dark.headroom--not-top .main-navigation .main-menu > li > a {
    color: #ffffff;
}
.header-white.bg-dark.headroom--not-top .menu-button:before, 
.header-white.bg-dark.headroom--not-top .menu-button span, 
.header-white.bg-dark.headroom--not-top .menu-button:after {
	background-color:rgb(255, 255, 255);;
}
.header-1 .header-column-icon-container, 
.header-2 .header-column-icon-container {
    padding-right: 70px;
}
.header-1 > .container .header-column-icon-container, 
.header-2 > .container .header-column-icon-container {
    padding-right: 0px;
}
.header.container-wide > .container,
.header.container-wide-2 > .container {
	position: relative;
}

.header-mobile {
    display: none;
}

/* === MENUS === */
.main-navigation {
    z-index: 000;
    width: 100%;
	position: static;
    max-width: 100%;
    /* flex-basis: 80%; */
}
.main-navigation.fullwidth {
    max-width: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
}
.main-navigation .main-menu {
	margin-bottom: 0;
    line-height: 1.5;
    color: #222;
}
.main-navigation .main-menu > li {
    transition: all 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
    position: relative;
    display: inline-block;
    padding: 30px 30px;
    font-size: 16px;
	font-weight:400;
    -ms-flex-preferred-size: 80%;
}
.main-navigation .main-menu > li a {
    position: relative;
    z-index: 1;
    text-transform: uppercase;
	font-weight:400;
    color: #222;
}
.main-navigation .sub-menu {
    position: absolute;
    top: 150%;
    left: -25%;
    z-index: 2;
    visibility: hidden;
    font-size: 15px;
	margin: 6px;
    padding: 6px;
    width: 185px;
    border:1px solid #rgb(255.255.255.0.5);
	background-color: rgba(0,0,0,0.8);
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.main-navigation .sub-menu li {
    position: relative;
    display: block;
    padding: 10px 10px 10px 10px;
    right: 0px;
}
.main-navigation .main-menu > li > .sub-menu > li.menu-item-has-children:after {
    position: absolute;
    top: 50%;
    color: #222;

}
.main-navigation .main-menu > li .sub-menu a {
    transition: all 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.main-navigation .main-menu li:hover > .sub-menu {
    top: 100%;
    z-index: 999;
    visibility: visible;
    opacity: 1;
}
.main-navigation .main-menu li > .sub-menu .sub-menu {
    top: 0;
    left: 100%;
}
.main-navigation .main-menu > li.mega-menu {
    position: static;
}
.main-navigation .main-menu > li.mega-menu .sub-menu {
    width: 100%;
}
.main-navigation .main-menu > li.mega-menu > ul > li {
    padding: 0;
}
.main-navigation .main-menu > li.mega-menu > ul > li .column-inner {
    padding: 30px 0;
    width: 100%;
}
.main-navigation .main-menu > li .sub-menu a {
    color: #FFF;
    transition: all 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.main-navigation .main-menu > li.mega-menu > ul > li .mega-menu-content > .row > div:after {
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    height: 100%;
}
.main-navigation .main-menu > li.mega-menu > ul > li .mega-menu-content > .row > div:last-child:after {
    display: none;
}
.main-navigation .main-menu > li .sub-menu a:hover {
    color: #999;
}
.main-navigation .main-menu > li.mega-menu > ul > li .mega-menu-content .column-inner h4 {
    padding-left: 20px;
    margin-bottom: 10px;
    color: #222222;
    text-transform: uppercase;
    font-weight:400;   

}
.main-menu-top{font-family: "Raleway", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;}


.main-navigation .main-menu > li.mega-menu ul {
	padding: 0 0px;
}
.main-navigation .main-menu > li.mega-menu ul li {
    padding: 0px 0;
}
.main-navigation .main-menu > li.mega-menu > ul > li {
    padding: 0;
}
.header-1 .main-navigation, 
.header-2 .main-navigation {
    padding-left: 0px; text-align:center; margin-top:0.7%;
}
.header-white .main-navigation .main-menu > li > a {
    color: #fff;}

.site {
 	background-color: rgb(255, 255, 255);
   position: relative;
    z-index: 99999;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
}
.row {
    width: 98%;
    margin-left: 5%;
}
.site-branding {
    position: relative;
    z-index: 99999;
    margin-left:0%;
	margin-top:0.9%;
	margin-bottom:0.9%;
    max-width: 100%;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;	
}
.header-bottom-line:after {
    content: "";
    display: block;
    clear: both;
    width: 40px;
    height: 1px;
    background-color: #fff;
    margin-top: 22px;
}
.block-border {
	border: 1px solid #fff;
}
.highlighted-black {
    background-color: #fff;
    color: #fff;
}
.highlighted-yellow {
    background-color: #fee7af;
}
.page-open-mobile-menu {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	height: 100px;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	display: none;
}
.page-open-mobile-menu div {
	position: relative;
	width: 24px;
	height: 15px;
	cursor: pointer;
	margin-top: 6px;
}
.page-open-mobile-menu i {
	color: #222;
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -1px;
	width: 100%;
	height: 2px;
	background: currentColor;
	-webkit-transition: all .3s cubic-bezier(.645,.045,.355,1);
	transition: all .3s cubic-bezier(.645,.045,.355,1);
}
.page-open-mobile-menu i::after, 
.page-open-mobile-menu i::before {
	position: absolute;
	left: 0;
	width: 100%;
	height: 100%;
	background: inherit;
	content: " ";
	-webkit-transition: width .3s cubic-bezier(.645,.045,.355,1);
	transition: width .3s cubic-bezier(.645,.045,.355,1);
}
.page-open-mobile-menu i:before {
	top: -8px;
}
.page-open-mobile-menu i:after {
	top: 8px;
}
.page-open-mobile-menu.dark i {
	color: #222;
}
.headroom.headroom--not-top .page-open-mobile-menu i {
	color: #222;
}

.col-md-10 {
	display: block;
}



/* ===  MOBILE MENU === */
.page-mobile-main-menu {
	position: fixed;
	top: 0;
	right: 100%;
	z-index: 9999999;
	overflow-x: auto;
	width: 100%;
	height: 100%;
	background: #fff;
	box-shadow: 3px 1px 29px rgba(0,0,0,.12);
	text-align: left;
	-webkit-transition: all .3s;
	transition: all .3s;
	background-color: rgba(0,0,0,0.7);
}
.page-mobile-main-menu.open {
	right: 0;
}
.page-mobile-menu-header {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	padding: 30px;
	height: 95px;
	background: #fff;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
}
.page-mobile-menu-logo {
	-webkit-box-flex: 1;
	-webkit-flex-grow: 1;
	-ms-flex-positive: 1;
	flex-grow: 1;
    margin-left: 3%;
    padding-top: 0.5%;
    padding-bottom: 0.5%;
    padding-right: 2%;
}
.page-mobile-menu-logo img {
	width: 100%;
}
.page-close-mobile-menu {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	height: 30px;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
}
.page-close-mobile-menu div {
	position: relative;
	width: 24px;
	height: 14px;
	cursor: pointer;
}
.page-close-mobile-menu i {
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -1px;
	width: 100%;
	height: 2px;
	background: transparent;
	-webkit-transition: all .3s cubic-bezier(.645,.045,.355,1);
	transition: all .3s cubic-bezier(.645,.045,.355,1);
}
.page-close-mobile-menu i:after, 
.page-close-mobile-menu i:before {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #1a237e;
	content: "";
	-webkit-transition: width .3s cubic-bezier(.645,.045,.355,1);
	transition: width .3s cubic-bezier(.645,.045,.355,1);
}
.page-close-mobile-menu i:before {
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.page-close-mobile-menu i:after {
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}
.page-mobile-main-menu .mobile-menu {
	margin: 0;
	padding: 20px 30px 30px;
}
.page-mobile-main-menu li {
	display: block;
	list-style-type: none;
}
.page-mobile-main-menu .mobile-menu a {
	position: relative;
	display: block;
}
.page-mobile-main-menu .mobile-menu a {
	font-weight: 400;
	letter-spacing: 0em;
	line-height: 1.5;
	text-transform: none;
}
.page-mobile-main-menu .mobile-menu > li > a {
	padding: 10px 0;
	border: 0;
	border-color: transparent;
    font-family:'NanumSquareRound','Noto Sans KR','Nanum Gothic', sans-serif;    
    font-size: 15px;
	color: #fff;
}
.page-mobile-main-menu .mobile-menu > li+li > a {
	border-top: 1px solid rgba(255,255,255,.1);
}
.page-mobile-main-menu .sub-menu a {
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 0;
	padding-right: 0;
    font-family:'NanumSquareRound','Noto Sans KR','Nanum Gothic', sans-serif;    
    font-size: 15px;
	color: #fff;
}
.page-mobile-main-menu .sub-menu {
	display: none;
	margin: 12px 0 14px 10px;
}
.page-mobile-main-menu .sub-menu.open {
	display: block;
}


/* --------------------------------------------------------------------- */
@media (min-width: 768px) {
	.container-wide > .container,
	.container-wide-2 > .container {
		max-width: 64rem;		
	}	
	
	
	.header-1 .header-column-icon-container, .header-2 .header-column-icon-container{
	    right: 0%;
        position: absolute !important;
	}
	
	
.crosscover {

	height:50vw !important;
  }
	
}


@media all and (min-width:480px) and (max-width:767px) {

  .col-md-10 {	
		display: none !important;
    }
	
}


@media (min-width: 992px) {
	.header-column-icon-container .header-icon {
		display: inline-block !important;
	}
	
	
}
@media (min-width: 1024px) {
	.left-content {
		float: left;
		width: 215px;
		padding-bottom: 30px;
	}
	.left-content .left-wrapper {
		padding: 50px;
	}
	.right-content {
		position: relative;
    	overflow: hidden;
    	width: calc(100% - 215px);
	}
	.container-wide > .container,
	.container-wide-2 > .container {
		max-width: 96rem;
	}
	.gotoshop > div {
		border-right: 1px solid #ddd;
	}
}
@media (min-width: 1280px) {
	header.headroom--not-top {
		position: fixed;
		top: 0;
		right: 0;
		left: 0;
		z-index: 999;
		background-color: #fff;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
	}
	.headroom--not-top.headroom--unpinned {
		transform: translate3d(0, 0, 0);
	}
	.heli-creative-studio h2 {
		padding-top: 70px;
		padding-bottom: 70px;
	}
	.container-wide > .container,
	.container-wide-2 > .container {
		max-width: 1200px;
	}
	.sidebar {
		padding-left: 20px;
	}
	blockquote {
		font-size: 15px;
	}
}
@media (min-width: 1280px) {
	.container-wide > .container {
		max-width: 1810px;
	}
	.container-wide-2 > .container {
		max-width: 1460px;
	}
}
@media (max-width: 1280px) {
	.main-navigation .main-menu > li {
		padding: 20px 10px;
	}
	.main-navigation {
		font-size: 10px;
	}
	.header-1 .header-column-icon-container, 
	.header-2 .header-column-icon-container {
		padding-right: 15px;
	}
}
@media (max-width: 1024px) {
	.page-open-mobile-menu {
		display: inline-block;
	}
	.blog-item.style-3 .post-thumb .dates {
		display: none;
	}
}
@media (max-width: 768px) {
	.header-1 .header-column-icon-container, 
	.header-2 .header-column-icon-container,
	.header-1 > .container .header-column-icon-container, 
	.header-2 > .container .header-column-icon-container {
		padding-right: 20px; 
	}
	.left-menu-content #main {
    	margin-left: 0px;
	}
	
	.header-1 .header-column-icon-container, .header-2 .header-column-icon-container{
	    right: 0%;
        position: absolute !important;
	}
	
	.header-mobile {
    	display: block;
    	width: 100%;
	}
	.header-onepage .main-navigation .main-menu > li {
		padding: 15px 5px;
	}
	.section-bg-33, .section-bg-51 {
		background-image: none;
		background-color: #fff;
	}
	.content-middle {
		position: relative;
		top: 0;
		left: 0;
		transform: translate(0%, 0%);
		padding: 50px 20px;
	}
	
	.site-branding {
		width: 80% !important;
	}
	
.col-md-10 {
    display: none !important;
   }	
   
   
   .crosscover {

	height:50vw !important;
  }
	
   
}
@media (max-width: 480px) {
	.header-column-icon-container {
		padding-top: 10px;
	}
	.header-onepage .site-branding,
	.header-onepage .main-navigation {
		max-width: 100%;
		text-align: center;
		display: block;
		width: 100%;
		padding-left: 0;
		-ms-flex-preferred-size: 100%;
		flex-basis: 100%;
		width:80%
	}
	.header-onepage .main-navigation {
		font-size: 13px;
	}
	.site-branding {
		width:75%;
	}
	
	.col-md-10 {
		display: none !important;
	}	
	
	.site-branding {
		width: 80% !important;
	}
}

@-webkit-keyframes sk-cubemove {
    25% {
        -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);
    }
    50% {
        -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);
    }
    75% {
        -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
    }
    100% {
        -webkit-transform: rotate(-360deg);
    }
}

@keyframes sk-cubemove {
    25% {
        transform: translateX(42px) rotate(-90deg) scale(0.5);
        -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);
    }
    50% {
        transform: translateX(42px) translateY(42px) rotate(-179deg);
        -webkit-transform: translateX(42px) translateY(42px) rotate(-179deg);
    }
    50.1% {
        transform: translateX(42px) translateY(42px) rotate(-180deg);
        -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);
    }
    75% {
        transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
        -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
    }
    100% {
        transform: rotate(-360deg);
        -webkit-transform: rotate(-360deg);
    }
}